摘要：返回布爾值，表示參數(shù)字符串是否在源字符串的頭部。參考語法返回一個(gè)布爾值與的全等操作符比較兼容環(huán)境把對(duì)象的值復(fù)制到另一個(gè)對(duì)象里淺拷貝定義方法用于將所有可枚舉的屬性的值從一個(gè)或多個(gè)源對(duì)象復(fù)制到目標(biāo)對(duì)象。語法要設(shè)置其原型的對(duì)象。

一步一步似爪牙。

學(xué)習(xí)es6之前我們可能并不知道es6相比es5差距在哪, 但是這并不妨礙我們站在巨人的肩膀上; 程序員就是要樂于嘗鮮;
學(xué)習(xí)es6最終目的是結(jié)合es5 一起進(jìn)行工程項(xiàng)目開發(fā), 而不是完全拋棄es5 ;
學(xué)習(xí)的方法是文檔為主, 前人的blog為輔助, 實(shí)際console為最終標(biāo)準(zhǔn) ;
注意!號(hào)
留意TODO關(guān)鍵詞

http://mp.weixin.qq.com/s?__b...

let 語句聲明一個(gè)塊級(jí)作用域的本地變量，并且可選的將其初始化為一個(gè)值。

參考 : https://developer.mozilla.org...

if (true) {
    console.log(a) // 報(bào)錯(cuò) : Uncaught ReferenceError: a is not defined(…)
    let a = "js"
} 
// 這里也訪問不到 a

一個(gè)作用域不能重復(fù)聲明同一個(gè)值

if(true){
    var a = 1;
    if (true) {
        let a = "js" // a == "js"
    } 
    a = 3; // a == 3;
    let a = 2 ; // 報(bào)錯(cuò)Uncaught SyntaxError: Identifier "a" has already been declared ; 

    // 題外話, 在console中, 產(chǎn)生報(bào)錯(cuò)后a的內(nèi)存指引被清除, 可以重新賦值
    let a = 0; // a == 0
    // 但實(shí)際開發(fā)中, 產(chǎn)生報(bào)錯(cuò), 后面的代碼不再執(zhí)行, 所以不會(huì)有這種情況產(chǎn)生
}

const 語句聲明一個(gè)塊級(jí)作用域的本地常量, 必須有值且不能為null, 不能再更改(僅可讀)。

參考 : https://developer.mozilla.org...

const a = 1;
a = 2; // 報(bào)錯(cuò) : Uncaught TypeError: Assignment to constant variable.(…)

const聲明的數(shù)組, 對(duì)象, 還可以進(jìn)行增改查, 但是不能重新定義

const a = [];
    a.push(2)   // a == [2]

const b = {};
    b.a = a ;   // 包含了a數(shù)組的對(duì)象

只在聲明的作用域有效(與let一樣)

if(true){
    const c = 1;
} 
// 此處訪問會(huì)報(bào)錯(cuò):   Uncaught ReferenceError: c is not defined(…)

總結(jié): 可以把const理解為let的常量版(不可改的let)

參考:

http://www.cnblogs.com/weiwei...

https://developer.mozilla.org...

數(shù)組的新語法

let [a, b, c] = [1, 2, 3];
// 即: let a = 1;let b = 2;let c = 3;

let [bar, foo] = [1];
// 解構(gòu)失敗: undefined
// 即: let bar = 1; let foo = undefined

let [a] = 1;
// 等號(hào)的右邊不是數(shù)組 (或者嚴(yán)格地說，不是可遍歷的解構(gòu))
// 報(bào)錯(cuò)：VM2799:2 Uncaught TypeError: undefined is not a function(…)

// 如果賦值的字面量全等undefined, 則默認(rèn)值生效
let [x = 1] = [undefined];// x  === 1
let [x = 1] = [];//x  ===  1

// null 不全等 undefined, 所以默認(rèn)值不生效
let [x = 1] = [null];// x  === null

進(jìn)階語法

// 解構(gòu)賦值允許指定默認(rèn)值。
let [foo = true] = []; // 即: foo === true

坑!小心

