ES6发布于2015年，增加了重要的新特性（包括类和模块语法）。这些新特性把javaScript从一门脚本语言转变成一门适合大规模软件工程的严肃、通用的语言。主要介绍：es6新增的变量声明方式，es6新增的数组方法,字符串模板,箭头函数 =》,解构赋值，class类，for of循环和新增的字符串方法

let关键字用来声明变量（类似于旧javaScript中的var声明）但是使用let声明的变量有以下几个特点 ↓1、不存在变量声明提升2、存在块级作用域3、存在暂时性死区4、不允许重复声明for(作用域A){作用域B} 循环的应用；

const关键字用来声明常量，其使用规则除了声明之后不能修改之外，其他特征和let一样 ↓

const的本质：const定义的变量并非是常量，并非不可变。不允许被改变的是地址，不是变量，使用const定义对象或者是数组时，其实是可变。

但是：我们不能对常量数值进行赋值，会报错

indexof(val，index)参数1是我们要寻找的项，参数2是我们起始寻找项的索引号

forEach(function(val，index){ })对数组进行循环遍历，这个方法没有返回值

filter(callback)功能上遍历和过滤，返回符合条件的元素，filter在循环的时候会判定一下是true还是false，是true才会返回。

map(callback)map可以改变当前循环的值，返回一个新的被改变过值之后的数组map需return），一般用来处理需要修改某一个数组的值。映射

some()数组中有一个数组元素满足条件，就返回true

every()数组中所有数组元素满足条件，就返回true

reduce()方法接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值

reduceRight()同上 ↑ reduce()，区别是从右到左

当我们需要输出一段话的时候旧的写法：

模板字符串的写法

我们在页面中输出一个表格，里面字符串带表达式，等等

箭头函数是函数以往写法的一种简写形式，只能以赋值形式存在，箭头函数如果只有一个参数的情况下，可以直接写参数省略括号使用

也是有好处的，需要：想让定时器或者延时器里面的this指向的也是对象，怎么办呢？箭头函数本身上面是没有this，它的this可以去上一层去找

箭头函数 ↓

可以嵌套

对象解构

repeat()重复功能 （）参数表示重复多少遍

includes()判定字符串中是否存在某个字符串

startsWith() endsWith()也是判定字符串中是否存在某个字符串

padStart()用于头部补全padEnd()用于尾部补全。

trimStart()和trimEnd()trimStart()消除字符串头部的空格，trimEnd()消除尾部的空格。它们返回的都是新字符串，不会修改原始字符串。

ES6新增的方法就介绍到这里了，谢谢大家！

1、stringObject.indexOf(searchvalue,): 该方法对大小写敏感，没有找到返回-1.2、数组实例的find方法，用于找出第一个符合条件的数组成员。它的参数是一个回调函数，所有数组成员依次执行该回调函数，直到找出第一个返回值为true的成员，然后返回该成员。如果没有符合条件的成员，则返回undefined；findIndex()与前者类似。3、Array.prototype.includes方法返回一个布尔值，表示某个数组是否包含给定的值。

下面逐一为大家详解常用的ES6新特性：

ES6推荐使用let声明局部变量，相比之前的var（无论声明在何处，都会被视为声明在函数的最顶部）let和var声明的区别：

let表示声明变量，而const表示声明常量，两者都为块级作用域；const 声明的变量都会被认为是常量，意思就是它的值被设置完成后就不能再修改了：

如果const的是一个对象，对象所包含的值是可以被修改的。抽象一点儿说，就是对象所指向的地址没有变就行：

有几个点需要注意：

在ES6之前，我们往往这么处理模板字符串：通过“\”和“+”来构建模板

而对ES6来说

箭头函数最直观的三个特点。

在ES6之前，我们往往这样定义参数的默认值：

当被用于迭代器中时，它是一个 Spread 操作符：

当被用于函数传参时，是一个 Rest 操作符：当被用于函数传参时，是一个 Rest 操作符：

ES6 允许在对象中使用 super 方法：

for...of 用于遍历一个迭代器，如数组：

for...in 用来遍历对象中的属性：

ES6 中支持 class 语法，不过，ES6的class不是新的对象继承模型，它只是原型链的语法糖表现形式。

函数中使用 static 关键词定义构造函数的的方法和属性：

类中的继承和超集：

1、find（）方法

