1. 介紹
1.1 什麼是ECMAScript
ECMAScript，簡稱ES，是由Ecma國際（前身為歐洲計算機制造商協會,英文名稱是European Computer Manufacturers Association）按照ECMA-262和ISO/IEC 16262標準制定的一種指令碼語言規範。
1.2 JavaScript 與 ECMAScript 的關係
JavaScript是按ECMAScript規範實現的一種指令碼語言，其他的還有JScript、ActionScript。
這三種語言還提供了ECMA規範外的額外功能。
1.3 ECMAScript版本
截止到2017年年底，ECMAScript共釋出了8個版本：
ECMAScript 1
1997年06月：釋出首版。
ECMAScript 2
1997年06月：修改規範完全符合ISO/IEC 16262國際標準。
ECMAScript 3
1999年12月：增加正則、更好的文書處理、新的控制語句、try/catch異常處理、更加明確的錯誤定義，數字輸出格式等等。
ECMAScript 4
放棄釋出。
ECMAScript 5
2009年12月：完善了ECMAScript 3版本、增加”strict mode,”（嚴格模式）、以及新的功能，如getter和setter、JSON庫支援和更完整的物件屬性。
ECMAScript 5.1
2011年06月：使規範更符合ISO/IEC 16262:2011第三版。
ECMAScript 6
2015年06月：第六版的名字有很多，可以叫ECMAScript 6（ES6），也可以叫ECMAScript 2015（ES2015）。
此版本增加了非常重要的東西：let、const、class、modules、 arrow functions,、template string, destructuring, default, rest argument、binary data、promises等等。
規範地址：http://www.ecma-international.org/ecma-262/6.0/
ES6及以上的教程可參考Babel提供的： https://babeljs.io/learn-es2015/
ECMAScript 7
2016年06月：也被稱為ECMAScript 2016。完善ES6規範，還包括兩個新的功能：求冪運算子（*）和array.prototype.includes方法。
規範地址：http://www.ecma-international.org/ecma-262/7.0/
ECMAScript 8
2017年06月：增加新的功能，如併發、原子操作、Object.values/Object.entries、字串填充、promises、await/asyn等等。
規範地址：http://www.ecma-international.org/ecma-262/8.0/
2. 瀏覽器與JS新特性
2.1 檢視瀏覽器支援情況
JS的每隔一段時間就會出新的特性，而瀏覽器只有不斷的升級才能滿足這些，而且同一個瀏覽器各版本對新特性的支援情況也不一樣。
網站：https://caniuse.com/ 提供了檢視某個功能瀏覽器的支援情況。
如es6規範新增加的arrow function（箭頭函式）的支援如下：
可以看到IE所有版本完全不支援，chrome 45版本才開始支援。
2.2 Babel
想使用JS的新特性，又想相容舊瀏覽器版本，那麼就需要一種轉換工具：把JS的新特性程式碼轉換為舊瀏覽器可以支援的JS程式碼。而Babel就是這麼一個工具。
Babel，官方介紹一個JavaScript編譯器。說簡單點就是把使用ES6及以上的特性的程式碼轉換為對應的ES5程式碼，以使舊瀏覽器可以執行。
在gulp中使用Babel
Babel除了自身提供Babel built-ins外，還提供了其他構建工具的版本，本示例以gulp為例。
1) 安裝gulp-babel
- npm install —save–dev gulp–babel babel–core babel–preset–env
2) 編寫一段ES6的程式碼
建立一個app.js檔案，並寫入以下程式碼：
- var sayHello = (userName, age) => {
- console.log(userName + ` age is ` + age);
- };
3) 編寫gulp檔案
- var gulp = require(`gulp`);
- var babel = require(`gulp-babel`);
- gulp.task(`default`, function() {
- return gulp
- .src(`js/app.js`)
- .pipe(
- babel({
- presets: [`env`]
- })
- )
- .pipe(gulp.dest(`dist`));
- });
4) 執行gulp後的結果
- `use strict`;
- var sayHello = function sayHello(userName, age) {
- console.log(userName + ` age is ` + age);
- };
JavaScript ECMAScript版本介紹的更多相關文章
- Xamarin Android教程Android基本知識版本介紹與系統介紹
Xamarin Android教程Android基本知識版本介紹與系統介紹 Xamarin Android教程Android基本知識版本介紹與系統介紹,開發Andriod有時候不像iOS一樣輕鬆,因為 …
- Cloudera Hadoop什麼是CDH及CDH版本介紹
本文引用自:Cloudera Hadoop什麼是CDH及CDH版本介紹http://www.aboutyun.com/thread-6788-1-1.html(出處: about雲開發) 雲技術新興的 …
- mysql學習之-三種安裝方式與版本介紹
MYSQL版本介紹 mysql分alpha,beta,rc,GA四個版本. alpha 暗示這是一個以展示新特性為目的的版本,存在比較多的不穩定因素,還會向程式碼中新增新新特性beta 以後的beta …
- Hadoop發行版本介紹
前言 從2011年開始,中國進入大資料風起雲湧的時代,以Hadoop為代表的家族軟體,佔據了大資料處理的廣闊地盤.開源界及廠商,所有資料軟體,無一不向Hadoop靠攏.Hadoop也從小眾的高富帥領域 …
- Ubuntu版本介紹
轉自Ubuntu版本介紹 經常有人問起Ubuntu的版本選擇問題,論壇中雖有帖子提及,但不是很詳細,不集中,我就嘗試把Ubuntu上的這點東東翻譯一下,供大家參考,水平有限,敬請包涵.指正. Ubu …
- Linux主要發行版本介紹
Linux主要發行版本介紹 1．Red Hat Linux Red Hat是一個比較成熟的Linux版本,無論在銷售還是裝機量上都比較可觀.該版本從4.0開始同時支援Intel.Alpha及Sparc …
- JavaScript Date物件介紹
原文:JavaScript Date物件介紹 Date 日期和時間物件 1. 介紹 Date物件,是操作日期和時間的物件.Date物件對日期和時間的操作只能通過方法. 2. 建構函式 2.1 new …
- eclipse各版本介紹
記錄下吧!以免以後下載時候又不知道下載那個: Eclipse IDE for Java Developers 是為java開發的 Eclipse IDE for Java EE Developers …
- android studio的Beta, Canary, Dev, Stable四種Channel版本介紹、分析與選擇
一.概述 在Android Studio下載官網上,有如下介紹: ` Android Studio`s built-in update mechanism can be set to receive …
隨機推薦
- gulp-uglify 與gulp.watch()配合使用時遇到的重複壓縮問題
今天學習gulp時候,用到gulp-uglify壓縮js模組,遇到的一個問題-當用gulp.watch來監聽js檔案的變動時出現重複壓縮的問題 目錄結構如下: gulpfile.js程式碼如下: var …
- Linux-磁碟及網路IO工作方式解析
PIO與DMA 有必要簡單地說說慢速I/O裝置和記憶體之間的資料傳輸方式. PIO我們拿磁碟來說,很早以前,磁碟和記憶體之間的資料傳輸是需要CPU控制的,也就是說如果我們讀取磁碟檔案到記憶體中,資料要經過C …
- [.net 物件導向程式設計基礎] (21) 委託
[.net 物件導向程式設計基礎] (20) 委託 上節在講到LINQ的匿名方法中說到了委託,不過比較簡單,沒了解清楚沒關係,這節中會詳細說明委託. 1. 什麼是委託? 學習委託,我想說,學會了就感覺簡 …
- [持續更新]UnsatisfiedLinkError常見問題及解決方案
想必很多開發者和我們一樣,遇到過許多UnsatisfiedLinkError的困難,著實令人頭疼,現在總結一下,希望能幫助更多的人. 常見錯誤 lib庫不同目錄下的SO檔案參差不齊. lib庫目錄下的 …
- $.ajax()方法詳解及例項
1.url: 要求為String型別的引數,(預設為當前頁地址)傳送請求的地址. 2.type: 要求為String型別的引數,請求方式(post或get)預設為get.注意其他http請求方法,例如 …
- MyBatis+springMVC+easyUI (dataGirl)實現分頁
頁面展示效果. 頁面程式碼: <%@ page contentType=”text/html;charset=UTF-8″ language=”java” …
- WinCE開機Logo的實現(USB下載圖片到nandflash)
WinCE開機啟動Logo使用Eboot讀取NandFlash中的圖片資料,然後顯示的方式.對於開機logo的方式網友http://jazka.blog.51cto.com/809003/664131 …
- detangle c++ symbols
hust$ c++filt _ZN1AC2Ev hust$A::A()
- WAS維護常用操作
0.WAS學習地址: http://www.open-open.com/doc/list/276?pn=1http://www.doc88.com/p-7498799200332.htmlhttp:/ …
- WCF入門教程（三）屬性標籤
屬性標籤,成為定義協議的主要方式.先將最簡單的標籤進行簡單介紹,以瞭解他們的功能以及使用規則. 服務協定標識,標識哪些介面是服務協定,哪些操作時服務協定的一部分,以及傳輸物件的定義.如果已經有所瞭解, …