function f() {
  console.log("aaa");
}
let [x = f()] = [1];// x === 1
// 此處f函數(shù)并沒有執(zhí)行; 如果是es5, 在賦值過程中, 肯定會(huì)先執(zhí)行f()方法: log("aaa")
// es6 沒有執(zhí)行f方法, 經(jīng)過粗略查閱文檔, 百谷后, 并沒有得到答案; 生命有限, 留待日后, TODO
// 在與`MeatHill`老師交流過后,得知 , 在此處后面有具體的值，就不需要計(jì)算默認(rèn)值, 賦值是從右往左運(yùn)行

奇奇怪怪的, 我猜可能會(huì)出面試題

let [x = 1, y = x] = [];   // x == 1; y == 1; 
 
let [x = 1, y = x] = [2];  // x == 2; y == 2; 別急, 一步一步來
// 第一步: x = 2(賦值從右到左, x = 1 不會(huì)計(jì)算);
// 第二步: y = x = 2;

let [x = 1, y = x] = [1, 2]; // 答案呢? 留著想

let [x = y, y = 1] = [];  
// 第一步  x = y ; y未聲明報(bào)錯(cuò)

對(duì)象的解構(gòu)與數(shù)組有一個(gè)重要的不同。數(shù)組的元素是按次序排列的，變量的取值由它的位置決定；而對(duì)象的屬性沒有次序，變量必須與屬性同名，才能取到正確的值。

語法

let { foo, bar } = { foo: "aaa", bar: "bbb" }; 
// 變量必須與屬性重名
// 以上其實(shí)是 let { foo : foo, bar : bar } = { foo: "aaa", bar: "bbb" };的簡寫;  
// 對(duì)象的解構(gòu)賦值的內(nèi)部機(jī)制，是先找到同名屬性，然后再賦給對(duì)應(yīng)的變量。真正被賦值的是后者，而不是前者
// foo === "aaa"; bar === "bbb"


let {foo} = {bar: "baz"}; 
// foo === undefined


let arr = [1, 2, 3];
let {0 : first, [arr.length - 1] : last} = arr;
// 數(shù)值也屬于對(duì)象的一種表現(xiàn)形式

默認(rèn)值

let {x = 3} = {x: undefined};
// x === 3
// 默認(rèn)值生效的條件是，對(duì)象的屬性值嚴(yán)格等于undefined。

注意

let { foo: baz } = { foo: "aaa", bar: "bbb" };
// 上面代碼中，foo是匹配的模式，baz才是變量。真正被賦值的是變量baz，而不是模式foo。

高階(解析嵌套結(jié)構(gòu))

let obj = {
  p: [
    "Hello",
    { y: "World" }
  ]
};
let { p: [x, { y }] } = obj
// 注意，這時(shí)p是模式，不是變量，因此不會(huì)被賦值。

疑難雜癥

let {foo: {bar}} = {baz: "baz"};
// 報(bào)錯(cuò) : VM3721:2 Uncaught TypeError: Cannot match against "undefined" or "null".(…)
// 報(bào)錯(cuò) : 等號(hào)左邊對(duì)象的foo屬性，對(duì)應(yīng)一個(gè)子對(duì)象。該子對(duì)象的bar屬性，解構(gòu)時(shí)會(huì)報(bào)錯(cuò)。原因很簡單，因?yàn)閒oo這時(shí)等于undefined，再取子屬性就會(huì)報(bào)錯(cuò)

let x;
{x} = {x: 1};
// 報(bào)錯(cuò): 因?yàn)镴avaScript引擎會(huì)將{x}理解成一個(gè)代碼塊，從而發(fā)生語法錯(cuò)誤。
// 應(yīng)該不將大括號(hào)寫在行首，避免JavaScript將其解釋為代碼塊, 正確的寫法:
let x;
({x} = {x: 1})

// 第三個(gè)參數(shù)默認(rèn)值為 {}
function demo(a, b, {c , d} = {}){
    console.log(a, b, c, d)
    // 1  2 "c" "d"
}
demo(1, 2, {c : "c", d:"d"})

let [a, b, c, d, e] = "hello"
// a === "h", b === "e", ......

let {length} = "hello";
// length === 5
// 類似數(shù)組的對(duì)象都有一個(gè)length屬性，因此還可以對(duì)這個(gè)屬性解構(gòu)賦值

小總結(jié)

數(shù)組的解構(gòu)賦值對(duì)應(yīng)的是位置

