es6常用知識點總結

常常會用到的es6的知識點

提到es6我們就來說說javascript，es6也是ES2015

1. #1995：JavaScript誕生，它的初始名叫LiveScript。

2. 1997：ECMAScript標準確立。

3. 1999：ES3出現，同時IE5風靡一時。

4. 2000–2005： XMLHttpRequest又稱為AJAX， 在Outlook Web Access (2000)、Oddpost (2002)，Gmail (2004)和Google Maps (2005)大受重複使用。

5. 2009：ES5 出現，（就是我們大多數人現在使用的）例如foreach，Object.keys，Object.create和JSON標準。

6. 2015：ES6/ECMAScript2015出現。 2015 年，負責制定 ECMAScript 規範草案的委員會 TC39 決定將定義新標準的製度改為一年一次

7. 2016：ES7/ECMAScript2016出現。

8. 2017：ES8/ECMAScript2017出現。

說到es6就會想到相容，我推薦給大家兩個連結大家可以去看看，還是很好的

https:// kangax.github.io/compat-table/es6/

#http://kangax.github.io/compat-table/es2016plus/

es6的使用方式

可以將es6的程式碼轉換成es5的程式碼,Babel Google traceur這是兩個轉碼器，大家可以去試試

Babel是一個廣泛使用的ES6轉碼器，可以將ES6程式碼轉為ES5程式碼，從而在現有環境執行。大家可以選擇自己習慣的工具來使用使用Babel

js中var、let、const的差別

var！ ！ ！ ！

var定義的變數可以修改，如果不初始化會輸出undefined，不會報錯

var分為兩種：局部作用域和函數作用域

#let！ ！ ！ ！

let是區塊層級作用域，函數內部使用let定義後，對函數外部無影響。

let是區塊級作用域，跟var不同的是，let沒有前置功能，不能重複宣告

const！ ！ ！ ！

const定義的變數不可以修改，而且必須初始化。

const是常數，不可改變，一般大寫，也是區塊級作用域。 。 。

es6模板字串、增強的物件字面、解構賦值

es6模板字串

模板字串是允許嵌入表達式的字串字面量。你可以使用多行字串和字串插值功能。它們在ES2015規範的先前版本中稱為「模板字串。

1. ``撇號

2. ##綁定變數

3. 字串支援多行

4. ...擴充運算子

1. 字面量物件方法可以簡寫省去function關鍵字

2. 物件屬性可以寫自動計算的屬性

3. 繼承——port——
解構賦值

#

var [foo, [[bar], baz]] = [1, [[2], 3]];console.log(foo);// 1console.log(bar);// 2console.log(baz);// 3

登入後複製

可以在對應位元留空來跳過被解構數組中的某些元素：

var [,,third] = ["foo", "bar", "baz"];console.log(third);// "baz"

登入後複製

#展開陣列

陣列的拷貝
陣列的合併
展開函數的呼叫
4. 箭頭函數

   //箭头函数 =>let jian = () => {console.log("Hello")}jian();//没有参数()=>{console.log("你好")};//有参数(name)=>{console.log(name);};//可以省略()let d = name=>{console.log(name);}d('jiang');//两个参数(name,age)=>{console.log(name,age);};//省略后的let c (a,b)=>a+b;(a,b)=>{console.log(a+b);console.log(c);

   登入後複製

預設參數

擴充參數
剩餘參數
3. #Symbol
   Symbol是ES6新增的一種值類型數據，表示一種絕不重複的值

let m = 1;let l = 1;console.log(m==l);//打印出truelet mm = Symbol();let ll = Symbol();console.log(mm==ll);//打印出flase

注意，這裡Symbol 前面不能使用new 操作符。 .getOwnPropertySymbols(o)。資料結構是ES6新增。

它與陣列非常相似，但是Set資料結構的成員都是唯一的。

// Setsvar s = new Set();s.add("hello").add("goodbye").add("hello");s.size === 2;s.has("hello") === true;// Weak Setsvar ws = new WeakSet();ws.add({ data: 42 });

登入後複製

类似于 WeakMap，WeakSet 对象可以让你在一个集合中保存对象的弱引用，在 WeakSet 中的对象只允许出现一次：

var ws = new WeakSet();var obj = {};var foo = {};ws.add(window);ws.add(obj);ws.has(window); // truews.has(foo);    // false, foo 没有添加成功ws.delete(window); // 从结合中删除 window 对象ws.has(window);    // false, window 对象已经被删除

Map和WeakMap

Map和WeakMap是ES6新增的数据结构 事实上每个对象都可以看作是一个 Map。 它们本质与对象一样，都是键值对的集合，但是他们与Object对象主要的不同是，键可以是各种类型的数值，而Object对象的键只能是字符串类型或者Symbol类型值 。Map和WeakMap是更为完善的Hash结构。

// Mapsvar m = new Map();m.set("hello", 42);m.set(s, 34);m.get(s) == 34;// Weak Mapsvar wm = new WeakMap();wm.set(s, { extra: 42 });wm.size === undefined

WeakMap数据结构 WeakMap结构与Map结构基本类似。 区别是它只接受对象作为键名，不接受其他类型的值作为键名。键名是对象的弱引用，当对象被回收后，WeakMap自动移除对应的键值对，WeakMap结构有助于防止内存泄漏。

var wm = new WeakMap(); var obj = new Object(); wm.set(obj,'对象1'); obj=null; wm.get(obj);    //undefined wm.has(obj);    //false