2、forEach（）方法

  let arr2 =

         arr.forEach(function(item,index){

            if(item.price》1500){

                arr2.push(item)             }

         })

         console.log(arr2)

  let arr2 =

         arr.forEach(function(item,index){

             arr2.push(item.name)

         })

         console.log(arr2);

3、filter（）方法

   过滤 price 》 1500 

         es6循环的过滤方法 回调函数里面 return 一个条件

        会返回一个符合条件的新数组  对原数组不会造成改变

         let arr2 = arr.filter(function(item,index){

             return item.price》1500

         })

         console.log(arr2,arr)

4、map（）方法

  map循环 

         map可以把数组里面某一项组合成一个新数组

        对原数组不会造成改变

         let arr2 = arr.map(function(item,index){

             console.log(item,index)

             return item.price

         })

         console.log(arr2,arr);

1）创建对象的方式不同

new Object() 通过构造函数来创建对象, 添加的属性是在自身实例下。Object.create() es6创建对象的另一种方式，可以理解为继承一个对象, 添加的属性是在原型下。

Object.create()方法创建的对象时，属性是在原型下面的，也可以直接访问 b.rep // {rep: “apple“} ,此时这个值不是吧b自身的，是它通过原型链proto来访问到b的值。

2）创建对象属性的性质不同

Object.create() 用第二个参数来创建非空对象的属性描述符默认是为false的，而构造函数或字面量方法创建的对象属性的描述符默认为true。看下图解析：

3）创建空对象时不同

当用构造函数或对象字面量方法创建空对象时，对象时有原型属性的，即有 _proto_ ;当用Object.create()方法创建空对象时，对象是没有原型属性的。

4） __proto__ 属性JavaScript 的对象继承是通过原型链实现的。ES6 提供了更多原型对象的操作方法。__proto__ 属性（前后各两个下划线），用来读取或设置当前对象的prototype对象。目前只有浏览器环境必须部署有这个属性，其他运行环境不一定要部署，因此不建议使用这个属性，而是使用下面这些来 Object.setPrototypeOf() （写操作）、 Object.getPrototypeOf() （读操作）、 Object.create() （生成操作）代替。

如果是不用Object,create()方法，我们是如何给对象原型添加属性和方法的？------ 通过构造函数或者类，例如：

现在有 Object.create() 就简单的多了

输出结果中看出，添加的方法是在原型上的。就类似于

4.1）原型属性的继承这里结合一个例子来说说这几个方法的使用：场景：拷贝一个构造函数的实例。

打印出 实例c 看看结构是怎样的

其中 color 属性在实例上，而其他的原型上。现在来拷贝一个 实例 c2

因为 Object.assing 是不能拷贝到继承或原型上的方法的。所以 实例c2 没有 a 这个属性。那要怎么要才能拷贝到原型上的方法呢？

4.1.1）第一种方法

这样就实现了原型属性的拷贝。Object.getPrototypeOf(c) 既 originProto 得到的是原型上的 //{a: 1, b: 2, c: 3}；Object.create(originProto) 既 originProto2 既是创建了一个 {a: 1, b: 2, c: 3} 在原型上的新对象；Object.assign(originProto2, c) 在源对象originProto2 上合并对象 c；

4.1.2）第二种方法 （推荐）

可以把Object.create()的参数理解为：第一个参数是放在新对象的原型上的，第二个参数是放在新对象的实例上的。所以上面例子Object.getPrototypeOf() 得到的是 c 对象的原型，然后作为第一个参数，所以会在新对象c2 的原型上。Object.getOwnPropertyDescriptors() 得到是 c 对象自身属性(包括可枚举和不可枚举的)，作为第二个参数，放在 c2 的实例上。

为什么说推荐这个方法呢？因为Object.assign() 方法不能正确拷贝 get ，set 属性。

例如，我们给 c 实例添加一个 “colorGet“ 属性，并设置该属性的get 描述符：

结果如下：

这里没有拷贝到 “colorGet“ 的 get 描述符，而是直接把获取到的值赋值给 “colorGet“ 。

那对于 get 描述符要怎么获取呢？ Object.getOwnPropertyDescriptors就专为解决这问题而生。而又因为要拷贝原型上的属性，所以结合Object.create、Object.getPrototypeOf 方法一起使用。即上面的第二种实现方法，如下：

结果如下：

此时已经成功的拷贝到了get描述符啦。虽然说实际开发上很少会要去修改 get 描述符，但是知道多一种方法，遇到这种情况时就知道该怎么去解决了。

