有关Es6知识的小结使用var声明的变量，会发生变量的提升，得到 var a;因此得到了undefined，但是let声

一 Let与const命令

Let是用来声明变量的，类似于var，但是所声明的变量，只有在let命令所在的代码块内有效

{
  let a = 10;
  var b = 1;
  }
  console.log(a)
  console.log(b)

a is not defined;后面的代码不在运行了

在上面的代码中，使用了var与let声明变量得到的结果是let声明的变量报错了，var声明的变量是正确的，这表明，let声明的变量只在特所在的代码块有效，

Let不存在变量的提升

// var 的情况
console.log(a);
var a=2
console.log(a); // 输出undefined  2
// let 的情况
console.log(b);
let b =5 // 报错b is not defined;

let b =5;
console.log(b)//5

使用var声明的变量，会发生变量的提升，得到 var a;因此得到了undefined，但是let声明的b没有进行变量提升，因此在输出是是不存在的，要使用会报错 b is not defined。

Let不允许重复声明

在同一个块级作用域，let不会重复声明同一个变量

 {
  let a = 10;
  var a = 1;}  //报错 Identifier 'a' has already been declared
 {
  let a = 10;
  let a = 1;}  //报错 Identifier 'a' has already been declared

Const:const盛名一个只读的常量，一旦声明后，就不能够更改了。

const PI = 3.1415;
PI // 3.1415
PI = 3; //Assignment to constant variable.不能改变常量的值

这行代码表明改变常量得值就会报错。Const声明的变量不会改变，const一旦声明变量，就必须初始化，不能以后进行赋值。

Const message;

const声明的变量，与let一样不可重复声明。

const message = "Goodbye!";
const message = 30;
//报错Identifier 'message' has already been declared

二数组

数组的结构赋值

从数组和对象中提取值，对变量进行赋值，这称为解构，

ES6之前为变量赋值；

let a = 1;
let b = 2;
let c = 3;

在es6中，可以写成这样

let [a, b, c] = [1, 2, 3];

可以从数组中提取值，按照对应位置，为变量赋值

let [a,[[b], c]] = [1, [[2], 3]];
//a  1   //b 2//   c// 3
let [ , , third] = ["a", "b", "c"];
//third  "c"
let [x, , y] = [1, 2, 3];
//x  1    y // 3
let [head, ...tail] = [1, 2, 3, 4];
//head  1    //tail [2, 3, 4]
let [x, y, ...z] = ['a'];
//x  "a"   //y undefined  //z []

如果不成功，变量的值就是undefined

扩展运算符

扩展运算符，扩展运算符是三个点（。。。），将一个数组转为用逗号分割的参数序列

console.log(...[1, 2, 3])
// 1 2 3
console.log(1, ...[2, 3, 4], 5)
// 1 2 3 4 5
[...document.querySelectorAll('div')]
// [<div>, <div>, <div>]

扩展运算符的应用

1.复制数组

数组是符合的数据类型，直接复制的话，只是复制了在堆区中数组的内存地址，而不是克隆了一个新的数组

const a1 = [1, 2];
const a2 = a1;

a2[0] = 2;
a1 // [2, 2]

a2并不是a1的克隆，而是指向同一份数据的另一个指针。修改a2，会直接导致a1的变化。

在es6中这样复制数组

const a1 = [1, 2];
const a2 = [...a1];

2.合并数组

扩展运算符提供了数组合并的新写法

const arr1 = ['a', 'b'];
const arr2 = ['c'];
const arr3 = ['d', 'e'];
 ES5 的合并数组arr1.concat(arr2, arr3);
// [ 'a', 'b', 'c', 'd', 'e' ]
ES6 的合并数组[...arr1, ...arr2, ...arr3]
// [ 'a', 'b', 'c', 'd', 'e' ]

不过，这两种方法都是浅拷贝，使用时需注意。

3.字符串

扩展运算符可以将字符串转为真正地数组

[...'hello']
// [ "h", "e", "l", "l", "o" ]

三数组的补充

1.Array.from()

Array.from方法用于将两类对象转为真正的数组，一类是为数组，即类似数组的对象和可以遍历的对象

let arrayLike = {
    '0': 'a',
    '1': 'b',
    '2': 'c',
    length: 3};
 ES5的写法var arr1 = [].slice.call(arrayLike); 
 // ['a', 'b', 'c']
 ES6的写法let arr2 = Array.from(arrayLike); 
 // ['a', 'b', 'c']

