EcmaScript 6

1.ECMAScript简介

1.1 简介

ECMASCRIPT 6.0 ，发布时间2015年6月。，成为企业级开发语言。

1.2 和js什么关系

1.3 历史

1997 6 ECMAScript1.0版本诞生
1998 6 ES6 2.0
1999 12 ES3.0 
2000    ES4.0  语法过于激进 被废除了
2009 12 ES5.0   2011 6 ES5.1版本才发布
2013   ES6草案冻结，不在添加新的功能，新的功能将被放在ES7中；2015年6月，ES6正式通过，成为国际标准

1.4 语法提案的批准流程

任何人都可以向标准委员会（TC39委员会）提案，要求修改语言标准。
Stage 0 - 展示阶段
Stage 1 - 征求意见阶段
Stage 2 - 草案阶段
Stage 3 - 候选人阶段
Stage 4 - 定案阶段
https://github.com/tc39/ecma262

2.let 和 const

2.1 let声明变量

1. let声明的变量不会挂在window中，不会造成全局变量污染
2. 新增一个块级作用域
3. let不允许重复声明
4. let不会有声明提升（只是人为看到没有，但其实本身是由声明提升的，只是提升至暂时性死区中）

2.2 const声明常量

1. let的四点const都有
2. 不允许被修改，不允许改变内存空间地址
3. const声明和赋值必须一次性完成

3.字符串

3.1 字符串模板

ES6提供字符串模板  `` : 用来定义多行字符串，还可以在子字符串中加入变量和表达式，做字符串拼接

3.2 ES6字符串Api

方法名	方法类型	方法介绍
*codePointAt()	实例方法	返回一个字符的码点
*includes()	实例方法	返回布尔值，是否包含参数字符串
*startsWith()	实例方法	返回布尔值，表示参数字符串是否在字符串的头部
*endWith()	实例方法	返回布尔值，表示参数字符串是否在字符串的尾部
*repeat()	实例方法	返回一个新的字符串，表示将原字符串重复n次
*String.raw()	原型方法	该方法返回一个斜杠都被转义的字符串。往往用于模板字符串的处理方法
normalize()	实例方法
padSatart(),padEnd()	实例方法
trimStart(),trimEnd()	实例方法
matchAll()	实例方法
replaceAll()	实例方法	一次性替换所有匹配的字符串

3.3 码元码点（扩展）

𠮷
Unicode使用16进制来存储文字。我们将一个16位二进制编码叫做一个码元（Code Unit）.存储空间2的16次方：65536
Unocode对文字编码进行扩展。将某些文字扩展至32位（占两个码元，并且将某个文字对应的二进制数字叫做码点）

3.4 字符串标记（扩展）

语法规则：
    标记是一个函数，函数参数如下：
    参数1 ：被插值分隔字符串数组
    后续参数：所有插值

4.解构赋值

ES6允许按照一定的模式，从数组和对象中提取值，对变量进行赋值，这被称为解构（Destructuring）
解构赋值时对赋值运算符的一种扩展，主要针对与对象和数组中的变量进行赋值，简化了代码的书写长度，提高效率

5.new.target

作用：为了避免出现构造函数不使用new关键字调用

6.对象

6.1 新增小技巧

1. 属性简写:属性名和属性值相同，只写属性值即可

2. 方法简写：方法名和方法相同，只写方法即可

3. 计算属性名：对象的属性名可以引用变量值 [变量名]

6.2 新增API

1. is() 判断两个值是否相等，类似于===，除NaN和0

2. assign() 用于混合对象，带浅克隆

3. getOwnPropertyNames() 获取对象的属性名，返回为一个数组，数组中的数据会枚举出来对象的属性

4. setPropertypeOf() 设置兑现改的隐式原型 proto

6.3 面向对象：class类

6.3.1 面向对象和面向过程的思想

<script>
        // 面向过程 ： 只注重过程（几步），功能较小
        // 1.打开冰箱门
        function openFrige(){}
        // 2.把大象放进去
        function elephantIn(){}
        // 3.关上冰箱
        function closeFrige(){}
​
        // 面向对象  ： 主要考虑对象个数，对象的参数和方法，针对大型项目和大型模块
        function Elephant(){
            this.tiji = tiji;
        }
        function Frige(){
            this.width = width;
        }
        Frige.prototype.openDoor = function(){}
        Frige.prototype.closeDoor = function(){}
        Frige.prototype.join = function(){}
        let frige = new Frige()
        let ele = new Elephant()
​
​
        frige.openDoor()
        frige.join(ele)
        frige.closeDoor()
    </script>

6.3.2 class类的创建

class Person{
            constructor(job,name,age,sex){
                this.job = job;
                this.name = name;
                this.age = age;
                this.sex = sex;
                // this.print = function(){
                //     console.log("实例方法")
                //     console.log(`姓名：${this.name},工作：${this.job},年龄：${this.age},性别：${this.sex}`)
                // } 
            }
            print(){
                console.log("原型方法")
                console.log(`姓名：${this.name},工作：${this.job},年龄：${this.age},性别：${this.sex}`)
            }
        }
        const p1 = new Person("程序猿","jack","25","男")
        p1.print()
​
​
        // 1.类的声明不会被提升，和let const一样，有暂时性死区
        // 2.类的所有代码全部都是在严格模式下执行
        // 3.类的所有方法不可被枚举
        // for(const prop in p1){
        //     console.log(prop)
        // }
        // 4.类的所有方法无法当成构造函数使用
        //    const p2 =  new p1.print()
        //    console.log(p2)
        // 5.类的构造器必须使用new来调用
        // const b = Person("程序猿","jack","25","男")
        // console.log(b)
        // const p3 = Person.call(p1,"程序猿","jack","25","男")
        // console.log(p3)

6.3.3 使用的注意点

1. 可以写成计算属性名

2. 可以使用getter和setter方法

3. 静态成员：只属于自己所有，不能够被实例出来给其他人共享

4. 字段初始化（ES7）:简写constructor