現(xiàn)在主流的瀏覽器都是支持到ES5, 為了表述方便，我在此發(fā)明一個名詞"ES6+" 就是ES5以后的版本，包括ES6, ES7. 為什么說現(xiàn)在就用，雖然主流的瀏覽器只支持到ES5, 但是現(xiàn)在有很多的轉(zhuǎn)換器，可以把一些ES6和ES7的代碼轉(zhuǎn)換為ES5的代碼。這就意味著我們現(xiàn)在就可以使用這些新特性，然后使用轉(zhuǎn)碼器讓代碼可以運(yùn)行在主流的瀏覽器上。

系列目錄

ES6+ 現(xiàn)在就用系列（一)：為什么使用ES6+
ES6+ 現(xiàn)在就用系列（二)：let 命令
ES6+ 現(xiàn)在就用系列（三)：const 命令
ES6+ 現(xiàn)在就用系列（四)：箭頭函數(shù) =>
ES6+ 現(xiàn)在就用系列（五)：模板字面量 (Template Literals)
ES6+ 現(xiàn)在就用系列（六)：解構(gòu)賦值 (Destructuring )
ES6+ 現(xiàn)在就用系列（七)：Promise
ES6+ 現(xiàn)在就用系列（八)：類 (Class)，繼承，對象的擴(kuò)展
ES6+ 現(xiàn)在就用系列（九)：模塊
ES6+ 現(xiàn)在就用系列（十)：Async 異步編程
ES6+ 現(xiàn)在就用系列（十一)：ES7 Async in Browser Today

ES6+

現(xiàn)在主流的瀏覽器都是支持到ES5, 為了表述方便，我在此發(fā)明一個名詞"ES6+" 就是ES5以后的版本，包括ES6, ES7. 為什么說現(xiàn)在就用，雖然主流的瀏覽器只支持到ES5, 但是現(xiàn)在有很多的轉(zhuǎn)換器，可以把一些ES6和ES7的代碼轉(zhuǎn)換為ES5的代碼。這就意味著我們現(xiàn)在就可以使用這些新特性，然后使用轉(zhuǎn)碼器讓代碼可以運(yùn)行在主流的瀏覽器上。

為什么立即開始使用ES6, ES7的新特性？

JavaScript語言的一些糟糕的實(shí)現(xiàn)

先不說JavaScript語言本身設(shè)計是否有問題，現(xiàn)有JavaScript語言的實(shí)現(xiàn)里有很多非常糟糕或者詭異的實(shí)現(xiàn)，就是你以為代碼的結(jié)果是這樣，但是他偏偏是那樣，這給我們程序帶了很多的意向不到的Bug和煩惱，如果你要是JavaScript大牛，你需要了解他內(nèi)部的實(shí)現(xiàn)的Bug, 而且要知道哪些詭異的寫法輸出了什么詭異的結(jié)果，我個人對了解這種東西實(shí)在提不起太大的興趣，因?yàn)槲抑幌胗谩罢Z言”來實(shí)現(xiàn)我的項(xiàng)目讓人很好的使用我開發(fā)的軟件，但是由于歷史這樣或那樣的原因，導(dǎo)致JavaScript語言成為瀏覽器的霸主，我們不得不忍受這些糟糕的問題。下面我來展示一些讓你覺得詭異的問題 （如果你不不覺得詭異，恭喜你，你已經(jīng)是JavaScript的“高手”)

示例1:

(function() {
    return NaN === NaN;
})();
    
輸出: false

示例2:

(function() {
    return (0.1 + 0.2 === 0.3);
})();

輸出: false

示例3:

[5, 12, 9, 2, 18, 1, 25].sort();

輸出: [1, 12, 18, 2, 25, 5, 9]

示例4:

var a = "1"
var b = 2
var c = a + b

輸出：c = "12" 

var a = "1"
var b = 2
var c = +a + b

輸出：c = 3   

示例5:

(function() {
    return ['10','10','10','10'].map(parseInt);
})();

輸出: [10, NaN, 2, 3]

示例6:

(function() {
    return 9999999999999999;
})();

輸出: 10000000000000000

示例7:

var a = [];
for (var i = 0; i < 10; i++) {
a[i] = function () {
    console.log(i);
};
}
a[1](); 
a[2]();
a[3]();

輸出: 10,10,10

我是覺得如果按正常人的理解，代碼不能得到想要的結(jié)果，那就算是語言本身的問題。如果一個程序執(zhí)行的和人期望的不一樣，或者還需要一些Hack的方法，那么是很糟糕的。

ES5 一些語言特性的缺失

由于上面的很多問題，所以ES 需要不斷的改進(jìn), 當(dāng)然新的版本肯定不可能一下子解決之前所有的問題。

已有JavaScript的問題這一塊就不細(xì)說了，因?yàn)槟軄砜催@篇文章的人，應(yīng)該對下面我列的幾個突出的問題都有感受。

• 沒有塊級作用域，這個導(dǎo)致上面示例7的問題
• 全局變量的污染
• 類的寫法比較怪異
• 沒有模塊管理
• 異步調(diào)用寫法容易產(chǎn)生 “回調(diào)地獄”

為什么可以立即使用？

因?yàn)楝F(xiàn)在很多轉(zhuǎn)換器已經(jīng)可以把ES6所有的特性以及ES7的部分特性轉(zhuǎn)換為ES5，Babel就是一個非常好的轉(zhuǎn)換器，所以我這里建議凡是能被Babel轉(zhuǎn)換的新特性都可以立即在項(xiàng)目里適用。

ES6和ES7的一些新特性，可以大大提高項(xiàng)目的健壯性，同時讓代碼更易讀，同時也可以避免很多ES5之前的很多詭異的東西。Gulp里可以很好的使用babel, 如果你對Gulp不熟悉，可以參考我博客里的Gulp系列。

這里簡單說一Gulp和babel如何結(jié)合使用

$ npm install -g gulp-babel

var gulp=require('gulp'), babel=require('gulp-babel');

gulp.task('build',function(){
    return gulp.src('src/app.js')
               .pipe(babel())
               .pipe(gulp.dest('build'))    
})

后面的系列，我將以此介紹ES6, ES7的一些可以現(xiàn)在就用的主要特性。