es6新特性

ECMAScript 6(ES6) 目前基本成为业界标准，它的普及速度比 ES5 要快很多，主要原因是现代浏览器对 ES6的支持相当迅速，尤其是 Chrome 和 Firefox 浏览器，已经支持 ES6 中绝大多数的特性。

以下是一些常用到的es6新特性：

1、 let const 的概念以及与var的区别

详情跳转至var、let、const的区别

2、模板字符串（就是反引号引起来的字符串）

例如：

  <script>let  people={name:"xiaoming",age:12,}console.log("我是"+people.name+",今年"+people.age+"岁");//我是xiaoming,今年12岁// 使用模板字符串 是用`${}`console.log(`我是${people.name},今年${people.age}岁`);//我是xiaoming,今年12岁</script>

<script>// 最终内容是一个值都可以注入模板字符串const sex ="nan";const xiao =function(sex){return sex="nan"?"男":"女"}console.log(`${xiao(sex)}`);//男
</script>

//例3（可带标签，实现换行等）
document.write (`  <table border="1" cellspacing="0" cellpadding="20"><tr><td>模板字符串1</td></tr><tr><td>模板字符串2</td></tr></table> `);

结果：

3、展开数组

作用：可以对数组元素进行展开

const arr = ['foo','bar','styring']
console.log(...arr) //结果：foo bar styring

4、对象字面量简写

ES6中，当对象键名与对应值名相等的时候，可以进行简写。方法也能够进行简写。

• 注意：简写的对象方法不能用作构造函数，否则会报错

const  num = '124'
const  obj = {name:'toney',// num: num,  //可简写如下：num,  
}
console.log(obj.num)  //124

5、箭头函数

详情跳转至箭头函数

6、函数传递参数的时候的默认值

  <script>function test(a=1){ //默认值console.log(a);
}
test()  // 1
test(2)  // 2</script>

注意： 如果调用函数的时候没有给定形参，那么输出的结果就是默认值1，如果给定了形参，那么就输出传的形参。

7、解构赋值

作用：快速从对象或数组中获取到成员
例1:

  <script>let obj = {name : 'jack',age:18,
}let { name,age } = obj //解构赋值console.log(name,age);  //jack 18</script>

例2：

  <script>
const school = {classes: {stu: {name: 'Bob',age: 24,}}
}
const { classes: { stu: { name } }} = schoolconsole.log(name)  // Bob</script>

有时会遇到一些嵌套程度非常深的对象，可以在解构出来的变量名右侧，通过冒号+{目标属性名}这种形式，进一步解构它，一直解构到拿到目标数据为止。

例3：

  <script>
function test(){let arr =['jack', 'rose', 'mackerel']let[a,b,c] = arrconsole.log(a,b,c);
}
test()</script>