注意：这些都只是一个层级的深拷贝。

上面实现 原型属性拷贝 中的两种方法中用到了 Object.getOwnPropertyDescriptors 、 Object.assing() 、 Object.create 、 Object.getPrototypeOf() 方法，通常这几种方法都有一起结合使用。如果上面的例子还不理解，这里把他简单的拿到对象的继承来讲解。理解的话就可以忽略啦。

4.2）原型属性的继承以前，继承另一个对象，常常写成下面这样。

ES6 规定 __proto__ 只有浏览器要部署，其他环境不用部署。如果去除 __proto__ ，可以用 Object.create() 和 Object.assign() 来实现。

但是 Object.assign() 无法正确拷贝get属性和set属性的问题。例如：

上图中，obj 对象的 foo 属性是一个取值函数，Object.assign不会复制这个取值函数，只会拿到值以后，将这个值赋上去。

而 Object.getOwnPropertyDescriptors() 可以解决这个问题 实现get 、set 属性的正确拷贝，即方法3 ，如下：

说了那么多种拷贝方法，怎么去选择呢，还是要看实际应用中的情况:

如果只是拷贝 自身可枚举属性，就可以只用 Object.assign 方法；如果是要拷贝原型上的属性，就需要 Object.assign , Object.create, Object.getPrototypeOf 方法结合使用如果是拷贝get /set 属性，就需要 结合 Ojbect.getOwnPropertyDescriptors 方法

参考资料：

        /* for(let i=0;i《arr.length;i++){

            console.log(arr.name)

        } */

        /* for in 常用于遍历对象 数组也可以 key就是数组的索引*/

        /* for(let key in arr){

            console.log(arr.name)

        } */

 /* es6的另一个循环的方式 */

        /* val直接就是数组的每一个值 */

        /* for(let val of arr){

            console.log(val.name);

        } */

        /* es6的forEach 不能return */

        /* r表示数组的每个值 i代表索引 */

        /* arr.forEach( (r,i)=》{

            console.log(r,i);

        }) */        /* es6的map方法 可以帮我们返回一个新数组 */

        /* let newArr = arr.map( (r,i)=》r.arr01); */

        /* 判断内容结果的布尔值数组 r.yh==1*/

        /* 返回一个姓名的新数组 =》r.name */

        /* console.log(newArr); */        /* 新建一个json数组 循环 返回json数组的 全是姓名的新数组  */

        /* es6的数组方法之过滤 返回一个过滤后的新数组*/

        /* 返回一个已婚人数的新数组 */

        /* let newArr = arr.filter( r =》 r.yh==1 );

        console.log(newArr); */        /* es6数组方法之some （一些的意思） 返回一个布尔值*/

        /* 重点 只有有一个符合条件 就返回true */

        /* let flag = arr.some(r=》r.yh==0);

        console.log(flag); */        /* es6数组方法之every （每一个的意思） 返回一个布尔值 */

        /* 重点 只有有一个不满足条件 就返回false */

        /* let flag = arr.every( r =》 r.yh==0 );

        console.log(flag); */        /* Object.keys() 返回一个全是key的新数组*/

        let obj = {

            car:“保时捷“,

            color:“红色“,

            price:“200w“,

            zhuren:“韩老师“

        }

        /* let keysArr = Object.keys(obj); */

        /* console.log(keysArr); */

        /* Object.values() 返回全是对象的value的新数组*/

        /* let valArr = Object.values(obj);

        console.log(valArr); */

        /* 后台给我们数据（是一个对象） 有可能有 有可能没有

        我们怎么去判断呢？*/

        /* let l = Object.keys(obj).length;

        console.log(l);

        if(l){

            console.log(obj.zhuren)

        }else{

            console.log(’后台数据有误’)

        } */

模板字符串替换 + 操作符，来拼接字符串，并且支持换行：

标签模板：

标签模板其实不是模板，而是函数调用的一种特殊形式。“标签”指的就是函数，紧跟在后面的模板字符串就是它的参数。

如果模板字符里面有变量，就不是简单的调用了，而是会将模板字符串先处理成多个参数，再调用函数。

String.raw()是一个 模板字符串 的标签函数，它的作用类似于 Python 中的字符串前缀 r ，通常使用标签模板的形式（String.raw模板字符串)，返回值是自动转义的字符串：

​ Polyfill:

repeat 方法返回一个新字符串，表示将原字符串重复 n 次。语法：

