es6读书笔记

2018-12-14  本文已影响0人  广州芦苇科技web前端

标签: es6入门读书笔记


let命令

let与var的区别

暂时性死区

var tmp = 12
if (true) {
    console.log(tmp)//ReferenceError: tmp is not defined
    let tmp
}

上面的代码在块级作用域中使用let声明了tmp那么在操作tmp时就不会去块级作用域外部寻找了,而变量声明又在使用之后那么就会报错。

块级作用域

ES6新增的块级作用域的特点是:外层作用域无法读取内层作用域的变量。内层作用域可以定义外层作用域的同名变量而不会覆盖外层作用域的变量。

ES5规定,函数只能在顶层作用域中声明,不能够在块级作用域中声明,但是在浏览器中这么写不会报错,但是由于函数的声明提示,在块级作用域中声明的函数与在全局作用域中声明的函数没有区别,但是根据ES5的规定,这么做是非法的。

但是在ES6中引入块级作用域之后,允许在块级作用域中声明函数,块级作用域中的函数声明的行为类似于let,在块级作用域之外无法引用。

但是注意,为了减轻因为新的处理规则而带来的不兼容的问题,浏览器的实现会有所不同,在ES6浏览器中,处理规则如下:

在浏览器的ES6环境中下面的代码会报错:

// 浏览器的 ES6 环境
function f() { console.log('I am outside!'); }

(function () {
  if (false) {
    // 重复声明一次函数f
    function f() { console.log('I am inside!'); }
  }

  f();
}());
// Uncaught TypeError: f is not a function

const命令

const声明一个只读的常量,声明之后常量的值就不可以改变,另外cosnt命令也具备let命令所有特性:

const声明值不可变得本质:

如果想将一个对象冻结,使其属性无法改变,可以使用object.freeze()方法。一旦对对象使用了这个方法,那么如果试图修改对象的属性时,在常规模式下就不起作用,而在严格模式下对报错。

顶层对象属性

在ES5中在全局作用与声明的所用变量都作为顶层对象的属性,在浏览器中顶层对象是window,在Node中顶层对象是global,但是ES6中为了改变这一点,并且保持兼容性,var命令和function命令声明的全局变量依然是顶层对象的属性,但是let命令和const命令、class命令声明的全局变量不属于顶层对象的属性。

数组的解构赋值

基本用法

  1. 数组的结构赋值属于“模式匹配”,只要等号两边的模式相同,左边的变量就会被赋予对应的值。
  2. 如果解构不成功,值就是undefined。
  3. 还有一种情况是不完全解构,左边的模式只匹配一部分右边,这种情况下依然可以解构成功。
  4. 如果等号右边不是数组(或者严格来说不是可遍历的结构)就会报错。
  5. 只要某种数据结构具有Iterator接口,就可以采用数组的形式结构赋值。

默认值

在解构赋值时可以指定默认值,只有当数组成员严格等于===undefined时默认值才会生效,如果一个数组成员是null,默认值不会生效。

如果默认值是一个表达式,那么这个表达式是惰性求值,只有在用到的时候才会求值。如果没有用到表达式不会执行。

默认值可以引用结构赋值的其他变量,但是这个变量必须是已经声明,如果没有声明会报错。

对象的解构赋值

由于数组元素是有顺序的,所以变量取值由它的位置所决定,但是对象的属性是没有次序的,变量必须与属性同名,才可以取到对应的值。

如果解构失败,变量的值等于undefined。

如果解构模式是嵌套对象,而子对象所在的父属性不存在,那么会报错。

字符串的解构赋值

字符串也可以解构赋值,因为此时字符串被转换成立一个类似数组的对象,同时这个对象有一个length属性,也可以解构出来。

数值和布尔值的解构赋值

解构赋值时,如果等号右边是数值和布尔值,会先转为对象。

解构赋值的规则是:只要等号右边的值不是对象或数组,就先将其转换为对象,由于undefined和null无法转换为对象,所以对他们解构赋值时会报错。

往期精彩回顾


李成文 广州芦苇科技web前端工程师

上一篇 下一篇

猜你喜欢

热点阅读