一、概述
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)); //true -
Infinity、-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){}