JS 学习笔记一 (基础)

简介: JS 学习笔记一 (基础)

1. 生命周期


htmI页面中出现


推荐将 JS 代码写在 html 结束标签后面。 推荐将多个 JS 文件合成一个 JS 文件。


  • 外链式


3. 输出消息的几种方式


  • alert() 在页面弹出一个对话框,早期 JS 调用使用。


alert("");


  • confirm() 在页面弹出一个对话框,比 alert 弹出的框多了一个取消按钮,常配合 if 判断使用。


confirm("");


  • console.log() 将信息输入到控制台,用于 JS 调试。


console.log("");


  • prompt() 在页面弹出一个对话框,弹框上可以输入信息。


prompt("");


  • document.write("") 在HTML页面中输出消息,支持输出标签。


document.write("");


4. 命名规范


  • 不能使用纯数字或数字开头定义变量
  • 不能使用纯特殊字符或者开头(“_”除外)定义变量
  • 不推荐使用汉字定义变量
  • 不能使用关键字定义变量
  • 不推荐使用保留字定义变量
  • JS中区分字母大小写。


5. 简单数据类型


  • 数据类型判断


typeof("");


  • number : 数字类型
  • string : 字符串类型
  • boolean : 布尔类型
  • undefined : 变量未初始化


var str; // 定义了变量,但是没有给变量赋值,那么该值数据类型就是 undefined。


  • null : 空值空对象


var str = null; // 表示变量值为空 ,该变量在内存中是不存在的,真正的空。数据类型位 object。


  • Date 使用


  • Math 使用


  • 数字类型转字符串


var num = 1; var str= String(num); var str= num.toString();


  • 字符串转数字类型


◇ Number


var num = Number("1");


☆ 数字类型的字符串,转换之后得到的数字。 ☆ 非数字字符串,转换之后得到是NaN。 ☆ 小数类型的字符串,转换之后得到的是原数字。


◇ parseInt


var num = parseInt("1");


☆ 整数数字类型的字符串长转换之后得到的整数数字。 ☆ 数字开头的字符串,转换之后得到的是前边的数字。 ☆ 非数字开头的字符串,转换之后得到的是NaN。 ☆ 小数类型的字符串,转换之后取整。


◇ parseFloat


var num = parseFloat("1");


☆ 整数数字类型的字符串,转换之后得到的整数数字。 ☆ 数字开头的字符串,转换之后得到的是前边的数字。 ☆ 非数字开头的字符串,转换之后得到的是NaN。 ☆ 小数类型的字符串,转换之后得到的是原数字。


◇ Boolean


var bl = Boolean("1");


☆ 数字和字符串转完之后为true。 ☆ undefined、null、 0转完之后为false。


6. 等号运算符

  • “==” 只判断内容是否相同,不判断数据类型。
  • “===” 不仅判断内容,还判断数据类型是否相同。
  • “!=” 只判断内容是否不相同,不判断数据类型。
  • “!==” 不仅判断内容是否不相同,还判断数据类型是否不相同。

7. JS中offsetTop、clientTop、clientX、scrollTop各位置属性详解

JS中offsetTop、clientTop、scrollTop、offsetTop各位置属性详解 offsetTop


箭头函数


注意使用 try{ } catch (error) { } 包裹起来使用,不然在部分浏览器会有问题。


import Vue from 'vue'
  import Vuex from 'vuex'
  Vue.use(Vuex)
  let defaultCity = '上海'
  try {
     if (localStorage.city) { defaultCity = localStorage.city }
  } catch (error) { }
  export default new Vuex.Store({
      state: {
        city: defaultCity
      },
      mutations: {
        changeCity (state, city) {
          state.city = city
            try {
                localStorage.city = city
            } catch (error) {  }
         }
      }
  })

  • 实参与形参
  1. 比如你定义一个函数 void add(int a, int b),这里的a和b就是形参。
  2. 当你进行函数调用的时候,add(1, 2),这里的1和2就是实参。

相关文章
|
2月前
|
JavaScript 前端开发 API
Vue学习笔记3:对比纯JavaScript和Vue实现数据更新的实时视图显示
Vue学习笔记3:对比纯JavaScript和Vue实现数据更新的实时视图显示
|
27天前
|
JavaScript 前端开发
【干货分享】JavaScript学习笔记分享
【干货分享】JavaScript学习笔记分享
52 0
|
2月前
|
Web App开发 前端开发 JavaScript
HTML/CSS/JS学习笔记 Day3(HTML--网页标签 下)
HTML/CSS/JS学习笔记 Day3(HTML--网页标签 下)
|
4月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的云的学习笔记系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的云的学习笔记系统附带文章源码部署视频讲解等
37 0
|
6月前
|
移动开发 JavaScript 前端开发
webgl学习笔记3_javascript的HTML DOM
webgl学习笔记3_javascript的HTML DOM
64 0
webgl学习笔记3_javascript的HTML DOM
|
6月前
|
JavaScript 前端开发 Java
webgl学习笔记2_javascript基础快速学习
webgl学习笔记2_javascript基础快速学习
50 0
|
6月前
|
前端开发 JavaScript API
JavaScript学习笔记(一)promise与async
JavaScript学习笔记(一)promise与async
|
6月前
|
存储 JavaScript
【ES6系列第二篇】适用JS初学者的Set对象和Map对象学习笔记
【ES6系列第二篇】适用JS初学者的Set对象和Map对象学习笔记
48 0
|
12月前
|
存储 JavaScript 前端开发
【js】函数概述学习笔记(8)
【js】函数概述学习笔记(8)
41 0
|
12月前
|
存储 JavaScript
【js】数组学习笔记(7-2)
【js】数组学习笔记(7-2)
62 0