一、概述
1.1 js语言
- js是在浏览器中运行的一种语言，即客户端语言，用于验证表单信息（邮箱、手机格式等），页面的局部更新（dom操作），浏览器的操作（bom0操作）。
- js是解释型语言，无需编译，直接运行在js解释器上，java/c为编译型语言：java->.class 再运行到jvm上、c->.out 再运行到linux上。
1.2 js解释器
最初IE、网景都推出了包含js解释器的浏览器，因其解释器并不统一，所以相应的js标准就也不一样，产生了很多兼容性问题。
1.3 js组成
- ECMAScript5（Javascript标准）
语法：变量、关键字、保留字、表达式、流程控制语句、对象、函数、数组...
DOM: Document Object Model （文档对象模型，浏览器厂商通过es5编写的控制html/css的代码）
document.getElementById(); dom.addEventListener() dom.attachEvent()BOM: Browser Object Model （浏览器对象模型，浏览器厂商通过es5编写的控制浏览器的代码）
alert(); setTimeout(function(){ },1000) XMLHttpRequest (ajax)
（Dom和Bom都会有不兼容的情况，因为是由各自的浏览器编写的。）
1.4 nodejs
google将各类浏览器中的js解释器重新归并整合为nodejs，使其可以安装在任意的服务器端，nodejs中提供了大量的基础库,file、http,这个时候js就具备了服务器端能力。
在nodejs中不存在兼容性问题，因为nodejs中压根就没有dom/bom，因此不能在nodejs中执行任何dom和bom代码，由于不存在兼容性问题，nodejs可以大量发挥js高级标准，所以ES6语法一般在nodejs中可以完全运行。(在浏览器中可以部分运行）
1.5 js执行
在nodejs中
- 在vi中编辑（es5）
- 在nodejs中执行
在浏览器中
- 在vscode中编辑（es5、dom、bom）
html --> <script></script>(一般该标签位于<body>标签前)
- 在浏览器中执行
- 在vscode中编辑（es5、dom、bom）
二、注释
html: <!-- 注释 -->
css: /**/
Js: //单行注释
/*多行注释*/
三、关键字和保留字
保留字 --> 将来可能成为关键字
四、变量
4.1 弱类型语言
Js 是弱类型语言
1) 变量的数据类型在初始化的时候确定
2) 变量的数据类型可以随时发生改变
3) 类型细分不明显
var a; a = 2; a = "二"
Java 是强类型语言
1)变量的数据类型在声明的时候确定
2)变量的数据类型一定确定不能更改
int a; a = 2;
String b ; b = "hello world"
double c = 2.5;
4.2 var
（let 变量、const 常量，es6出现）
var变量可以重复声明
var a = 3; var a = "hello world"var变量声明会被提升 (函数的声明也会)
var a; console.log(a) a=3;console.log(a); var a = 3;（上下等价）
var声明的变量没有局部作用域
function foo(){ if(true){ var a = 3; console.log("inner",a); } console.log("outer",a); } foo();
五、数据类型
5.1 分类
5.1.1 基本数据类型
变量的值（简单值）是保存在栈区
- Number
var a = 2;
var a = 2.1;
var a = 0X10;
var a = 010; String
var a = "hello world"
var a = 'hello world'
var a = `hello world`;
json字符串-对象（属性名必须用双引号）
var json = '{"name":"terry","age":12}'- Boolean
var a = true;
var a = false; - Null(空指针对象)
var a = null; - Undefined
var a;
var a = undefined;
5.1.2 引用数据类型（指针）
变量的引用地址保存在栈区，真正的值（复杂值）保存在堆区
除了基本数据类型之外的所有其他数据类型被称为引用数据类型
var a = {name:"terry",age:12}
var a = [18812344321,15912344321];
var a = function(){}
var a = /[abc]def/i //正则表达式5.2 类型检测
var a = 3;
typeof a; //输出'number'
typeof null/[]/{}; //输出'object'
typeof undefined //输出'undefined'5.3 深拷贝浅拷贝
浅拷贝【地址拷贝】
//对象浅拷贝 var a = {name:"terry",age:12} var b = a; b.age++; console.log(a.age); //a.age=13//数组浅拷贝 var arr = [[1,2,3],[1,3,4]]; b[0] = arr[0][0]; b[0]++; console.log(arr[0][0]); //arr[0][0]=2- Object.assign({},a)
深拷贝【克隆】(基本数据类型都是深拷贝)
对象 ->json格式的字符串 -> 对象
var a = {name:"terry",age:12} var c = JSON.parse(JSON.stringify(a));- lodash
5.4 其他
NaN--not a number
var result = 10/'a' //NaN console.log(isNaN(result)); //trueInfinity、-Infinity--无穷大
var result = 10/0; //Infinity var result = -10/a; //-Infinity console.log(isFinite(result)); //false
六、操作符
表达式由操作符和操作数组成
6.1 算术操作符
允许非number类型的操作数进行运算，在运算之前，一般需要先将其他数据类型转换为数字类型再进行运算
+、 +=
var a = 3; var b += a; var result = 1 + 2 var result = 1 + true;当操作数中出现了字符串，+ 运算就变成了字符串拼接运算。
var result = true + '1'; // true1-、-=
var result = 3 - 2; var result = 3 - true; //2 var result = 3 - 'a' //NaN*、*=
var result = 2 * 3;/、/=
var result = 5/2;%、%=
var result = 5%2;
6.2 比较操作符
运算结果一般为boolean
- <
- <=
- =
== 等于
将操作数转换为同一数据类型再进行比较
1) 比较基本数据类型的值
2) 比较引用数据类型的引用地址。
var a = {name:"terry"} var b = {name:"terry"} var result = a == b; //false var result = '{"name":"terry"}' == '{"name":"terry"}' //true,因为两个对象是字符串而不是对象 var result = NaN == NaN //false var result = null == undefined //true=== 全等
先比较两个操作数的数据类型，如果数据类型不一致，直接返回false,当数据类型一致的时候才对比值
var result = 1 == "1" // true var resule = 1 === "1" // false var result = null === undefined //false
如何比较两个对象的属性是否一致
1. 先将对象序列化为json字符串
2. 对json字符串进行对比
6.3 逻辑操作符【短路运算符】
&&
返回值不一定是boolean类型true && false // false
true && true // true
var a ; var result = a && 3; //undefined var result = 3 && a; //undefined var result = "hello world" && 3; //3||
true || false; //true
false || false; //falsevar result = 1>2 || 'hello'; // hello,1>2为false，但是无法确定整个表达式的结果，整个表达式的结果取决于第二个表达式，将其返回即可。 var result = 1<2 || 'hello' // true,1<2为true,能确定整个表达式的结果，无需进行接下来的运算。!
!true //false
!false //true
!!true //true
将其他数据类型转换为boolean类型var result = !"hello" //false var result = !!"hello" //true
6.4 三目操作符
表达式1 ? 表达式2 : 表达式3
如果表达式1为真，返回表达式2；如果表达式1为假，返回表达式3
6.5 一元运算符
- +
+3 //3
一元加运算符后的操作数如果是其他数据类型，则转换为数字类型
+true //1+'23' //23,前提是加号前无变量
- -
一元减，负
-3 //-3
-true //-1
-(-true) //1-(-'123') //123
- ++
- 自增
var a = 3;
var result = a++ + ++a
console.log(result); //8，++a先执行，即4+4，表达式执行结束后，执行a++，a的值变为5
console.log(a); //5- --
自减
6.6 位运算 *
原、反、补
针对于数字类型的值进行运算，在运算之前先转换为二进制
- &
- |
- ^
七、类型转换
* -> 数字类型
通常在dom中或者是从后端拿到的数据不是纯数字类型，但是需要进行数学运算，在运算之前要先转换为数字类型- Number(a)
- +a
- -(-a)
- parseInt(a)
var a = parseInt(10,16) //16,第二个参数为进制设置- parseFloat(a)
* -> 布尔类型
- Boolean(a)
false : null 0 undefined NaN "" Infinity...
true: {} [] 1 "hello"
- !!a
- if(exp1){ }
exp1 可以是任意数据类型，因为js在执行过程中会自动将其转换为boolean
- Boolean(a)
* -> 字符串类型
- String(a)
- a+""
八、流程控制语句
8.1 分支语句
8.1.1 if 分支
if(exp){
xxx
}当exp为true或者可以被转换为true的时候，大括号内部的代码会执行
if(exp){
} else {
} 当exp为true,执行if代码块的内容，否则执行else代码块的内容
if(exp1){
} else if(exp2) {
else {
}8.1.2 switch分支
解决if-else if -...-else繁琐，switch更加简洁一些
switch(v){
case c1:
...
break;
case c2:
...
break;
...
default:
...
}v 表示变量
c1、c2、c3、... 常量
当 v === c1的时候，执行c1代码块中的内容，break表示跳槽switch代码块，如果不加break，后续代码都会执行直到遇到break或者switch结束
default代码块可以位于switch中的任意位置，但是要注意，如果不是位于最下方，一定在代码块中添加break
8.2 循环语句
要素：初始条件，结束判定条件，累加
8.2.1 for
for(初始化条件; 结束判定条件; 累加){
循环体
}8.2.2 while 前置判断循环
初始化条件
while(结束判定条件){
迭代
}8.2.3 do-while
初始化条件
do {
迭代
} while(结束判定条件);8.2.4 for-in
用于遍历数组或者对象
for(var key in obj){
}
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用。你还可以使用@来通知其他用户。