ES6是什麼？和js有什麼區別？

ES時ESMAScript的簡稱，

JS由三部分組成，ESMAScript,BOM,DOM,

ES是JS中的語法規範；

BOM全稱Browser Object Model，瀏覽器物件模型，主要處理瀏覽器視窗和框架,提供了獨立於內容而與瀏覽器進行互動的物件。

DOM全稱Document Object Model，文件物件模型，是HTML和XML文件的程式設計介面;它提供了對文件的結構化的表述,並定義了一種方式可以使從程式中對該結構進行訪問,從而改變文件的結構,樣式和內容。

let、const和var的區別

let 定義的變數只在let所在的程式碼塊中有效，有塊級作用域 值可更改

cosnt 表示定義一個只讀的變數 無法被更改 （物件之類的取址賦值可以被更改）

var 是普通的定義變數的關鍵字

瀏覽器相容ES6

安裝node,用npm安裝babel

npm install babel-core@5

引用babel

我們把browser.min.js引入（檔案位置的路徑要確保正確）。並且設定第二個script標籤的type為”text/babel”。

解構賦值

ES6允許按照一定模式，從陣列和物件中提取值，對變數進行賦值，這被稱為解構賦值（Destructuring）。

傳統的變數賦值

var arr = [1,2,3]

var a = arr[0]

var b = arr[1]

var c = arr[2]

ES6解構賦值

var [a,b,c] = [1,2,3]

陣列的解構賦值

解構賦值是可以巢狀的

var [a,b,[c1,c2]] = [1,2,[3.1,3.2]]

var [a,b,c] = [1,2]

當左邊的模式（你可以理解為格式）與右邊不完全一樣的時候，那麼賦值過程中，只會給模式匹配成功的部分的變數賦值，例如：變數c沒有在右邊找到匹配的模式，所以無法進行賦值，但這並不影響變數a和變數b的賦值，因為它們在右邊找到與之匹配的模式，這種叫做不完全解構。

允許設定預設值

var [a,b,c=3] = [1,2]

var [a,b,c=3] = [1,2,4]

這個時候預設值3會被新的值4覆蓋，c的值為4；注意：當新的值為undefined的時候，是不會覆蓋預設值的。

物件的解構賦值

var {a,b,c} = {"a":1,"b":2,"c":3}

var {a,b,c} = {"a":1,"c":3,"b":2}

這兩段程式碼雖然有區別，但是結果都是一樣的。

物件的解構賦值不會受到屬性的排列次序影響（陣列則會受影響），它是跟屬性名關聯起來的，變數名要和屬性名一致，才會成功賦值。

var{ a } = {"b":2}

如果變數找不到與其名字相同的屬性，就會賦值不成功

如果你想給一個變數名與屬性名不一樣的變數解構賦值，可以這樣寫：

var { b:a } = { "b" : 2}

這樣變數a同樣可以賦值成功，a的值最終為2

物件的解構賦值也可以巢狀

var { a:{ b } } = { "a" : { "b":1 } }

b的值為1

也可以指定預設值

var { a,b = 2 } = { "a" : 1}

b的值為2

字串的解構賦值

var [a,b,c,d,e,f] = "我就是前端君"

a = 我

b = 就

c = 是

d = 前

e = 端

f = 君被轉成了類似陣列的物件

在解構賦值的過程中，將字串

解構賦值的作用

1.交換變數的值

傳統做法最常用的是引入第三個變數來臨時存放

例：

var x = 1;

var y = 2;

var z = x;

x = y;

y = z;

解構賦值

var x = 1

var y = 2

[ x , y ] = [ y , x ]