ES6新特性详解-优快云博客

本文链接：https://blog.youkuaiyun.com/wzsrlndm/article/details/120441284

1.ECMAScript 和 JavaScript 的关系

该标准从一开始就是针对 JavaScript 语言制定的，但是之所以不叫 JavaScript，有两个原因。一是商标，Java 是 Sun 公司的商标，根据授权协议，只有 Netscape 公司可以合法地使用 JavaScript 这个名字，且 JavaScript 本身也已经被 Netscape 公司注册为商标。二是想体现这门语言的制定者是 ECMA，不是 Netscape，这样有利于保证这门语言的开放性和中立性。
因此，ECMAScript 和 JavaScript 的关系是，前者是后者的规格，后者是前者的一种实现（另外的 ECMAScript 方言还有 JScript 和 ActionScript）。日常场合，这两个词是可以互换的。

2.ES6 与 ECMAScript 2015 的关系

因此，ES6 既是一个历史名词，也是一个泛指，含义是 5.1 版以后的 JavaScript 的下一代标准，涵盖了 ES2015、ES2016、ES2017 等等，而 ES2015 则是正式名称，特指该年发布的正式版本的语言标准。本书中提到 ES6 的地方，一般是指 ES2015 标准，但有时也是泛指“下一代 JavaScript 语言”

3.定义变量的几种方式

常用的几种定义方式有 let const var function class import

4全局变量和局部变量的区别

var 定义全局变量和局部变量（全局作用域和局部作用域）

let 只有在let所在的代码块中起作用（此时的代码块或者代码区域称为块级作用域）
        1）会形成块级作用域（只要含有{}(除了对象的{}之外) 都会形成块级作用域）
        2）不存在变量提升
        3) 不可以重复声明
            不可以在相同的作用域中重复声明
            不可以在函数内部定义与形参相同的变量
        4）不影响作用域链

const 定义常量
    1) 设置常量必须有初始值
    2) 不存在变量提升
    3) 不允许修改值
    4) 会形成块级作用域
    5) 符合作用域链的规则

5.let的暂时性死区的理解

只要块级作用域内存在let命令，它所声明的变量就“绑定”（binding）这个区域，不再受外部的影响。在代码块内，使用let命令声明变量之前，该变量都是不可用的。这在语法上，称为“暂时性死区”

6.解构赋值

解构赋值：主要是针对数组和对象的解构，可以看成是一种匹配模式，对其中的变量进行赋值是对赋值运算符的一种扩展
    优点：在代码的书写上更加易读，语义更加清晰明了，方便从数组和对象中取数据
    保持两边一致
        解构源：等号右边
        解构目标 : 等号的左边
    解构赋值的写法
        可以嵌套    可忽略    可以不完全解构    可以写默认值        可以交换变量        可以解析字符串        对对象的操作提取json数据

6.为什么需要块级作用域

ES5 只有全局作用域和函数作用域，没有块级作用域，这带来很多不合理的场景。
第一种场景，内层变量可能会覆盖外层变量。

//第一种场景，内层变量可能会覆盖外层变量
var tmp = new Date();
    function f() {
      console.log(tmp);
      if (false) {
        var tmp = 'hello world';
      }
    }
    f(); // undefined


//第二种场景，用来计数的循环变量泄露为全局变量
var s = 'hello';
    for (var i = 0; i < s.length; i++) {
      console.log(s[i]);
    }
    console.log(i); // 5

7.箭头函数

1) 箭头函数不合适使用在构造函数和原型对象的函数中
2) 箭头函数中的this指向定义它的地方（父级作用域），而不指向调用它的地方，此时 this为静态的

    箭头函数中的this永远指向箭头函数所在父级作用域所属对象
    注意： 1）用let const var 定义的箭头函数在全局环境下指向window
2) 对象的字面量写法不产生新的作用域
3）箭头函数中的this不可以使用call 口 apply 不来 bind 白的改变
4）构造函数和构造函数原型对象中的函数如果用箭头函数依然只 window
5) 箭头函数中不含arguments

1) 箭头函数不合适使用在构造函数和原型对象的函数中
        2）箭头函数不适合使用在对象的方法和事件后绑定的函数
        3) 适合在闭包函数中使用
        4）适合在数组方法的回调函数中使用
        5）适合在计时器的回调函数中使用

8.新增字符串方法

includes()        返回布尔值，表示是否找到了参数字符串。
    startsWith()    返回布尔值，表示参数字符串是否在原字符串的头部。
    endsWith()        返回布尔值，表示参数字符串是否在原字符串的尾部。
    repeat()        方法返回一个新字符串，表示将原字符串重复n次。
    padStart()        用于头部补全，padEnd()用于尾部补全。
    trim全部消除 trimStart消除左边 trimEnd消除右边 trimLeft消除左边 trimRight消除右边消除空格

replaceAll replace 替换字符

9.新增数组方法

Array.of()    方法用于将一组值，转换为数组。      copyWithin    修改当前数组。
    find        找出第一个满足条件的数据
    findIndex    找出第一个满足条件的下标
    fill         用指定的值将数组中的数据替换
    kays
    values
    map            映射返回新数组
    filter        过滤
    reduce        求和
    some        遇真则停
    every        遇假则停

10.Symbol

ES6 引入Symbol的原因: 为了给对象的属性，提供独一无二的名字,它是一种原始数据类型， JavaScript 语言的第七种数据类型,表示独一无二的值，是一种类似于字符串的数据类型
    Symbol函数可以接受一个字符串作为参数，表示对 Symbol 实例的描述，主要是为了在控制台显示，或者转为字符串时，比较容易区分。
    特点：
        1）Symbol的值是唯一的，用来解决命名冲突的问题
        2）Symbol 值不能与其他类型的值进行运算，会报错。
        3）Symbol 定义的属性不可以使用for...in进行遍历,可以使用Reflect.ownKeys()获取所有的键名，可以通过Object.getOwnPropertySymbols获取所有的Symbol值
        4）可以通过显示的方式转为字符串或者布尔类型，不可以转为数字类型
    注意：
        1） Symbol函数前不能使用new命令，否则会报错。这是因为生成的 Symbol 是一个原始类型的值，不是对象。也就是说，由于 Symbol 值不是对象，所以不能添加属性。基本上，它是一种类似于字符串的数据类型。
        2） Symbol函数的参数只是表示对当前 Symbol 值的描述，因此相同参数的Symbol函数的返回值是不相等的。

    Symbol.for()与Symbol()这两种写法，都会生成新的 Symbol。它们的区别是，前者会被登记在全局环境中供搜索，后者不会。Symbol.for()不会每次调用就返回一个新的 Symbol 类型的值，而是会先检查给定的key是否已经存在，如果不存在才会新建一个值。比如，如果你调用Symbol.for("cat")30 次，每次都会返回同一个 Symbol 值，但是调用Symbol("cat")30 次，会返回 30 个不同的 Symbol 值。
        instanceof
        Object.keys(obj)
        Object.values(obj)
        Object.entries(obj)
        Object.getOwnPropertyNames(obj)
        Object.getOwnPropertySymbols(obj)
        Reflect.ownKeys(obj)