本文章是根据以下文章内容整理的：
前言
自从ES6发布以来，就受到了广大开发者的欢迎它的新特性解决了很多实际开发的痛点，并且使得JavaScript逐步成为一门能够开发大型企业应用的编程语言，基于这种技术环境下，很多公司都将ES6视为开发的其中一个标准，因此在招聘人才时，也会对其进行ES6知识的考察。
箭头函数
*当要求动态上下文时，就不能使用箭头函数，也就是this的固定化。
1、在使用=>定义函数时，this的指向是定义时所在的对象，而不是使用时所在的对象【function是使用时所在的对象】；
2、不能用做构造函数，也就是不能使用new命令，否则机会抛出一个错误；
3、不能使用arguments对象；
4、不能使用yield命令；
原生js
class Animal {
constructor(){
this.type = "animal";
}
say(val) {
setTimeout(function(){
console.log(this); //window
console.log(this.type + "says" + val)
}, 1000)
}
var animal = new Animal();
animal.say("Hi") //undefined says hi
箭头函数：
class Animal {
constructor(){
this.type = "animal";
}
say(val) {
setTimeout(() => {
console.log(this); //animal
console.log(this.type + "says" + val);
}, 1000)
}
}
var animal = new Animal();
animal.say("Hi"); //animal says Hi
【特点】
·不需要关键字function创建函数
·省略return关键字
·继承当前上下文的this关键字
let与var区别传送门
作用域：
-通过var定义的变量，作用域是整个封闭函数，全域的；
-通过let定义的变量，作用域是在块级或者子级中；
【只要块级作用域存在let命令，他所声明的变量就会绑定这个作用域，不再受外部影响】
【let不允许相同作用域重复声明同一个变量】
变量提升：
浏览器在运行代码之前会进行预解析，首先解析函数声明、定义变量，解析完成之后在对函数进行运行、变量进行赋值等；
-不论var生命的变量处于当前作用域的第几行，都会提升到作用域的顶部，并且初始化为undefined；
-而let声明的变量同样不论处于当前作用域的第几行，都会提升到作用域的顶部，当赋值时才会被初始化。【只用let声明变量，但是不赋值，会被初始化为undefined】
console.log(foo) //undefined
var foo = 1;
相当于
var foo;
console.log(foo); //undefined
foo = 1;
console.log(a) //报错
let a = 1;
但是直接用let声明变量不赋值是会打印undefined，还是初始化了，只是let放在赋值之后，let声明会提前但不会初始化。
let a;
console.log(a) //undefined
console.log(a); //报错
let a;
Set数据结构
ES6提供了新的数据结构 Set。
特性：
类似于数组，但是它的一大特性就是所有元素都是唯一的，没有重复。
我们利用这唯一特性可以对数组进行去重操作；
单一数组的去重：
let set = new Set([1,2,2,2,3]); //Set(2) {1,2,3}
多数组的合并去重：
let arr1 = [1,2,3,4]
let arr2 = [2,3,4,5]
let set = new Set([...arr1, ...arr2]); //Set{1,2,3,4,5}
//对象中的扩展运算符(...)用于取出参数对象中的所有可遍历属性，拷贝到当前对象之中
操作：
1、向Set中添加元素
let set1 =new Set()
set1.add(1)
set1.add(2)
console.log(set1) //{1,2,3}
2、从set中删除元素；
var set1 = new Set();
set1.add(1)
set1.add(2)
set1.delete(1)
console.log(set1) //{2}
3、判断某元素是否存在；
let set = new Set()
set.add(1);
set.add(2);
set.delete(1);
set.has(1); //false
set.has(2); //true
4、清除所有元素
let set = new Set();
set.add(1)
set.clear() //{}
Set和Array互转
1、数组转Set
let set1 = new Set([1,2,3]); // Set{1,2,3}
let set2 = new Set(new Array(1,2,3)); // Set{1,2,3}
2、Set转数组
var set = new Set([1,2,3]);
console.log([...set]); //[1,2,3]
console.log(Array.from(set)); //[1,2,3]
遍历
可以使用set实例对象的keys()、values()、entries()方法进行遍历；
由于Set的键名和键值是同一个值，它的每一个元素的key和value是相同的，所有的keys()和values()返回的值都是相同的，entrise()返回元素中的key和value是相同的。
let set1 = new Set([1,2,'hello'])
for(let item of set1.keys()){
console.log(item); //1,2,'hello'
}
for(let item of set1.values()){
console.log(item); //1,2,'hello'
}
for(let item of set1.entries()){
console.log(item); //[1,1][2,2]['hello','hello']
}
其他特性：
在向Set加入值时，Set不会转换数据类型，内部在判断元素是否存在时用的类似与精确等于(===)的方法，“2”和2是不同的，NaN等于自身；
var set = new Set()
set.add(NaN);
set.add(NaN);
console.log(set); //Set {NaN}
模版字符串
*就是这种形式${varible}，在以往的时候我们在连接字符串和变量时需要使用这种‘string’+varible+‘string’但是有了模版语言后，我们可以使用string${varible}string这种进行连接。
在ES5时，我们通常使用‘\’反斜杠来做多行字符串或者字符串一行行拼接，ES6反引号（``）可以直接搞定。
//ES5vartemplate = "hello \
world";
console.log(template); //hello world//ES6const template = `hello
world`;
console.log(template); //hello 空行 world
Promise
promise是一个构造函数
function demo(){
var p = new Promise(function(resolve,reject){
setTimeout(function(){
console.log('执行完成')
resolve('随便一些数据')
},1000)
})
return p;
}
demo(); //执行完成
demo().then(function(data){ //data:p
console.log(data) //两秒后：执行完成 随便一些数据
})
在demo函数执行返回直接调用then方法，then接受一个参数【函数】。并且会拿到我们在demo中调用resolve时传的参数。
then里面的函数跟我们平时用的回调函数一样，能够在demo这个异步任务执行完成之后被执行。
promise比传递callback函数灵活的多：
demo()
.then(function(data){
console.log(data + '1')
})
.then(function(data){
console.log(data + '2')
})
...
reject用法
function getNum(){
var p = new Promise(function(resolve, reject){
setTimeout(function(){
var num = Math.ceil(Math.random()*10)
if(num <= 5){
resolve(num)
}else {
reject('数字太大了')
}
}, 1000)
})
return p;
}
getNum().then(function(data){
console.log('resolve')
console.log(data)
}, function(p,data){
console.log('reject')
console.log(p)
})
catch用法
getNum().then(function(data){
console.log('resolved')
console.log(data)
}).catch(function(p){
console.log('rejected')
console.log(p)
})
*all用法
Promise.all([runAsync1(), runAsync2(), runAsync3()]).then(function(results){
console.log(results);
})
对象的拓展运算符
对象中的拓展运算符(...)用于取出参数对象中的所有可遍历属性，拷贝到当前对象中。
let bar = {a:1, b:2};
let baz = {...bar}; //{a:1, b: 2}
上面方法等价于：
let bar = {a:1,b:2};
let baz = Object.assign({},bar); //{a:1,b:2}
Object.assign()方法用于对象的合并，将源对象【source】的所有可枚举属性，复制到目标对象【target】。
Object.assign()方法的第一个参数是目标对象，后面的参数都是源对象。【如果目标对象与源对象有同名属性，或者多个源对象有同名属性，则后面的属性会覆盖前面的属性】
同样，如果用户自定义的属性，放在扩展运算符后年，则扩展运算符内部的同名属性会被覆盖。
let bar = {a:1.b2};
let baz = {...bar,...{a:2,b:4}} //{a:2,b:4}
数组的扩展运算符
拓展同样可以运用在对数组的操作中。
可以将数组转换为参数序列
function add(x,y){
return x+y;
}
const numbers = [2,3];
add(...numbers); //5
可以复制数组
let arr = [1,2,3];
let arr1 = [...arr]; //[1,2,3]
网友评论