如果参数是一个真正的数组，Array.from会返回一个一模一样的新数组

Array.from([1, 2, 3])
// [1, 2, 3]
Array.of()
Array.of方法用于将一组数，转换为数组
Array.of(3, 11, 8) // [3,11,8]
Array.of(3) // [3]
Array.of(3).length // 1

2.Array.of()

基本上可以用来替代Array()或new Array()，并且不存在由于参数不同而导致的重载。它的行为非常统一。

Array.of() // []
Array.of(undefined) // [undefined]
Array.of(1) // [1]
Array.of(1, 2) // [1, 2]

Array.of总是返回参数值组成的数组。如果没有参数，就返回一个空数组。

3.数组实例的find()和findIndex()

数组实例的find方法，用于找出第一个符合条件的数组成员。

它的参数是一个回调函数，所有数组成员依次执行该回调函数，直到找出第一个返回值为true的成员，然后返回该成员。如果没有符合条件的成员，则返回undefined。

[1, 4, -5, 10].find((n) => n < 0)
// -5

找出第一个小于0的成员

[1, 5, 10, 15].find(function(value, index, arr) {
  return value > 9;}) // 10

上面代码中，find方法的回调函数可以接受三个参数，依次为当前的值、当前的位置和原数组。数组实例的findIndex方法的用法与find方法非常类似，返回第一个符合条件的数组成员的位置，如果所有成员都不符合条件，则返回-1。

[1, 5, 10, 15].findIndex(function(value, index, arr) {
  return value > 9;}) // 2

4.数组实例的fill()

fill方法使用给定值，填充一个数组

['a', 'b', 'c'].fill(7)
// [7, 7, 7]
new Array(3).fill(7)
// [7, 7, 7]

上面代码表明，fill方法用于空数组的初始化非常方便。数组中已有的元素，会被全部抹去。 fill方法还可以接受第二个和第三个参数，用于指定填充的起始位置和结束位置

['a', 'b', 'c'].fill(7, 1, 2)
// ['a', 7, 'c']

上面代码表示，fill方法从 1 号位开始，向原数组填充 7，到 2 号位之前结束。

5.数组实例的entries(),keys()和values()

ES6 提供三个新的方法——entries()，keys()和values()——用于遍历数组。它们都返回一个遍历器对象可以用for...of循环进行遍历，唯一的区别是keys()是对键名的遍历、values()是对键值的遍历，entries()是对键值对的遍历。

for (let index of ['a', 'b'].keys()) {
  console.log(index);}
// 0// 1
for (let elem of ['a', 'b'].values()) {
  console.log(elem);}
// 'a'// 'b'
for (let [index, elem] of ['a', 'b'].entries()) {
  console.log(index, elem);}
// 0 "a"// 1 "b"

6.数组实例的includes()

Array.prototype.includes方法返回一个布尔值，表示某个数组是否包含给定的值，与字符串的includes方法类似

[1, 2, 3].includes(2)     // true
[1, 2, 3].includes(4)     // false
[1, 2, NaN].includes(NaN) // true

该方法的第二个参数表示搜索的起始位置，默认为0。如果第二个参数为负数，则表示倒数的位置，如果这时它大于数组长度（比如第二个参数为-4，但数组长度为3），则会重置为从0开始。

[1, 2, 3].includes(3, 3);  // false
[1, 2, 3].includes(3, -1); // true

四字符串的结构赋值与函数；

字符串也可以结构赋值，字符串会被转换成一个类似数组的对象，

const [a, b, c, d, e] = 'hello';
//a  "h"   // b  "e"  // c "l" //d  "l"  //e  "o"

箭头函数：在es6中可以使用“箭头”（=>）来定义函数

var f = v => v;
// 等同于var f = function (v) {
  return v;};

如果箭头函数只有一条语句，return 和{}可以省略不写，如果不需要参数，就是用一个()代表参数部分

var f = () => 5;
// 等同于var f = function () { return 5 };
var sum = (num1, num2) => num1 + num2;
// 等同于var sum = function(num1, num2) {
  return num1 + num2;};

由于大括号被解释为代码块，所以如果箭头函数直接返回一个对象，必须在对象外面加上括号，否则会报错

