es6经常使用语法（一）

let 和 const 命令

let 命令

• 只在let命令所在的代码有效

let命令，用来声明变量。它的用法相似于var，可是所声明的变量，只在let命令所在的代码块即{}内有效。

{
  let a = 1;
  var b = 2;
}
console.log(a) // ReferenceError: a is not defined.
console.log(b) // 2
复制代码

• 不存在变量提高

var命令会发生“变量提高”现象，即变量能够在声明以前使用，值为undefined。这种现象多多少少是有些奇怪的，按照通常的逻辑，变量应该在声明语句以后才可使用。

// var 的状况
console.log(a); // 输出undefined
var a = 2;

// let 的状况
console.log(b); // 报错ReferenceError
let b = 2;
复制代码

• 暂时性死区

只要块级做用域内存在let命令，它所声明的变量就“绑定”这个区域，再也不受外部的

var a = 123;
if (true) {
  a = 'abc'; // ReferenceError
  let a;
}
复制代码

• 不容许重复声明

let不容许在相同做用域内，重复声明同一个变量。

---

• const 命令

const 声明一个只读的常量。一旦声明，常量的值就不能改变。const实际上保证的，并非变量的值不得改动，而是变量指向的那个内存地址所保存的数据不得改动。对于简单类型的数据（数值、字符串、布尔值），值就保存在变量指向的那个内存地址，所以等同于常量。但对于复合类型的数据（主要是对象和数组），变量指向的内存地址，保存的只是一个指向实际数据的指针，const只能保证这个指针是固定的（即老是指向另外一个固定的地址），至于它指向的数据结构是否是可变的，就彻底不能控制了。所以，将一个对象声明为常量必须很是当心。

变量的解构赋值

• 数组的解构赋值

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

let [a, b, c] = [1, 2, 3];
复制代码

嵌套数组进行解构的例子

let [ , , x] = ["a", "b", "c"];
console.log(x) // c
let [head, ...end] = [1, 2, 3, 4];
console.log(head)  // 1
console.log(end) // [2,3,4]
复制代码

解构赋值容许指定默认值。

let [x, y = 'b'] = ['a']; // x='a', y='b'
复制代码

• 对象解构赋值

对象的解构与数组有一个重要的不一样。数组的元素是按次序排列的，变量的取值由它的位置决定；而对象的属性没有次序，变量必须与属性同名，才能取到正确的值。

let { a, b } = { a: 'aaa', b: 'bbb' };
console.log(a) // "aaa"
console.log(b) // "bbb"
复制代码

实际上面的写法等于下面这个{ a, b }是 { a:a, b:b }的简写形式

let { a:a, b:b } = { a: 'aaa', b: 'bbb' };
console.log(a) // "aaa"
console.log(b) // "bbb"
复制代码

对象的解构也能够指定默认值。

var {a = 3} = {};
 console.log(a) // 3
 
 var {a, b = 2} = {x: 1};
 console.log(a) // 1
 console.log(b) // 2
复制代码

• 函数参数的解构赋值

函数的参数使用解构赋值是平时最多见的用法。用法相似数组和对象结构赋值，包括默认值，很是好用。

function test([x = 5, y]){
  return x + y;
}

test([1, 2]); // 3
test([, 2]); // 7

function test2({x = 0, y = 0} = {}) {
  return [x, y];
}

test2({x: 3, y: 8}); // [3, 8]
test2({x: 3}); // [3, 0]
test2({}); // [0, 0]
test2(); // [0, 0]
复制代码

数组和对象扩展运算符

扩展运算符（spread）是三个点（...），将一个数组或对象转为用逗号分隔的参数序列。

• 数组扩展运算符

console.log(...[1, 2, 3])
  // 1 2 3
  console.log(1, ...[2, 3, 4], 5)
  // 1 2 3 4 5
  //用于函数参数
  function push(array, ...items) {
    array.push(...items);
  }
  function add(x, y) {
    return x + y;
  }
  const numbers = [4, 38];
  add(...numbers) // 42
复制代码

• 对象扩展运算符