// 所以可以交換變量的值
let x = 1;
let y = 2;
[x, y] = [y, x];

對(duì)象對(duì)應(yīng)的是鍵名

解構(gòu)的意義

數(shù)組結(jié)構(gòu)可以方便快速的交換變量的值

接受函數(shù)return的值, 如果函數(shù)返回array或者object, 利用解構(gòu)方便快捷

解析JSON數(shù)據(jù)

代替 ||

參考

https://developer.mozilla.org...

http://www.webfront-js.com/ar...

概念

${} 關(guān)鍵詞

反引號(hào)包裹字符串

語法

let name = "Bob", 
    time = "today";
console.log(`Hello ${name}, how are you ${time}?`)
// 模板字符串都是用反引號(hào)表示，如果在模板字符串中需要使用反引號(hào)，則前面需要用反斜杠轉(zhuǎn)義

多行字符串

console.log(`string text line 1
string text line 2`);
// "string text line 1
// string text line 2"

參考

https://developer.mozilla.org...

function a(b, ...c){
    console.log(b)
    // ["我的年齡是", ",我的性別是", "", raw: Array[3]]

    console.log(c)
    // Array : ["1", "nan"]
}
let d = "1";
a`我的年齡是$6a22guqa,我的性別是${f}`

在標(biāo)簽函數(shù)的第一個(gè)參數(shù)中，存在一個(gè)特殊的屬性raw ，我們可以通過它來訪問模板字符串的原始字符串

傳統(tǒng)上，JavaScript只有indexOf方法，可以用來確定一個(gè)字符串是否包含在另一個(gè)字符串中。ES6又為String對(duì)象擴(kuò)展了三種新方法。

參考

includes : https://developer.mozilla.org...

startsWith : https://developer.mozilla.org...

endsWith : https://developer.mozilla.org...

includes()：返回布爾值，表示是否找到了參數(shù)字符串。

"Blue Whale".includes("blue"); // return false
"Blue Whale".includes("Whale" , 2); // return true

startsWith()：返回布爾值，表示參數(shù)字符串是否在源字符串的頭部。

"Blue Whale".startsWith("blue"); // return false
"Blue Whale".startsWith("Whale" , 2); // return false
"Blue Whale".startsWith("Whale" , 5); // return true

endsWith()：返回布爾值，表示參數(shù)字符串是否在源字符串的尾部。

"Blue Whale".endsWith("blue"); // return false
"Blue Whale".endsWith("Whale" , 10); // return true
"0Blue".endsWith("Blue" , 5); // return true

以前es5 : 
function makeRequest(url, timeout, callback) {
    timeout = timeout || 2000;
    callback = callback || function() {};
    // ...
}

現(xiàn)在es6 :
function makeRequest(url, timeout = 2000, callback = function(){}) {
    // ...
}

如果不傳入?yún)?shù), 或者傳入undefined, 則使用默認(rèn)值;

參考:

https://developer.mozilla.org...

console.log(...[1, 2, 3])
// 1 2 3

console.log(1, ...[2, 3, 4], 5);
// 1 2 3 4 5

function func(x, y, z, a, b) {
    console.log(x, y, z, a, b);
}
var args = [1, 2];
func(0, ...args, 3, ...[4]); // 0 1 2 3 4

// es5使用數(shù)組作為參數(shù):
function myFunction(x, y, z) { }
var args = [0, 1, 2];
myFunction.apply(null, args);

// es6使用數(shù)組作為參數(shù):
function demo(x, y, z) { 
    console.log(x, y, z)
}
var args = [0, 1, 2];
demo(...args); 

let arr = [1, 2, 3];
let arr2 = [...arr]; // 就像是 arr.slice()

arr2.push(4); 

console.log(arr2) // [1, 2, 3, 4]
// arr 不受影響

var arr1 = [0, 1, 2];
var arr2 = [3, 4, 5];
var arr3 = [...arr1  , ...arr2]
// arr3 : [0, 1, 2, 3, 4, 5]

var nodeList = document.querySelectorAll("div");
var array = [...nodeList];
// 實(shí)際: 360瀏覽器報(bào)錯(cuò) : VM2386:3 Uncaught TypeError: nodeList[Symbol.iterator] is not a function(…)
// 版本: 8.7.0.306

// 火狐為一個(gè)空數(shù)組
// 版本:26.0.0.137

