最常用的ES6特性
let, const, class, extends, super, arrow functions, template string, destructuring, default, rest arguments
這些是ES6最常用的幾個語法
1. let
用它所聲明的變量，只在let命令所在的代碼塊內(nèi)有效。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="gbk">
<title>Document</title>
</head>
<body>
<script>
//例1
let name = 'zhangshang'
while (true) {
let name = 'lishi'
console.log("名字1: "+name) //輸出 obama
break
}
console.log("名字2: "+name) //輸出 zach
//例2
var a = [];
for (let i = 0; i < 10; i++) {
a[i] = function () {
console.log(i); // 輸出6，如果是var a 那會輸出10
};
}
a[6]()
</script>
</body>
</html>
本地保存為html文件用谷歌瀏覽器打開
2. const
聲明常量。一旦聲明，常量的值就不能改變。
const有一個很好的應(yīng)用場景，就是當(dāng)我們引用第三方庫的時聲明的變量
const monent = require('moment')
3. class, extends, super
<script>
//class
class Animal {
constructor(){ //constructor方法，這就是構(gòu)造方法
this.type = 'animal' //this關(guān)鍵字則代表實例對象
}
says(say){
console.log(this.type + ' says ' + say)
}
}
let animal = new Animal()
animal.says('hello') //輸出 animal says hello
//class 繼承
class Cat extends Animal {
constructor(){
super() //super關(guān)鍵字，它指代父類的實例（即父類的this對象）
this.type = 'cat'
}
}
let cat = new Cat()
cat.says('hello') //輸出 cat says hello
</script>
//constructor內(nèi)定義的方法和屬性是實例對象自己的，而constructor外定義的方法和屬性則是所有實例對象可以共享的。
//子類必須在constructor方法中調(diào)用super方法，否則新建實例時會報錯。這是因為子類沒有自己的this對象，而是繼承父類的this對象，然后對其進行加工。如果不調(diào)用super方法，子類就得不到this對象。
4. arrow function 箭頭函數(shù)
是ES6最最常用的一個新特性了，用它來寫function比原來的寫法要簡潔清晰很多
<script>
//箭頭函數(shù)
class Animal {
constructor(){
this.type = 'animal'
}
says(say){
setTimeout( () => {
console.log(this.type + ' says ' + say)
}, 1000)
}
}
var animal = new Animal()
animal.says('hi') //animal says hi
</script>
當(dāng)我們使用箭頭函數(shù)時，函數(shù)體內(nèi)的this對象，就是定義時所在的對象，而不是使用時所在的對象。
并不是因為箭頭函數(shù)內(nèi)部有綁定this的機制，實際原因是箭頭函數(shù)根本沒有自己的this，它的this是繼承外面的，因此內(nèi)部的this就是外層代碼塊的this。
4. template string 模板字符串``
我們要用一堆的'+'號來連接文本與變量，而使用ES6的新特性模板字符串``后，我們可以直接這么來寫：
<Link to={`/taco/${taco.name}`}>{taco.name}</Link>
<script>
$("#result").append(`
There are <b>${basket.count}</b> items
in your basket, <em>${basket.onSale}</em>
are on sale!
`);
</script>
5. destructuring 解構(gòu)
ES6允許按照一定模式，從數(shù)組和對象中提取值，對變量進行賦值，這被稱為解構(gòu)（Destructuring）。
方式一：
<script>
let cat = 'ken'
let dog = 'lili'
let zoo = {cat, dog}
console.log(zoo) //Object {cat: "ken", dog: "lili"}
</script>
方式二：
<script>
let dog = {type: 'animal', many: 2}
let { type, many} = dog //把dog數(shù)組的值，賦給type,many
console.log(type, many) //打印變量type, many，輸出animal 2
</script>
5. default參數(shù)
ES6允許為函數(shù)參數(shù)設(shè)置默認值，即直接寫在參數(shù)定義后面。
<script>
function Point(x = 0, y = 0) {
this.x = x;
this.y = y;
}
var p = new Point();
p //輸出 {x:0, y:0}
</script>
5. rest參數(shù) （三個點）
Rest參數(shù)接收函數(shù)的多余參數(shù)，組成一個數(shù)組，放在形參的最后，形式如下：
<script>
function animals(...types){
console.log(types)
}
animals('cat', 'dog', 'fish') //["cat", "dog", "fish"]
</script>
注意，rest參數(shù)之后不能再有其它參數(shù)（即，只能是最后一個參數(shù)），否則會報錯。
函數(shù)的length屬性，不包括rest參數(shù)：