关于属性简写

//属性简写
const a = 'a';
const b = {a};
console.log(b) // {foo: "bar"}
// 等同于
const b = {a: a};

//方法简写。
let c = {
 method() {
   return "Hello!";
 }
};
// 等同于
let c = {
 method: function() {
   return "test!";
 }
};
复制代码

对象的扩展符用于从一个对象取值，至关于将目标对象自身的全部可遍历的

let { x, y, ...z } = { x: 1, y: 2, a: 3, b: 4 };
console.log(x) // 1
console.log(y) // 2
console.log(z) // { a: 3, b: 4 }
复制代码

Symbol

---

ES6 引入了一种新的原始数据类型Symbol，表示独一无二的值。它是 JavaScript 语言的第七种数据类型

let s = Symbol();
typeof s
// "symbol"
let a = Symbol('foo');
let a = Symbol('bar');
console.log(Symbol('test') == Symbol('test')) //fase
a // Symbol(foo)
b // Symbol(bar)

a.toString() // "Symbol(foo)"
b.toString() // "Symbol(bar)"
复制代码

做为属性名的 Symbol

let mySymbol = Symbol();

// 第一种写法
let a = {};
a[mySymbol] = 'Hello!';

// 第二种写法
let a = {
  [mySymbol]: 'Hello!'
};

// 第三种写法
let a = {};
Object.defineProperty(a, mySymbol, { value: 'Hello!' });

// 以上写法都获得一样结果
a[mySymbol] // "Hello!"
复制代码

Set 和 Map 数据结构

---

• Set

ES6 提供了新的数据结构 Set。它相似于数组，可是成员的值都是惟一的，没有重复的值。

const s = new Set();

[2, 3, 5, 4, 5, 2, 2].forEach(x => s.add(x));

for (let i of s) {
  console.log(i);
}
// 2 3 5 4
//数组去重
const set = new Set([1, 2, 3, 4, 4]);
[...set]
// [1, 2, 3, 4]
复制代码

Set 实例的属性和方法

• Set.prototype.constructor：构造函数，默认就是Set函数。
• Set.prototype.size：返回Set实例的成员总数。
• Set.prototype.add(value)：添加某个值，返回 Set 结构自己。
• Set.prototype.delete(value)：删除某个值，返回一个布尔值，表示删除是否成功。
• Set.prototype.has(value)：返回一个布尔值，表示该值是否为Set的成员。
• Set.prototype.clear()：清除全部成员，没有返回值。

let a =new Set();
a.add(1).add(2).add(2);
// 注意2被加入了两次

s.size // 2

s.has(1) // true
s.has(2) // true
s.has(3) // false

s.delete(2);
s.has(2) // false
复制代码

Set 遍历操做

• Set.prototype.keys()：返回键名的遍历器
• Set.prototype.values()：返回键值的遍历器
• Set.prototype.entries()：返回键值对的遍历器
• Set.prototype.forEach()：使用回调函数遍历每一个成员

let set = new Set(['red', 'green', 'blue']);

for (let item of set.keys()) {
  console.log(item);
}
// red
// green
// blue

for (let item of set.values()) {
  console.log(item);
}
// red
// green
// blue

for (let item of set.entries()) {
  console.log(item);
}
// ["red", "red"]
// ["green", "green"]
// ["blue", "blue"]
复制代码

• Map

JavaScript 的对象（Object），本质上是键值对的集合（Hash 结构），可是传统上只能用字符串看成键。这给它的使用带来了很大的限制。

const m = new Map([['name','yzg'],['age',25]]);
const o = {p: 'Hello World'};

m.set(o, 'content')
m.get(o) // "content"

m.has(o) // true
m.delete(o) // true
m.has(o) // false
m.has('name')  // true
m.get('age') //25
复制代码

Map 遍历操做

• Map.prototype.keys()：返回键名的遍历器
• Map.prototype.values()：返回键值的遍历器
• Map.prototype.entries()：返回键值对的遍历器
• Map.prototype.forEach()：使用回调函数遍历每一个成员