// google為undefined
// 版本:57.0.2987.133

參考

https://developer.mozilla.org...

https://developer.mozilla.org...

剩余參數(shù)只包含那些沒有對(duì)應(yīng)形參的實(shí)參

function(a, b, ...restArgs) {
  // ...restArgs 即為剩余參數(shù), 是一個(gè)Array對(duì)象
}

剩余參數(shù)只包含那些沒有對(duì)應(yīng)形參的實(shí)參，而 arguments 對(duì)象包含了傳給函數(shù)的所有實(shí)參。

arguments 對(duì)象不是一個(gè)真實(shí)的數(shù)組,而剩余參數(shù)是真實(shí)的 Array實(shí)例，也就是說你能夠在它上面直接使用所有的數(shù)組方法，比如 sort，map，forEach，pop。

arguments 對(duì)象對(duì)象還有一些附加的屬性 (比如callee屬性)。

function fun1(...theArgs) {
  alert(theArgs.length);
}
 
fun1();  // 彈出 "0", 因?yàn)閠heArgs沒有元素
fun1(5); // 彈出 "1", 因?yàn)閠heArgs只有一個(gè)元素
fun1(5, 6, 7); // 彈出 "3", 因?yàn)閠heArgs有三個(gè)元素

// TODO

函數(shù)的name屬性，返回該函數(shù)的函數(shù)名。
這個(gè)屬性早就被瀏覽器廣泛支持，但是直到 ES6 ，才將其寫入了標(biāo)準(zhǔn)。

function foo() {}  
foo.name // "foo"  

并不完全支持的ES6(360瀏覽器環(huán)境)

var a = function(){}
a.name
// 空字符串: "" 

let b = function(){}
b.name
// 同樣是 ""

解讀:
ES6 對(duì)這個(gè)屬性的行為做出了一些修改。如果將一個(gè)匿名函數(shù)賦值給一個(gè)變量， ES5 的name屬性，會(huì)返回空字符串，而 ES6 的name屬性會(huì)返回實(shí)際的函數(shù)名。

但實(shí)際上國內(nèi)目前主流瀏覽器支持的還是es5為主, 在node下搭建的es6環(huán)境, 才會(huì)返回實(shí)際的函數(shù)名(Google測試已經(jīng)支持)

函數(shù)名的優(yōu)先級(jí)

let a = function d(demo){}
a.name // "d"

重點(diǎn):
!箭頭函數(shù)會(huì)捕獲其所在上下文的 this 值，作為自己的 this 值
!也就是可以理解為: 箭頭函數(shù)沒有自己的this, 如果上下文沒有this, 則this指向Window對(duì)象

參考

ES6-this[MDN} : https://developer.mozilla.org...

什么時(shí)候不該使用箭頭函數(shù):https://segmentfault.com/a/11...

基礎(chǔ)語法

let demoFun = oArgument => oDessert
// demoFun 為函數(shù)名
// oArgument 為函數(shù)形參
// oDessert 為返回的值


let func = (x, y) => { return x + y; }; 
//常規(guī)編寫 明確的返回值

高級(jí)語法

let demoFun = (oArgument, drink) => oArgument + drink
// 返回的是 oArgument + drink

let demoFun = params => ({foo: bar})
//返回一個(gè)對(duì)象時(shí)，函數(shù)體外要加圓括號(hào)

let demoFun = (param1, param2, ...rest) => { statements }
// 支持 剩余參數(shù)和默認(rèn)參數(shù):

不綁定 this

箭頭函數(shù)會(huì)捕獲其所在上下文的 this 值，作為自己的 this 值，因此下面的代碼將如期運(yùn)行。

function Person() {  
    this.age = 0;  
    setInterval(() => {
        // 回調(diào)里面的 `this` 變量就指向了期望的那個(gè)對(duì)象了
        this.age++;
    }, 3000);
}
var p = new Person();

箭頭函數(shù)沒有自己的 arguments

var arr = () => arguments;
arr();  // Uncaught ReferenceError: arguments is not defined(…)

箭頭函數(shù)不能用作構(gòu)造器，和 new 一起用就會(huì)拋出錯(cuò)誤。

var Foo = () => {};
var foo = new Foo();  // TypeError: Foo is not a constructor