let getTempItem = id => { id: id, name: "Temp" };
// 报错
let getTempItem = id => ({ id: id, name: "Temp" });
// 不报错

箭头函数的使用注意点

1.函数体内的this对象，就是定义时所在的对象，而不是现在使用时的对象。This对象中的指向是可变的，但是在箭头函数中，它是固定的

2.不可以当做构造函数，不可以使用new命令，否则会抛出错误。

3.不可以使用arguments对象，该对象在函数体内不存在，如果要用，可以使用rest参数代替

五属性相关的方法

（1）Obect.getOwnProertyDescriptor(); 获取一个对象中某个属性的详细信息。

var a=1;
console.log(Object.getOwnProertyDescriptor(window,"a"));

（2）Object.defineProperties() 精细化设置的对象

var obj ={};
Object.defineProperties(obj,{
    "name":{
        confingurable:false,//是否可以删除
        writable:false,//是否可以修改
        enumerable:false,//是否可以枚举
        value:"wangcai"
    }
})
console.log(obj.name)
结果如下:
wangcai

（3）getOwnPropertyNames() 获取自己的属性名，以数组的格式返回的。

var obj ={
    name:"wangcai",
    age:66,
};
console.log(Object.getOwnPropertyNames(obj))
结果如下
[ 'name', 'age' ]

（4）Object.keys() 得到属性名，放在数组中

var obj ={
    name:"wangcai",
    age :66
};console.log(Object.keys(obj))
结果如下
[ 'name', 'age' ]

使用Object.getOwnPropertyNames()和Object.keys()都可以得到一个对象的属性名，属性名是放在一个数组中的。

（5）对于对象的遍历目前有三种方式：

for in

Object.keys()

Object.getOwnPropertyNames()

for in  :  会输出自身以及原型链上可枚举的属性。
Object.keys()  :  用来获取对象自身可枚举的属性键
Object.getOwnPropertyNames() : 用来获取对象自身的全部属性名

（6）Object.values(); 获取对象的值，放到数组中。

var obj={
    name:"wangcai",
    age:66
};
console.log(Object.values(obj))
结果如下
[ 'wangcai', 66 ]

（7）Object.assign就去用于对象的合并，将源对象的所有的可枚举属性，复制到目标对象。代码如下：

var obj1 ={}
var obj2 ={
    name:"wangcai",
    age:20
}
var obj3={
    name:"hello"
}
Object.assign(obj1,obj2,obj3)
obj1的结果如下
{ name: 'hello', age: 20 }

注意细节：第一个参数是目标对象，assign这个方法把其它的参数中的属性全部加在第一个参数身上。

第一个参数在属性复制过程中，可以会被修改，后面的会覆盖前面的属性

assign这个方法的返回值就是第一个参数的引用，也就是返回了第一个参数。

assign这个方法会把原型上面的发展也拷贝了。

assign不能拷贝继承过来的属性

assign也不拷贝不可枚举的属性

assign是浅拷贝,这一点要注意

（8）set set和数据差不多，也是一种集合，区别在于：它里面的值都是唯一的，没有重复的。

数组如下：

var arr =[1,2,3,1,true,"hello",true]
console.log(arr);
结果如下
[ 1, 2, 3, 1, true, 'hello', true ]
使用set后
var arr =new Set[1,2,3,1,true,"hello",true]
console.log(arr);
就直接报错了

set也是一种集合，放一个数组，如下：

var s1=new Set([1,2,3,"true"]);
console.log(s1)
结果如下
Set { 1, 2, 3, 'true' }

放一个对象，使用add()来添加，如下：

var s1 =new Set();
s1.add(1)
s1.add(2)
s1.add(3)
console.log(s1)
console.log(typeof s1)
结果如下
Set { 1, 2, 3 }
object

（9）map 它类似于对象，里面存放也是键值对，区别在于：对象中的键名只能是字符串，如果使用map，它里面的键可以是任意值。

创建Map，如下：

var m = new Map()

可以这样放数据，使用set进行添加如下：

var m = new Map([
    ["a","hello"],
    [1,"123"]
]);
var s1 =m.set(false,"abc")

console.log(s1)
结果如下
Map { 'a' => 'hello', 1 => '123', false => 'abc' }

有关Es6知识的小结