如果某个字符串不够指定长度，会在头部或尾部补全。 padStart() 用于头部补全， padEnd() 用于尾部补全。

trimLeft() 是 trimStart() 的别名， trimRight() 是 trimEnd() 的别名。

除了空格键，对字符串头部（或尾部）的 tab 键、换行符等不可见的空白符号也有效。

substring()方法返回一个字符串在开始索引到结束索引之间的一个子集, 或从开始索引直到字符串的末尾的一个子集。返回新的字符串，不改变原来的字符串

str.substring(indexStart可选,一个 0 到字符串长度之间的整数，以该数字为索引的字符不包含在截取的字符串内。左闭右开

slice()方法提取某个字符串的一部分，并返回一个新的字符串，且不会改动原字符串。

str.slice(beginIndex) 参数和substring一样，只不过有差异。和上面方式对比：

可见 slice 方式的索引是可以倒数的，强烈推荐使用 slice 方式截取字符串更好理解，不易出错。

其实JS中截取字符串，方法有很多： substr(淘汰，不推荐) 、 substring 、 slice ，推荐使用 slice 方式。

问题记录

1.set和get

  ES6中的get和set

当你在声明一个类的时候，有些属性，是不希望别人可以随意的对它进行更改的，也就是把它定义为  私有属性 ，在ES5的时候基本不可能做到，但是在ES6的时候是可以办到的，而这个就是通过 get 来实现。在这里定义一个私有属性的时候，用户访问这个属性的入口，跟这个属性的值的存储位置是不一样的，

而且这个时候的age修改是不会被改变的，例如：这里的age，可以使用es6中的set改变但是本质来说并不是通过改变age的值，二十通过改变_age的值来间接的改变原age的值，有了这个方法就可以有新的玩法了2.es6挂载静态方法（static）

在es6中引入了新的东西，static在使用static时，同样的只需要将方法写在class里，然后在方法的前面加个static就行了

取值在程序中非常常见，比如从对象obj中取值。

ES6的解构赋值虽然好用。但是要注意解构的对象不能为undefined、null。否则会报错，故要给被解构的对象一个默认值。

比如合并两个数组，合并两个对象。

ES6的扩展运算符，数组合并需不需要考虑去重。

在${}中可以放入任意的javascript表达式，可以进行运算，以及应用对象属性。

可以使用ES6中数组实例方法includes

在项目中，一些没分页的列表的搜索功能由前端来实现，搜索一般分为精确搜索和模糊搜索。搜索也要叫过滤，一般用filter来实现。

如果是精确搜索可以用ES6中的find？性能优化，find方法中找到符合条件的项，就不会继续遍历数组。

一个部门JSON数据中，属性名是部门id，属性值是个部门成员id数组集合，现在要把有部门的成员id都提取到一个数组集合中。

获取对象的全部属性值可以用Object.values，还有涉及到数组的扁平化处理，可以用ES6提供的flat方法，还好这次的数组的深度最多只到2维，还要是遇到4维、5维深度的数组，是不是得循环嵌套循环来扁平化？

其中使用Infinity作为flat的参数，使得无需知道被扁平化的数组的维度。

flat方法不支持IE浏览器。

可以使用ES6中的可选链操作符。

在处理输入框相关业务时，往往会判断输入框未输入值的场景。

可以使用ES6中新出的空值合并运算符。

去除数组中的重复成员

去除字符串中重复的值

ES6 在 Math 对象上新增了 17 个数学相关的静态方法，这些方法只能在 Math 中调用。Math 进行拓展

3.Math.trunc()：去除小数部分

5.Math.imul(): 两个数以 32 位带符号整数形式相乘的结果，返回的也是一个 32 位的带符号整数。6.双曲函数方法Math.sinh(x): 用于计算双曲正弦。Math.cosh(x): 用于计算双曲余弦。Math.tanh(x): 用于计算双曲正切。Math.asinh(x): 用于计算反双曲正弦。Math.acosh(x): 用于计算反双曲余弦。Math.atanh(x): 用于计算反双曲正切。

注意：这三个方法只返回布尔值，如果需要知道子串的位置，还是得用 indexOf 和 lastIndexOf 。

2.如果参数是小数，向下取整

3.如果传入的参数是字符串，则会先将字符串转化为数字

2.如果原字符串加上补全字符串长度大于指定长度，则截去超出位数的补全字符串:

3.常用于补全位数：