ES6新特性

let && const

let

let所声明的变量，只在let所在的代码块内有效。

for(let i = 0; i < 5; i++){
    console.log(i);
}
console.log("循环外：" + i);

const

const声明的变量是常量，不能被修改；

const PI = 3.1415;
PI // 3.1415
PI = 3;

强行对其进行重新赋值会报错。

iterable类型

为了统一集合类型，ES6标准引入了新的iterable类型，Array、Map和Set都属于iterable类型，具有iterable类型的集合可以通过新的for … of循环来遍历。

Map

Map本质是与Object类似的结构。不同在于Object强制规定key值只能是字符串。而Map对象的key可以是任意对象：

• object是<String, Object>集合
• map是<Object, Object>集合

var m = new Map(); // 空Map
m.set('Adam', 67); // 添加新的key-value
m.set('Bob', 59);
m.has('Adam'); // 是否存在key 'Adam': true
m.get('Adam'); // 67
m.delete('Adam'); // 删除key 'Adam'
m.get('Adam'); // undefined

Set

Set本质与数组类似。不同于Set中只能保存不同的元素，如果元素相同会被忽略

let set = new Set();
set.add(1);	// [1]
let set2 = new Set([1,2,3,4,5])	// [1,2,3,4,5] /
set.add() // 添加，元素内容不可重复，重复会被忽略
set.clear() // 清空
set.delete(value)  // 删除指定元素，删除的是元素内容，而不是下标
set.has(value)  // 判断指定元素是否存在
set.forEach(function(){})  // 遍历
set.size  // 元素个数

解构赋值

 ES6 允许按照一定模式，从数组和对象中提取值，对变量进行赋值，这被称为解构

数组结构

let [a, b, c] = [1, 2, 3];
//等同于
let a = 1;
let b = 2;
let c = 3;

对象结构

const person = {
    name: "Tom",
    age: 20,
    language: ['Java','JavaScript','Python']
}
const {name,age,language} = person;		// {}内的属性名必须是person的属性名
//等同于
let name="Tom"
let age=20
let language=['Java','JavaScript','Python']

字符串扩展

字符串API

• includes(“xxx”)：返回布尔值，表示是否包含xxx
• startsWith(“xxx”)：返回布尔值，表示是否以xxx开头
• endsWith(“xxx”)：返回布尔值,表示是否以xxx结尾

字符串模板

ES6中提供了`来作为字符串模板标记。

let str = `
    hello
    Java
    and
    JavaScript
    `;
    console.log(str);

扩展运算符

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

console.log(...[1,2,3]);        // 1 2 3
console.log(1,...[2,3,4],5);    // 1 2 3 4 5

function add(x,y) {
    return x+y;
}
const number = [1, 2];
console.log(add(...number));    // 3

let arr = [...[1,2,3],...[4,5,6]];
console.log(arr);   //[1,2,3,4,5,6]

const [first,...rest] = [1,2,3,4,5,6];
console.log(first,rest);    // 1 [2,3,4,5,6]

console.log([..."hello"]);  // ["h","e","l","l","o"]

Promise

const promise = new Promise(function (resolve, reject) {
    // 执行异步操作
    if (/*异步操作成功*/){
        // 调用resolve，代表Promise将返回成功的结果
        resolve(value)
    }else {
        // 调用reject，代表Promise将返回错误的结果
        reject(error)
    }
})

promise.then(function(value)){
	// 异步执行成功后的回调
}.catch(function(error)){
	// 异步执行失败后的回调
}

函数优化

函数数默认值

function add(a,b = 1){
    return a+b;
}
console.log(add(10));	//输出11
console.log(add(10，20));	//输出30

函数箭头

一个函数的简写方式

//一个参数
let print = function (obj){
    console.log(obj);
}
// 简写为：
let print2 = obj => console.log(obj);


//多个参数
let sum = function(a,b){
    return a + b;
}
// 简写为：
let sum2 = (a,b) => a + b;


//没有参数时
// 没有参数时，需要用()进行占位，代表参数部分
let hello = function(){
    console.log("Hello ...")
}
// 简写为：
let hello2 = () => console.log("Hello ...")

map() && reduce()

map()

map()：接收一个函数，将原数组中的所有元素用这个函数处理后放入新的数组返回。

let arr = ['1','2','3','4']
console.log(arr);

let newArr = arr.map(s => parseInt(s));
console.log(newArr);

reduce()

reduce()：接收一个函数（必须）和一个初始值（可选），该函数接收两个参数：

• 第一个参数是上一次reduce处理的结果，
• 第二个参数是数组中要处理的下一个元素

reduce()会从左至右依次把数组中的元素用reduce()处理，并把处理结果作为下一次reduce的第一个参数，如果是第一次，会把前两个元素作为计算参数，或者把传入的初始值参数作为起始值。

const arr = [2,5,-10,20]; 
arr.reduce((a,b)=>a+b)  //17

const arr = [2,5,-10,20]; 
arr.reduce((a,b)=>a+b,1)  //18

const arr = [2,5,-10,20]; 
arr.reduce((a,b)=>a+b,arr.reduce((a,b)=>a+b))  //34

Generator函数

generator是ES6提供的一种异步编程解决方案，语法行为与传统函数完全不同。

Generator函数有两个特征

• function命令与函数名之间有一个*****号
• 函数体内部使用yield语句定义不同的内部状态

function * hello() {
        yield "hello";
        yield "world";
        return "over"
    }
    let hi = hello();
    console.log(hi.next());
    console.log(hi.next());
    console.log(hi.next());
    console.log(hi.next());