ECMA Script 6_簡單介紹

ECMAScript 6

ECMA 組織 前身是 歐洲計算機制造商協會

指定和發佈腳本語言規範，標準在每一年的 6 月份正式發佈一次，做爲當年的正式版本

這樣一來，就不須要之前的版本號了，只要用年份標記就能夠了.

ES6 ES6 既是一個歷史名詞，也是一個泛指「下一代 JavaScript 語言」，

含義是 5.1 版之後的 JavaScript 的下一代標準，涵蓋了 ES201五、ES201六、ES2017 等等，

而 ES2015 則是正式名稱，特指該年發佈的正式版本的語言標準

一種新的語法從提案到變成正式標準，須要經歷五個階段。每一個階段的變更都須要由 TC39 委員會批准。

Stage 0 - Strawman（展現階段）
Stage 1 - Proposal（徵求意見階段）
Stage 2 - Draft（草案階段）        到這一階段，差很少確定是要包裹在之後的標準裏面的
Stage 3 - Candidate（候選人階段）
Stage 4 - Finished（定案階段）

js 包含三個部分

• ECMAScript         新功能的開發，語法的簡化，性能優化

2009年發佈了 ES5.1，而且成爲 ISO 國際標準（ISO/IEC 16262:2011）

2015年6月 ES6       

還在實現中ing， 從開始 制定 到 最後 發佈，正式經過，成爲國際標準，整整用了 15 年

目標： 是使得 JavaScript 語言能夠用來編寫複雜的大型應用程序，成爲企業級開發語言

2016年ES7（變化不大，不少草案待實現）

2017年ES8

2018年ES9

擴展瀏覽器端

• BOM        window
• DOM        document

擴展服務器端

Node

Node 是 JavaScript 的服務器運行環境（runtime）。它對 ES6 的支持度更高。

除了那些默認打開的功能，還有一些語法功能已經實現了，可是默認沒有打開。

• 使用下面的命令，能夠查看 Node 已經實現的 ES6 特性

 $ node --v8-options | grep harmony

Babel 轉碼器

是一個普遍使用的 ES6 轉碼器，能夠將 ES6 代碼轉爲 ES5 代碼，從而在現有環境執行。

這意味着，你能夠用 ES6 的方式編寫程序，又不用擔憂現有環境是否支持。

好比

• // 轉碼前
  input.map(item => item + 1);
  
  // 轉碼後
  input.map(function (item) {
      return item + 1;
  });

  
  
• 'use strict';

嚴格模式，消除 js 語法的一些不合理、不嚴謹之處，減小一些怪異現象。

當瀏覽器識別，則進入嚴格模式解析運行。不識別的瀏覽器則忽略。

• 變量必須先聲明，在使用。
• 禁止自定義的函數中的 this 指向 window       

默認指向 window 時，this 被賦值爲 undefined

若是再函數中須要訪問 全局時，直接用 window 就好

• eval();    將會建立一個做用域，即不會影響全局同名變量
• 對象禁止出現同名屬性

• var person = {
      name: "Tom",
      age: 22,
      
      get age (){
          return this.age;
      },
      set age (newAge){
          this.age = newAge;
      }
  };

• JSON

是一種輕量級的數據格式。        '{"name":"Ryen Toretto", "age": 22}'    屬性名，必須雙引號包裹

用來 做爲先後臺交互的數據格式        （前臺發送請求，後臺返回響應）

• 使用

• var obj = {name: "Tom", age: 18};
  
  var arr = [1, 3, 5, 7];
  
  var json = JSON.stringify(obj);    // 對象 處理成 JSON 數據
  console.log(json);
  
  json = JSON.stringify(arr);    // 數組 處理成 JSON 數據
  console.log(json);
  
  
  // 解析 JSON
  var newArr = JSON.parse(json);
  console.log(newArr);

• ES6 新加入 Object.create(obj);

將傳入的新對象 做爲 新對象 的原型對象        // var newObj = {}; newObj.__proto__ = person; return newObj;

• 使用：

• var newObj = Object.create(person, {
      age:{
          value: 22
      },
      sex:{
          value: "男"
      }
  });

• ES6 對於數組的擴展

var arr = [1, 6 ,8, 6, 9, 8, 5, 3, 2];

• 輸出第一個 6 的下標索引

arr.findIndex(function(item){ item === 6; });            // 適用於 對象數據類型

等同於 arr.indexOf(6);      // 找不到返回 -1            適用於 基本數據類型

• 輸出最後一個 6 的下標索引

arr.lastIndexOf(6);

• 輸出元素全部元素的值和下標

arr.forEach(function(item, index){... ...});

• 將全部元素 值+10，產生並返回這個新數據

var newArr = arr.map(function(item, index){ return item+10; });        // 不影響原數組

• 過濾出 原數組 中值大於 4 的元素，做新數組返回

var newArr = arr.filter(function(item, index){ return item>4; });        // 不影響原數組, 將 返回值爲 true 的元素組成一個新數組

• 輸出 數組 各個元素的累加和

var sum = arr.reduce(function(prev, cur){ return prev+cur; }, 0);        // 從 左 開始迭代。 第二參數，是指第一次進入，prev 的值

var sum = arr.reduceRight(function(prev, cur){ return prev+cur; }, 0);        // 從 右 開始迭代