箭頭函數(shù)沒有原型屬性。

var Foo = () => {};
console.log(Foo.prototype); // undefined

箭頭不是操作符

在箭頭函數(shù)中的箭頭不是操作符(或者運(yùn)算符,就像"+ -"那些)， 但是箭頭函數(shù)有特殊的解析規(guī)則就是：相比普通的函數(shù)，受操作符的優(yōu)先級(jí)影響。參考: https://developer.mozilla.org...

let callback;
callback = callback || function() {}; // ok
callback = callback || () => {};      // SyntaxError:非法箭頭函數(shù)屬性
callback = callback || (() => {});    // ok

像方法一樣使用箭頭函數(shù)

"use strict";
let obj = {
  i: 10,
  b: () => console.log(this.i, this),
  c: function() {
    console.log( this.i, this)
  }
}
obj.b(); // undefined, Window對(duì)象, 此處或許有疑問, 可翻閱?提過的`!`
obj.c(); // 10, Object {...}

不能返回預(yù)期的對(duì)象

let func = () => {  foo: 1  };
// undefined

所以，記得用圓括號(hào)把文字表達(dá)式包起來：

var func = () => ({ foo: 1 });

箭頭u函數(shù)在某些情況加還是很有便利的, 但是新的語法, 可讀性有所轉(zhuǎn)變, 要多使用, 多看才行

// TODO

參考:
https://developer.mozilla.org...

// TODO

Object.is() 方法確定兩個(gè)值是否是 相同的值。

參考:

https://developer.mozilla.org...

Object.is(value1, value2); // 返回一個(gè)布爾值

ES6:

Object.is(NaN, NaN); // true

Object.is(0, -0); // fasle
Object.is(-0, +0) // false

Object.is({},{})  // false

var a = function () {};
var b = function () {};
Object.is(a, b) //false

ES5

NaN === NaN // false;

0 === -0 // true
-0 === +0 // true

{} === {} // false

var a = function () {};
var b = function () {};
a === b //false

if (!Object.is) {
  Object.is = function(x, y) {
    // SameValue algorithm
    if (x === y) { // Steps 1-5, 7-10
      // Steps 6.b-6.e: +0 != -0
      return x !== 0 || 1 / x === 1 / y;
    } else {
      // Step 6.a: NaN == NaN
      return x !== x && y !== y;
    }
  };
}

Object.assign() 方法用于將所有可枚舉的屬性的值從一個(gè)或多個(gè)源對(duì)象復(fù)制到目標(biāo)對(duì)象。它將返回目標(biāo)對(duì)象。

// target目標(biāo)對(duì)象。
// sources(多個(gè))源對(duì)象。
Object.assign(target, ...sources)

var obj = { a: 1 };
var copy = Object.assign({}, obj); // {a: 1}

var o1 = { a: 1 };
var o2 = { b: 2 };
var o3 = { c: 3 };
var obj = Object.assign({},o1, o2, o3); // Object {a: 1, b: 2, c: 3}

繼承屬性和不可枚舉屬性是不能拷貝的

原始類型會(huì)被包裝為 object

var v1 = "abc";
var v2 = true;
var v3 = 10;
var v4 = Symbol("foo")

var obj = Object.assign({}, v1, null, v2, undefined, v3, v4); 
// 原始類型會(huì)被包裝，null 和 undefined 會(huì)被忽略。
// 注意，只有字符串的包裝對(duì)象才可能有自身可枚舉屬性。
console.log(obj); // { "0": "a", "1": "b", "2": "c" }

異常會(huì)打斷接下來的拷貝任務(wù)

參考:

https://developer.mozilla.org...

