引言:javascript
ECMAScript 和 JavaScript 的关系是,前者是后者的规格,后者是前者的一种实现(另外的 ECMAScript 方言还有 JScript 和 ActionScript)。平常场合,这两个词是能够互换的。html
ES6 既是一个历史名词,也是一个泛指,含义是 5.1 版之后的 JavaScript 的下一代标准,涵盖了 ES201五、ES201六、ES2017 等等,而 ES2015 则是正式名称,特指该年发布的正式版本的语言标准。本书中提到 ES6 的地方,通常是指 ES2015 标准,但有时也是泛指“下一代 JavaScript 语言”。java
Babel 是一个普遍使用的 ES6 转码器,能够将 ES6 代码转为 ES5 代码,从而在现有环境执行。(Google 公司的Traceur转码器,也能够将 ES6 代码转为 ES5 代码。Traceur 容许将 ES6 代码直接插入网页,Traceur 也提供一个在线编译器,能够在线将 ES6 代码转为 ES5 代码)git
1.变量与做用域github
var 能够重复声明,没法限制修改,没有块级做用域(即{})json
let :不能重复声明,变量-能够修改,块级做用域,数组
const:不能重复声明,常量-不能够修改,块级做用域浏览器
注:安全
let
命令不存在变量提高,它所声明的变量必定要在声明后使用babel
在代码块内,使用let,const
命令声明变量以前,该变量都是不可用的。这在语法上,称为“暂时性死区”,“暂时性死区”也意味着typeof
再也不是一个百分之百安全的操做。
let
不容许在相同做用域内,重复声明同一个变量。
for
循环还有一个特别之处,就是设置循环变量的那部分是一个父做用域,而循环体内部是一个单独的子做用域。
ES5 规定,函数只能在顶层做用域和函数做用域之中声明,不能在块级做用域声明。(可是,浏览器没有遵照这个规定,为了兼容之前的旧代码,仍是支持在块级做用域之中声明函数)
ES6 引入了块级做用域,明确容许在块级做用域之中声明函数。ES6 规定,块级做用域之中,函数声明语句的行为相似于let
,在块级做用域以外不可引用。
2.箭头函数:
function hanshu(){}等价于 去掉function 加上=>
()=> {}
只有一个参数,可省略()
只有一个return,可省略{}
3.函数的参数:
a.参数扩展(收集参数-必须最后一个参数rest parameter,展开数组)
b.默认参数:function hanshu(a,b=10,c=5){} 即传了参数则以传的参数为准,不传则以默认值为准
4.解构赋值:
左右两边结构一致,右边必须是个东西(是个json是个数组对象都行,合法),声明跟赋值要在一块儿,如let [a,b,c] = [1,2,3];
数组,json,数组对象字符串等嵌套均可解构赋值。let {a,b,c} = {a:1,b:2,c:3}
如:let [{a,b},[n1,n2,n3],num,str] = [{a:10,b:13},[1,2,3],56,'qwer']------可控制粒度,即控制输出形式
let [obj,arr,num,str] = [{a:10,b:13},[1,2,3],56,'qwer'] -----输出为json和数组形式
不彻底解构,即等号左边的模式,只匹配一部分的等号右边的数组。这种状况下,解构依然能够成功。
解构赋值容许指定默认值。默认值能够引用解构赋值的其余变量,但该变量必须已经声明。
对象的解构赋值,能够很方便地将现有对象的方法,赋值到某个变量。
对象的解构赋值的内部机制,是先找到同名属性,而后再赋给对应的变量。真正被赋值的是后者,而不是前者。(注意,对象的解构赋值能够取到继承的属性。)
对象的解构也能够指定默认值。默认值生效的条件是,对象的属性值严格等于undefined
。
若是要将一个已经声明的变量用于解构赋值,必须很是当心。
// 错误的写法 let x; {x} = {x: 1}; // SyntaxError: syntax error
上面代码的写法会报错,由于 JavaScript 引擎会将{x}
理解成一个代码块,从而发生语法错误。只有不将大括号写在行首,避免 JavaScript 将其解释为代码块,才能解决这个问题。
// 正确的写法 let x; ({x} = {x: 1});
上面代码将整个解构赋值语句,放在一个圆括号里面,就能够正确执行。
字符串也能够解构赋值。这是由于此时,字符串被转换成了一个相似数组的对象。而相似数组的对象都有一个length
属性,所以还能够对这个属性解构赋值。
解构赋值时,若是等号右边是数值和布尔值,则会先转为对象。解构赋值的规则是,只要等号右边的值不是对象或数组,就先将其转为对象。因为undefined
和null
没法转为对象,因此对它们进行解构赋值,都会报错。
5.函数的解构赋值:
函数的参数也可使用解构赋值。函数参数的解构也可使用默认值,函数参数自己设置默认值也能够。函数的参数能够是数组对象,
6.字符串扩展:
ES6 为字符串添加了遍历器接口(详见《Iterator》一章),使得字符串能够被for...of
循环遍历。
模板字符串(template string)是加强版的字符串,用反引号(`)标识。它能够看成普通字符串使用,也能够用来定义多行字符串,或者在字符串中嵌入变量。模板字符串中嵌入变量,须要将变量名写在${}
之中。大括号内部能够放入任意的 JavaScript 表达式,能够进行运算,以及引用对象属性。全部模板字符串的空格和换行,都是被保留的,好比<ul>
标签前面会有一个换行。若是你不想要这个换行,可使用trim
方法消除它。模板字符串之中还能调用函数。若是大括号中的值不是字符串,将按照通常的规则转为字符串。好比,大括号中是一个对象,将默认调用对象的toString
方法。若是模板字符串中的变量没有声明,将报错。因为模板字符串的大括号内部,就是执行 JavaScript 代码,所以若是大括号内部是一个字符串,将会原样输出。模板字符串甚至还能嵌套。若是须要引用模板字符串自己,在须要时执行,能够写成函数。
模板字符串的功能,不只仅是上面这些。它能够紧跟在一个函数名后面,该函数将被调用来处理这个模板字符串。这被称为“标签模板”功能(tagged template)。
alert`123` // 等同于 alert(123)
标签模板其实不是模板,而是函数调用的一种特殊形式。“标签”指的就是函数,紧跟在后面的模板字符串就是它的参数。“标签模板”的一个重要应用,就是过滤 HTML 字符串,防止用户输入恶意内容。