ES6新特性

ES6

我们使用let定义的i来拿到当前点击li的索引号时会自动形成闭包的情况。所以使用let定义的变量更方便.

ES6是泛指es2015之后的版本

let申明的变量作用域只存在{}中；var关键字不具备这个特点。

不存在变量提升，只能先申明在使用

暂时性死区特性：

eg：

              /* -------使用let关键字声明的变量具有暂时性死区特性------- */

              var num = 10

              if (true) {

                     console.log(num);

                     let num = 20;

              }

经典面试题：变量i是全局的

              let arr = [];

              for (let i = 0; i < 2; i++) {

                     arr[i] = function () {

                            console.log(i);

                     }

              }

              arr[0]();

              arr[1]();

改为let定义i之后就形成了闭包！！

const关键字：用来申明常量（值不能更改）特点：具有块级作用域；声明的常量必须要赋初值！！且这个常量一般都是大写；常量赋值之后，值不能更改；对于复杂类型数据来说例如数组：对其内部的值作修改操作是可以实现的，但是不能去给这个数组变量重新赋值即不能修改其地址

解构赋值：

数组解构：允许我们按照一一对应的关系从数组中提取值，多了就是undefinited

        let ary = [1,2,3];

        let [a, b, c, d, e] = ary;

对象解构：对象解构允许我们使用变量的名字匹配对象的属性 匹配成功 将对象属性的值赋值给变量

              let person = {name: 'lisi', age: 30, sex: '男'};

               let { name, age, sex } = person;

let {name: myName} = person;其中myName是name的别名，：前面的变量只用于属性匹配。

箭头函数：语法

（）=>{}是用来简化函数定义语法的类似java的拉姆达表达式

函数体中只有一句代码，且代码的执行结果就是返回值的时候，可以省略大括号

如果形参只有一个，则形参外面的小括号也可以被省略！！！

箭头函数的this，箭头函数不绑定this关键字，箭头函数中的this，指向函数定义位置的上下文this；

        function fn () {

              console.log(this);

               return () => {

                      console.log(this)

              }

       }

         const obj = {name: 'zhangsan'};

         const resFn = fn.call(obj);

        resFn();

经典面试题：以下对象是不具备块级作用域的，所以箭头函数是被定义在了window里面，所以this指向的是window输出结果是100！！

              var age = 100;

              var obj = {

                     age: 20,

                     say: () => {

                            alert(this.age)

                     }

              }

              obj.say();

箭头函数使用不了arguments！！需使用剩余参数：…args，其中args就是用于接受参数的数组。

剩余参数和解构配合使用：let [s, ...s1] = arr

Array的扩展方法：

扩展运算符（展开运语法）

扩展运算符可以将数组或者对象转为用逗号分隔的参数序列

let arr=[1,2,3]

…arr//

cosole.log(…arr)打印出来的就是1 2 3（，逗号被log当作打印分隔符了）

扩展运算符可以用来合并数组：

方法一：

        let arr1 = [1, 2, 3]

        let arr2 = [4, 5, 6]

        let arr = [...arr1, ...arr2]

方法二：使用push方法给一个数组添加多个元素

arr1.push(…arr2)

扩展运算符也可以将伪类数组转换为一个真正的数组：

方法一：

 let arr=[…lis]

方法二：

使用Array.from()将伪类数组可遍历对象转换成真正的数组

              var arrayLike = {

                     "0": "张三",

                     "1": "李四",

                     "2": "王五",

                     "length": 3

              }

              var ary = Array.from(arrayLike);

              console.log(ary)

from（）可以接受两个参数，第二个参数是一个函数，可以对伪类数组中的元素进行操作，之后再返回操作之后的新数组

var ary = Array.from(arrayLike, item => item * 2)

arr.find()可以用于找出符合条件的数组成员，如果没有找到就返回undefined（接受的参数一个是value值，一个是当前value的索引号！）

            // let obj = obj2.find(function(value, index) {

            //     return value.id === 22

            // })

        let obj = obj2.find(value => value.id === 22)

findIndex（）方法用于查找第一个符合条件的数组成员的位置，如果没有返回-1

              let ary = [10, 20, 50];

              let index = ary.findIndex(item => item > 15);

              console.log(index)返回的是找到元素的索引号

include（）方法表示某个元素是否包含给定的值，返回的是布尔值

              let ary = ["a", "b", "c"];

              let result = ary.includes('a')

模板字符串String的扩展方法

可以自由拼接

let str=`你好${name}`

可以有换行，是代码更加美观

模板字符串可以调用函数

${function（）{return ‘你好’}}

startWith（参数）表示参数字符串是否在原字符串的头部，返回布尔值

endsWith(参数)对应的是表示参数字符串是否在原字符串的尾部，返回布尔值

repeat（n）表示将原字符串重复n次，返回一个新字符串

语法：‘x’.repeat(2)

Set数据结构

类似数组，但是成员的值都是唯一的，没有重复的值

Set本身就是一个构造函数，用来生成Set数据结构

Set构造函数函数可以接受一个数组作为参数，用来初始化

数组去重可以使用Set数据结构（按照从前向后的顺序去重）

Set数据结构的实例方法

add(value)添加某个值，返回Set结构本身可以链式连接多个add

delete(value)删除某个值，返回一个布尔值，表示删除成功

has(value)返回一个布尔值，表示该值是否为Set的成员

clear()清除所有成员

Set结构的实例和数组一样，也拥有forEach方法，用于对每个成员执行某种操作，没有返回值