Object.setPrototypeOf() 方法設(shè)置一個(gè)指定的對(duì)象的原型 ( 即, 內(nèi)部[[Prototype]]屬性）到另一個(gè)對(duì)象或 null。

Object.setPrototypeOf(obj, prototype)
// obj          要設(shè)置其原型的對(duì)象。.
// prototype    該對(duì)象的新原型(一個(gè)對(duì)象 或 null).

var dict = Object.setPrototypeOf({}, null); // Object {}

參考

https://developer.mozilla.org...

es6 可以設(shè)置對(duì)象的__proto__

參考: 
https://developer.mozilla.org...

super 關(guān)鍵字用于調(diào)用一個(gè)對(duì)象的父對(duì)象上的函數(shù)。

參考:

MDN -迭代器&生成器 : https://developer.mozilla.org...

ES6學(xué)習(xí)——迭代器（Iterators）：迭代器接口高級(jí)應(yīng)用 - Challenge Next Challenge - CSDN博客

http://blog.csdn.net/kittyjie...

sf - [譯]迭代器指南 : https://segmentfault.com/a/11...

參考:

MDN -迭代器&生成器 : https://developer.mozilla.org...

JavaScript 現(xiàn)有的基于原型的繼承的語法糖, 提供了一個(gè)更簡單和更清晰的語法來創(chuàng)建對(duì)象并處理繼承。

類實(shí)際上是個(gè)“特殊的函數(shù)”，就像你能夠定義的函數(shù)表達(dá)式和函數(shù)聲明一樣，類語法有兩個(gè)組成部分：類表達(dá)式和類聲明。

參考:

sf - ES6探秘 : https://segmentfault.com/a/11...

使用class關(guān)鍵字聲明類

// 聲明一個(gè)類名為 Rectangle  的JS類
// constructor方法用于創(chuàng)建和初始化使用一個(gè)類創(chuàng)建的一個(gè)對(duì)象。只允許存在一個(gè)
class Rectangle {
  constructor(height, width) {
    this.height = height;
    this.width = width;
  }
}

類聲明不會(huì)聲明提升

類表達(dá)式可以是被命名的或匿名的。

/* 匿名類 */ 
let Rectangle = class {
  constructor(height, width) {
    this.height = height;
    this.width = width;
  }
};

/* 命名的類 */ 
let Rectangle = class Rectangle {
  constructor(height, width) {
    this.height = height;
    this.width = width;
  }
};

如果沒有指定this, this值將為undefined。

class Animal { 
  speak() {
    return this;
  }
  static eat() {
    return this;
  }
}

let obj = new Animal();
let speak = obj.speak;
speak(); // undefined

let eat = Animal.eat;
eat(); // undefined

"use strict"
// 創(chuàng)建一個(gè) Chef 類
class Chef {
    // 初始化
    // 接收參數(shù)
    constructor(food){
        this.food = food;
    }

    cook(){
        console.log(this.food)
    }

}
let qing = new Chef("?")
qing.cook(); // ?

參考:
http://blog.csdn.net/qq_30100...

"use strict"
// 創(chuàng)建一個(gè) Chef 類
class Chef {
    // 初始化
    // 接收參數(shù)
    constructor(food){
        this.food = food;
        this.dishs = [];
    }

    get menu(){
        return this.dishs;
    }

    set menu(dishs){
        this.dishs.push(dish)
    }

    cook(){
        console.log(this.food)
    }

}
let qing = new Chef()
console.log(qing.menu = "?") //?
console.log(qing.menu = "?") // ?

"use strict"
// 創(chuàng)建一個(gè) Chef 類
class Chef {
    // 初始化
    // 接收參數(shù)
    constructor(food){
        this.food = food;
        this.dishs = [];
    }

    get menu(){
        return this.dishs;
    }

    set menu(dishs){
        this.dishs.push(dish)
    }

    static cook(food){
        console.log(food)
    }

}

// 不需要實(shí)例化Chef即可以直接使用
Chef.cook("?") 
// 輸出 : ?

"use strict"
class Person{
    constructor(name, birthday){
        this.name = name
        this.birthday = birthday
    }

    intro(){
        return `${this.name}, ${this.birthday}`
    }
}

// 使得Chef類 繼承 Person類
class Chef extends Person{
    constructor(name, birthday){
        // 調(diào)用父類的constructor函數(shù) 
        super(name, birthday)
    }
}

let qing = new Chef("qing", "1949-10-1");

// 實(shí)例化后才可使用 Chef類 的intro方法
qing.intro() // "qing, 1949-10-1"

參考:

MDN - https://developer.mozilla.org...

Set 對(duì)象允許你存儲(chǔ)任何類型的唯一值，無論是原始值或者是對(duì)象引用。

new Set([iterable]);
// iterable 
// 如果傳遞一個(gè)可迭代對(duì)象，它的所有元素將被添加到新的 Set中。
// 如果不指定此參數(shù)或其值為null，則新的 Set為空

// 返回值
// 一個(gè)新的Set對(duì)象。

DEMO:

使用Set對(duì)象

let mySet = new Set();

mySet.add(1); // {1}
mySet.add(5); // {1, 5}
mySet.add("some text"); //{1, 5, "some text"}

mySet.has(1); // true
mySet.has(3); // false
mySet.has(5); // true
mySet.has(Math.sqrt(25));  // true
mySet.has("Some Text".toLowerCase()); // true

mySet.size; // 返回Set對(duì)象的值的個(gè)數(shù) ： 3

mySet.delete(5); //  從set中移除5并返回true
mySet.delete(8); //  不存在8, 返回false
mySet.has(5);    // false, 5已經(jīng)被移除

mySet.size; // 2, 我們剛剛移除了一個(gè)值

// 按照插入順序，為Set對(duì)象中的每一個(gè)值調(diào)用一次callBackFn。如果提供了thisArg參數(shù)，回調(diào)中的this會(huì)是這個(gè)參數(shù)。
mySet.forEach(callbackFn[, thisArg])

// 與values()方法相同，返回一個(gè)新的迭代器對(duì)象，該對(duì)象包含Set對(duì)象中的按插入順序排列的所有元素的值。
mySet.keys()

// 返回一個(gè)新的迭代器對(duì)象，該對(duì)象包含Set對(duì)象中的按插入順序排列的所有元素的值。
mySet.values()


mySet.clear() // 清空全部值

var myArray = ["value1", "value2", "value3"];

// 用Set構(gòu)造器將Array轉(zhuǎn)換為Set
var mySet = new Set(myArray);

mySet.has("value1"); // returns true

// 用...(展開操作符)操作符將Set轉(zhuǎn)換為Array
console.log([...mySet]); // 與myArray完全一致

參考:
https://developer.mozilla.org...

Map 對(duì)象保存鍵值對(duì)。任何值(對(duì)象或者原始值) 都可以作為一個(gè)鍵或一個(gè)值。

var myMap = new Map();
 
var keyObj = {},
    keyFunc = function () {},
    keyString = "a string";
 
// 添加鍵
myMap.set(keyString, "和鍵"a string"關(guān)聯(lián)的值");
myMap.set(keyObj, "和鍵keyObj關(guān)聯(lián)的值");
myMap.set(keyFunc, "和鍵keyFunc關(guān)聯(lián)的值");
 
myMap.size; // 3
 
// 讀取值
myMap.get(keyString);    // "和鍵"a string"關(guān)聯(lián)的值"
myMap.get(keyObj);       // "和鍵keyObj關(guān)聯(lián)的值"
myMap.get(keyFunc);      // "和鍵keyFunc關(guān)聯(lián)的值"
 
myMap.get("a string");   // "和鍵"a string"關(guān)聯(lián)的值"
                         // 因?yàn)閗eyString === "a string"
myMap.get({});           // undefined, 因?yàn)閗eyObj !== {}
myMap.get(function() {}) // undefined, 因?yàn)閗eyFunc !== function () {}

Map 認(rèn)為 NaN === NaN

var myMap = new Map();
myMap.set(NaN, "not a number");
myMap.get(NaN); // "not a number"

Map可以獲得length, Object不可以

Map的鍵可以是任意字, Object的只能為字符串, 或者變量

Map 認(rèn)為 NaN === NaN

Map內(nèi)置很多迭代, 查詢, 操作方法

花了半天時(shí)間學(xué)習(xí)了下ES6的部分新語法丶新特性。 不求精通, 但說涉獵。不實(shí)踐怎么來的發(fā)言權(quán) ;

ES6新增了很多方法和功能參數(shù), 但是其實(shí)相對(duì)于ES5來, 變革性并不是那么大, 學(xué)起來興趣乏乏, 有點(diǎn)像雞肋;

ES6中我最感興趣的是Promise , Class, 期待ES8的異步函數(shù)（Async Functions） ;

項(xiàng)目中打算深入實(shí)踐ES6, 畢竟這波不虧 ? ;

原文地址: https://segmentfault.com/a/11...
轉(zhuǎn)載無需聯(lián)系, 但請(qǐng)著名來源 @SF.GG-Starch。程序員就是要敢于, 樂于嘗鮮;