Es6总结

1、var，let和const的区别

1-过去咱们是用var来声明变量的 var i=1; 或者直接i=1, 这两种方式有什么区别？
当咱们运行下面两段代码：
console.log(i)
var i=1;
console.log(i)
i=1;
输出的结果分别是undefined和not defined可见var有提高变量的做用
注意：虽然不会报错但尽可能不要用不加var的方式来声明变量

2-如今Es6又新增了let（变量）和const（常量）两种方式来声明变量，这两种方式声明的变量都是处于块级做用域中，并且let和const并不存在变量提高，因此必定要在定义后使用，不然报错。
所谓的块级做用域就是一个｛｝,运行代码以下：

{
var a=110;
 let b=666;
 }
 console.log(a)
 console.log(b)
复制代码

输出结果是：110和 not defined

---

2、模板字符串,解决了Es6之前字符串输出功能上的不足

用途一:模板化输出：将表达式嵌入字符串中输出，用法是 `字符串${变量}`。

用途二可以实现多行输出,以下：

var a='zk'
console.log(` my name i${a}`) 
复制代码

直接就实现了多行输出的效果~

---

3、箭头函数

也就是函数的快捷写法
例如：

x=>x*x;
function f(x){
    return x*x;
}
复制代码

这两种写法表达的函数是同样的。
用法：当你的函数有且仅有一个参数的时候，是能够省略掉括号的。当你函数返回有且仅有一个表达式的时候能够省略{} 和 return。

注意：箭头函数中是没有this的

---

4、块级做用域代替IIFES

IIFES即函数当即表达式，一般用途是建立一个内部的做用域，而在Es6中咱们一样能够用一个块级做用域来实现相同的功能：
以下列代码:

{
let f=()=>console.log("zzzzz~")
}
(function f(){console.log("zzzzz~"})
复制代码

这两个函数做用是相同的

---

5、Es6新增的方法

• Array.from 将把类数组对象转成真正的数组;
• Array.of 做用：将一组值转换为数组。与Array.from功能类似，用来建立数组。主要目的是弥补构造器 Array（）的不足;
• find() 用于找出第一个符合条件的数组元素。找不到则是undefined。注意，它是不会返回多个，只找一个，找到了就返回;
• findIndex() 返回第一个符合条件的数组元素的索引。找不到则是-1;
• includes 判断元素是否在数组/字符串中存在。返回值是true|false，indexOf也能够作相似的工做可是indexOf对NaN的判断是错误的;
• fill 给数组填充指定值。fill 方法用于空数组的初始化很是方便。已有数据会被覆盖。fill方法还能够接受第二个和第三个参数，用于指定填充的起始位置和结束位置;
• startsWith()返回布尔值，表示参数字符串是否在源字符串的头部；
• endsWith()返回布尔值，表示参数字符串是否在源字符串的尾部；

---

6、 默认参数对 arguments 对象的影响

Arguments是个相似数组但不是数组的伪数组，说他相似数组是由于其具有数组相同的访问性质及方式，可以由arguments[n]来访问对应的单个参数的值，并拥有数组长度属性length。还有就是arguments对象存储的是实际传递给函数的参数，而不局限于函数声明所定义的参数列表，并且不能显式建立 arguments 对象 用法以下：

function f(a,b,c){
    for(var i=0;i<arguments.length;i++){
        console.log(arguments[i])
    }
}
f(1,2,3);
复制代码

在非严格模式下，arguments老是能反映出命名参数的变化。看下面的代码：

function foo(a, b) {  //非严格模式
 console.log(arguments[0] === a); //true
console.log(arguments[1] === b); //true
a = 10;
b = 20;
 console.log(arguments[0] === a); //true
console.log(arguments[1] === b); //true
    }
    foo(1, 2);
复制代码

• 在ES5的严格模式下，arguments只反映参数的初始值，而再也不反映命名参数的变化！

function foo(a, b) {
    //严格模式
 "use strict"
    console.log(arguments[0] === a); //true
    console.log(arguments[1] === b); //true
    a = 10;
    b = 20;
    console.log(arguments[0] === a); //false。 修改a的值不会影响到arguments[0]的值
    console.log(arguments[1] === b); //false
    }
    foo(1, 2);
复制代码

---

7、扩展运算符

• 把数据结构转成数组：

var arr=[1,2,3];
console.log(...arr); 
//把数组展开后依次输出
var arr2=[...arr];
//把数组展开后再赋值给arr2
复制代码

• 把伪数组转成数组：

function f(a,b,c){
console.log([...arguments])
}
f(1,2,3);
复制代码

• 合并数组：

let arr1=[1,2]
let arr2=[3,4]
console.log([...arr1,...arr2])
//输出合并后的数组
复制代码

• 解构赋值：

let[a,b,c]=[1,2,3]
console.log(a)
console.log(b)
console.log(c)
复制代码

---

8、默认参数

设置函数中形参的默认值 简而言之：

function f(a=1,b=3,c=4){
   console.log(a)
   console.log(b)
   console.log(c)
}
f()
//输出结果是1，3，4
复制代码

---

9、类Class

• 格式：

class 类名{
constructor(参数){
    this.属性=参数;
}
方法名(){}//不是箭头函数
}
复制代码

• extends实现继承,格式以下：

class 子类 extends 父类{
    constructor(参数){
        super(参数)
        this.属性=值
    }
}
复制代码

例如：

class A1{
    constructor(a,b){
        this.a=a;
        this.b=b;
    }
    g(){console.log(this.a+this.b)}
}
class A2 extends A1{
    constructor(a,b,c){
        super(a,b)
        this.c=c;
    }
    s(){console.log(this.c)}
}
复制代码

• 类的静态方法 static 直接经过类名来访问的方法就是静态方法,使用方法直接在方法前加static就能够啦~

---

10、rest参数

rest 参数（形式为...变量名），用于获取函数的多余参数，这样就不须要使用arguments对象了。rest参数搭配的变量是一个数组，该变量将多余的参数放入数组中。以下代码：

function add(...values){
    var sum=0;
    for(var val of values){
sum+=val;
    }
    console.log(sum);
}
add(1,2,3)//6
复制代码

11、Set数据结构

set和数组差很少，也是一种集合，区别在于：它里面的值都是惟一的，没有重复的，是一个伪数组。

建立方式：

var s1=new Set();
Set s2=[1,2,3,"ad"];
s2.add(4);//使用add来添加元素
复制代码

• 可使用foreach 和for of来遍历：

s2.forEach(item=>console.log(item));
for(var p of s2){
    console.log(p)
};
复制代码

小技巧：使用set为数组去重：

var s1=new Set([1,1,1,2,2,3,3,4,5,2,1])
console.log([...s1])
复制代码

---

12、map数据结构

它相似于对象，里面存放也是键值对，区别在于：对象中的键名只能是字符串，若是使用map，它里面的键能够是任意值。 建立Map，以下：

var m=new Map();//1
var n=new Map(["a","hello"],[1,"123"]);//2
复制代码

添加元素：

m.set(2,"asd")
m.set([1,2,3],{1:"asdd"})
复制代码

获取其中元素：

m.get("2")//能够取得数据
m.get([1,2,3])//因为get()时要比较栈区中的地址，而不是堆区中的数据，将没法获得数据
复制代码

注意：若是有重复的键，后面的要把前面的覆盖的