ES6新特性

原文 https://www.cnblogs.com/libin-1/p/6716470.html 

一、新的变量声明方式 let/const

块级作用域与不再具备变量提升。 

二、 箭头函数的使用

三、模板字符串

// es6
const a = 20;
const b = 30;
const string = `${a}+${b}=${a+b}`;

四、 解析结构

类似python

// es5
var loading = props.loading;
var clicked = props.clicked;

// es6
const { loading, clicked } = props;

// 给一个默认值，当props对象中找不到loading时，loading就等于该默认值
const { loading = false, clicked } = props;

五、 函数默认参数

function add(x = 20, y = 30) {
return x + y;
}

console.log(add());

六、 展开运算符

在ES6中用...来表示展开运算符，它可以将数组方法或者对象进行展开。 

const arr1 = [1, 2, 3];
const arr2 = [...arr1, 10, 20, 30];

// 这样，arr2 就变成了[1, 2, 3, 10, 20, 30];
// 这种方式在react中十分常用
const props = {
size: 1,
src: 'xxxx',
mode: 'si'
}


const { size, ...others } = props;

console.log(others)

// 然后再利用暂开运算符传递给下一个元素，再以后封装react组件时会大量使用到这种方式，正在学习react的同学一定要搞懂这种使用方式
<button {...others} size={size} />

七、对象字面量 与 class

const name = 'Jane';
const age = 20

// es6
const person = {
name,
age
}

// es5
var person = {
name: name,
age: age
};

八、Promise

https://www.jianshu.com/p/fe5f173276bd

九、 模块 Modules