Web前端技术详解（JavaScript篇）

学习网址：https://wangdoc.com/javascript/index.html

1. JavaScript特点

动态类型语言：变量类型无限制，可随时改变类型。
变量提升（hoisting）：JavaScript引擎工作时，先解析代码，获取所有被声明的变量，然后一行行运行。结果导致所有的变量声明语句被提升到代码头部，即变量提升。

2. 基本语法

语句与表达式
语句（statement）:为完成某种任务而进行的操作，例如赋值语句：var a = 1+3;
表达式（expression）:为了得到返回值的计算式，例如：1+3;
两者区别在于表达式一定会有返回值。

标识符命名规则（区分大小写）：
首位字符：任意Unicode字母，以及$和_； 非首位字符：任意Unicode字母，以及$和_，数字0-9。

注释
单行注释：以//开头；
多行注释：放在/*...*/ 之间；
其他：由于可兼容HTML，<!--和--> 也被视为合法单行注释，–>只有在行首时，其之后的部分才会被注释掉。

运算符
严格相等运算符（===）：比较时不发生类型转换；
相等运算符（==）：比较时发生类型转换。

break和continue：
break：跳出代码块（以花括号包围）或循环（for、while等）；
continue：终止本轮循环，开始下一轮。
配合标签跳转：可直接跳转到标签定位位置。
默认跳转：如果存在多重循环，不带参数的break语句和continue语句都只针对最内层循环。

———-2018.07.09更新

3. 数据类型

JavaScript共有六种数据类型：number、string、boolean、undefined、null、object
ES6新增了Symbol类型。

按细分程度划分：
原始类型（primitive type，最基本、不可再细分）：number、string、boolean
合成类型（complex type，多个原始类型的合成）：object
其他：undefined、null

类型判断
typeof运算符
instanceof运算符
Object.prototype.toString方法
（注意：null的类型是object）

布尔值
JavaScript在将值转化为布尔值时，转化规则如下：
转为false：undefined、null、false、0、NaN、“”或‘’（空字符串）。
其他都视为true：[]（空数组）、{}（空对象）等。

———-2018.07.11更新

函数
声明方式：function命令、函数表达式、Function构造函数。
重复声明：同一函数被多次声明，由于函数名的提升，后面的声明会覆盖前面的声明。
参数个数：<函数名>.length。
函数源码：<函数名>.toString()，返回函数源码。
函数作用域：
· var命令的局部变量只能在函数内部声明，其他区块声明一律为全局变量。
· 函数内部的变量提升：var命令声明的变量都会被提升到函数体的头部。

函数参数
省略：
· 函数参数不是必须的，未填入的参数位置被传入undefined。
传递方式：
· 参数为原始类型（数值、字符串、布尔值）：值传递，函数体内修改参数值不会影响函数外部。
· 参数为复合类型（数组、对象、其他函数）：传址传递，函数体内修改参数，会影响到原始值。
注意：传址传递中，函数内部对传参的替换，不会影响到原始值。
同名参数：
如果有同名的参数，取最后出现的值。
函数闭包：定义在一个函数内部的函数。
· 作用：1. 可读取函数内部的变量；2. 让变量始终保持在内存中，即闭包可以使得它诞生环境一直存在；3. 封装对象的私有属性和私有方法。

———-2018.07.12更新

立即调用函数表达式（IIFE）
（）：Javascript中的圆括号（）是一种运算符，跟在函数名之后，表示调用该函数，如print()。
JavaScript引擎规定，function出现在行首，一律解释成语句。

JavaScript引擎：用于处理JavaScript脚本的虚拟机，一般附带在浏览器之中。例如SpinderMonkey、Chakra、JavaScriptCore等。
参考资源：深入了解JavaScript引擎精华 - 前端之巅

eval命令
eval(字符串参数)：将此字符串当做语句执行。
其他：JavaScript标准规定，凡是使用别名执行eval，eval内部一律是全局作用域。

数组
数组本质：数组属于一种特殊的对象，typeof运算符返回数组类型是object。
length属性（可写）：JavaScript 使用一个32位整数，保存数组的元素个数。这意味着，数组成员最多只有 4294967295 个（232 - 1）个，也就是说length属性的最大值就是 4294967295。
in运算符：检查键名是否存在。
数组遍历：1. for…in循环，可遍历所有数组内容；2. for(var i=0;i<array.length;i++)或while(i<array.length)等可用于遍历整数键数组；3. array.forEach(function(cm){console.log(cm);});可用于遍历数组。
数组的空位：
使用数组的forEach方法、for..in结构以及Object.leys方法进行遍历，空位都会被跳过。
数组的slice方法可以将“类似数组的对象”变成真正的数组。

运算符
JavaScript共提供10个算术运算符：+、-、*、/、**（指数）、%（求余）、++（自增）、–（自减）、+x（数值运算符）、-x（负数值运算符）。
运算符中只有+会发生重载：运算子的不同会导致不同的语法行为。例如：

‘3’+4+5； // '345'
3+4+'5'; // '75'

%余数运算符：运算结果的正负号由第一个运算子的正负号决定。

———-2018.07.13更新

4. 语法专题

强制类型转换

Number()
String()
Boolean()

5. 面向对象编程（OOP）

JavaScript的对象体系是基于构造函数（constructor）和原型链（prototype）的。