ES6总结

es6的由来

在es6之前都是以版本号递增的,由于从2015年起修改方案,每年6年发布一版稳定版,以当年年份命名,所以2015年发布的一版以es2015命名,且这一版做了特别大的改动,在以前的版本号命名就是es6,所以把2015年之后的版本统称es6,其实每年的改动都有自己的版本命名es2016、es2017 但都是在2015的基础上,做小范围的改动

let和const特性

  • 不存在变量提升
  • 暂时性死区
  • 不允许重复声明
  • 块级作用域的好处

    • 防止内层变量覆盖全局变量
    • 用来计数的循环变量泄露为全局变量

解构赋值

  • 只要某种数据结构具有Iterator接口,都可以采用数组形式的解构赋值,属于一种模式匹配
  • 默认值使用严格相等运算符,只能将undefine的值进行默认值赋
  • 如果默认值是一个表达式,那么这个表达式是惰性求值的,即只有在用到的时候,才会求值
  • 字符串解构赋值会将字符串先转化成类似数组的对象
  • 布尔值和数字解构赋值会将其转化成对象类型
  • 不能使用圆括号的场景

    • 变量声明语句中
    • 函数参数中
    • 语句赋值中,不能将整个模式,或嵌套模式中的一层,放在圆括号之中
  • 解构赋值的用途

    • 交换变量的值
    • 从函数中返回多个值
    • 函数参数的定义
    • 提取json数据
    • 函数参数的默认值
    • for of 遍历map结构
    • 输入模块的指定方法

    字符串扩展

    • 新增字符串的遍历接口 字符串也可使用for of 遍历
    • es6提供了字符串新的方法

      • includes():返回布尔值,表示是否找到了参数字符串。
      • startsWith():返回布尔值,表示参数字符串是否在源字符串的头部。
      • endsWith():返回布尔值,表示参数字符串是否在源字符串的尾部。

           var s = 'Hello world!';
        
           s.startsWith('world', 6) // true
           s.endsWith('Hello', 5) // true
    • repeat():返回一个新字符串,表示将原字符串重复n次串的头部。
    • padStart用于头部补全,padEnd用于尾部补全。第一个参数用来指定字符串的最小长度,第二个参数是用来补全的字符串。

      'xxx'.padStart(2, 'ab') // 'xxx'
      'x'.padEnd(5, 'ab') // 'xabab'
  • 支持模版字符串

正则扩展

  • 与正则相关的方法,全都定义在RegExp对象上。
  • 新增u、y修饰符,u用于unicode,y和g差不多 只不过要从头匹配
  • 新增两个属性sticky判断是否用了y修饰符 flags返回正则表达式的修饰符

数值扩展

  • 新增Number.isFinite()和Number.isNAN() 区别于全局方法 只对数值有效 不做类型转换
  • ES6将全局方法parseInt()parseFloat(),移植到Number对象上面,行为完全保持不变。逐步减少全局性方法,使得语言逐步模块化
  • Number.isInteger()用来判断一个值是否为整数 3和3.0没有区别
  • Math.trunc方法用于去除一个数的小数部分,返回整数部分。
  • Math.sign方法用来判断一个数到底是正数、负数、还是零

数组扩展

  • Array.from方法用于将两类对象转为真正的数组:类似数组的对象(array-like object)和可遍历(iterable)的对象(包括ES6新增的数据结构Set和Map)。

    Array.from => [].slice.call(arrayLike)
    Array.from(arrayLike, x => x * x);
    // 等同于
    Array.from(arrayLike).map(x => x * x);
    
    Array.from([1, 2, 3], (x) => x * x)
    // [1, 4, 9]
    
  • Array.of方法用于将一组值,转换为数组。
  • 数组实例方法

    • copyWithin()在当前数组内部,将指定位置的成员复制到其他位置(会覆盖原有成员),然后返回当前数组
    • find()findIndex()
    • fill方法使用给定值,填充一个数组。第2和第3个参数代表起始和终止位置
    • keys()是对键名的遍历、values()是对键值的遍历,entries()是对键值对的遍历。都用于遍历数组
    • includes方法返回一个布尔值,表示某个数组是否包含给定的值,与字符串的includes方法类似
  • ES6则是明确将空位转为undefined

函数扩展

  • 参数默认值
  • 作用域
  • 扩展运算符

    • 代替数组的apply方法
    • 合并数组
    • 与解构赋值结合
    • 函数的返回值
    • 字符串
    • 扩展运算符内部调用的是数据结构的Iterator接口,因此只要具有Iterator接口的对象,都可以使用扩展运算符
  • 箭头函数

    • 函数体内的this对象,就是定义时所在的对象,而不是使用时所在的对象。有利于封装回调函数
    • 不可以当作构造函数,也就是说,不可以使用new命令,否则会抛出一个错误。
    • 不可以使用arguments对象,该对象在函数体内不存在。如果要用,可以用Rest参数代替。
    • 不可以使用yield命令,因此箭头函数不能用作Generator函数。
    • 箭头函数的绑定
    foo::bar;
    // 等同于
    bar.bind(foo);
    
    foo::bar(...arguments);
    // 等同于
    bar.apply(foo, arguments);

对象扩展

  • 属性的简洁表示法,允许变量和函数
  • 属性名可以为表达式,表达式放在数组中
  • Object.is就是部署这个算法的新方法。它用来比较两个值是否严格相等,与严格比较运算符(===)的行为基本一致
  • Object.assign方法用于对象的合并,将源对象(source)的所有可枚举属性,复制到目标对象(target)Object.assign方法实行的是浅拷贝,而不是深拷贝。也就是说,如果源对象某个属性的值是对象,那么目标对象拷贝得到的是这个对象的引用

    • 为对象添加属性
    • 为对象添加方法
    • 克隆对象
    • 合并多个对象
  • Object.values方法返回一个数组,成员是参数对象自身的(不含继承的)所有可遍历(enumerable)属性的键值
  • Object.entries方法返回一个数组,成员是参数对象自身的(不含继承的)所有可遍历(enumerable)属性的键值对数组

Iterator

Iterator的遍历过程是这样的。

(1)创建一个指针对象,指向当前数据结构的起始位置。也就是说,遍历器对象本质上,就是一个指针对象。

(2)第一次调用指针对象的next方法,可以将指针指向数据结构的第一个成员。

(3)第二次调用指针对象的next方法,指针就指向数据结构的第二个成员。

(4)不断调用指针对象的next方法,直到它指向数据结构的结束位置。

使用场景

  • 解构赋值
  • 扩展运算符
  • yield*

for of

  • for...in循环读取键名,for...of循环读取键值
  • for...of循环调用遍历器接口,数组的遍历器接口只返回具有数字索引的属性

Generator函数


喝冬瓜汤的丁小白
45 声望4 粉丝