ES6知识归纳记录1

1、ES5和ES6

ES6	ES5
块级作用域（可以任意嵌套）	只有 1、函数作用域  ；  2、全局作用域
函数声明： 允许在“ 块级作用域内 ”声明，前提是大括号成立； （ps: es6环境会报错，避免使用，必要时可写成函数表达式）	函数声明： 只能在 “ 顶层作用域 ”和 “ 函数作用域 ”之中声明
箭头函数和字符串插值
类定义和继承
展开运算符等

2、let 、const、var

let	const	var
块级作用域		1、函数作用域；2、全局作用域
“ 不 ” 存在变量提升 ；易造成“ 暂时性死区（TDZ）- 报错 ”		存在变量提升
同一块级作用域，变量 “不可以重复声明 ”		变量可重复声明
变量	只读常量 1、不能改变（分简单数据类型和复合数据类型）；  2、声明后要立即赋值

var a = [];
for (var i = 0; i < 10; i++) {
    a[i] = function() {
     console.log(i);
    }
}
a[3](); // 10

---------分割线----------

var a = [];
for (let i = 0; i < 10; i++) {
    a[i] = function() {
     console.log(i);
    }
}
a[3](); // 3

 

3、解构赋值 *****（可用于嵌套）

1、【数组】解构赋值

注意： 左右两边解构保持一致

经典的有 import { a, b, c} from '../../model'; 就是解构赋值

• 完全解构赋值 

let [a, b, c] = [1, 2, 3]   // a=1, b=2, c=3

let [a, [[b], c]] = [1, [[2], 3]]   // a=1, b=2, c=3

let [ , , c] = [1, 2, 3]   // c=3

• 不完全解构赋值

let [a, b] = [1, 2, 3]   // a=1, b=2

let [a, [b]] = [1, [2, 3]]   // a=1, b=2

• 解构赋值undefined(取不到值)

let [a, b, c] = [1, 2]  // a=1, b=2, c=undefined

let [a] = []  // a=undefined

• 解构赋值出错

let [a] = true/NaN/undefined/null/{}/1   //语法错误

• 解构赋值允许默认值(有两个特例：undefined和null)

let [a, b='x'] = [1]   // a=1, b=x

let [a, b='x'] = [1, undefined]   // a= 1, b= x

let [a, b='x'] = [1, null]   // a=1, b=null

• 引用变量时， 该变量必须提前声明，否则报错

let [m=1, n=m] = [2]  // m= 2, n = 2  (x已经提前声明)

let [m=1, n=m] = []  // m= 1, n = 1  (x已经提前声明)

let [ m=f() ] = [1]  // m= 1  (匿名函数没有提前声明)

let [m=n, n=1] = []  // 语法错误

2、【对象】解构赋值

     a、与【数组】解构赋值区别： 

1. 数组： 取值与值的位置有关
2. 对象：取值与属性名同名才能取到正确值

• 解构赋值取值

let {b, a} = {a: '你好', b: 'jason'}  // a='你好' ， b='jason'

• 解构赋值undefined(取不到值)

let {a, b} = {a: '你好'} // a='你好', b=undefined

• 别名的应用（简写）

     原理是：先找到同属性名的，再赋值给对应的变量；  下面title是模式， t才是变量

let { title: t } = { title: '你好'}  // t='你好', title 报错没有定义

• 解构赋值允许默认值 (有两个特例：undefined和null)

let {a, b=2} = {a: 1}  // a=1, b=2

let {a:t=5} = {a:2} // t=2

let {a=5} = {a: undefined} // a=undefined

let {a=5} = {a: null} //a=null

• 嵌套赋值

let m=[]
let n={}
({ a: n.name, b: m[0] } ={ a: 'jam', b: true })
// m = [true]
// n = {name: jam}

• 定义变量后，不能将大括号写在行首(正确写法如下)

let i;
({i} ={i: 1})

• 特殊解构赋值

let a = [1, 2, 3]
let {0: first, [a.length-1]: last} = arr;
// first = 1
// last = 3

3、【字符串】解构赋值

把它看成类似 ‘数组’

let [a, b, c, d, e, length:len] = 'hello' 
// a = 'h'
// b = 'e'
// c = 'l'
// d = 'l'
// e = 'o'
// len = 5

4、【数值和布尔值】解构赋值

  先将数值和布尔值转换为“对象”     let {toString: s} = 123/true

  但是undefined 和 null 会报错（因为无法转为对象）

5、【函数参数】解构赋值

function a([x, y]){
  return x+y
}
a([1, 2]); // 3

//---------- 分割线 ----------

function b({x=0, y=0} = {}) {
    return [x, y]
}
b({x: 3, y: 8}) // [3, 8]
b({x: 3}) // [3, 0]