《ES6深入淺出》學習筆記 三

2021-07-25 00:27:26 字數 1485 閱讀 5750

解構 destructuring

通常來說，你很可能這樣訪問陣列中的前三個元素：

var first = somearray[0];


var second = somearray[1];


var third = somearray[2];
如果使用解構賦值的特性，將會使等效的**變得更加簡潔並且可讀性更高：

陣列與迭代器的解構

以上是陣列解構賦值的乙個簡單示例，其語法的一般形式為：

[ variable1, variable2, ..., variablen ] = array;
這將為variable1到variablen的變數賦予陣列中相應元素項的值。如果你想在賦值的同時宣告變數，可在賦值語句前加入var、let或const關鍵字，例如：

var [ variable1, variable2, ..., variablen ] = array;


let [ variable1, variable2, ..., variablen ] = array;


const [ variable1, variable2, ..., variablen ] = array;
事實上，用變數來描述並不恰當，因為你可以對任意深度的巢狀陣列進行解構：

var [foo, [[bar], baz]] = [1, [[2], 3]];


console.log(foo);


// 1


console.log(bar);


// 2


console.log(baz);


// 3
此外，你可以在對應位留空來跳過被解構陣列中的某些元素：

var [,,third] = ["foo", "bar", "baz"];


console.log(third);


// "baz"
而且你還可以通過「不定引數」模式捕獲陣列中的所有尾隨元素：

var [head, ...tail] = [1, 2, 3, 4];


console.log(tail);


// [2, 3, 4]
當訪問空陣列或越界訪問陣列時，對其解構與對其索引的行為一致，最終得到的結果都是：unde console.log([0]);

// undefined

var [missing] = ;

console.log(missing);

// undefined，陣列解構賦值的模式同樣適用於任意迭代器：

function* fibs


()     }


var [first, second, third, fourth, fifth, sixth] = fibs();


console.log(sixth);


// 5

ES6深入淺出 Generator

一步，一步前進 一步 es6深入淺出之generator生成器。本人對生成器的印象是語法難以理解，又沒有什麼實際的應用場景。為啥要學習一下呢?可能未來某些高階的業務會用到，還有萬一面試官問的話，我得能侃幾句，顯得我牛。定義generator 是為非同步而生，正常的函式是一進入就必須執行完成的，而 g...

深入淺出es6（箭頭函式）

是function的簡寫形式，支援expression和statement兩種形式。同時一點很重要的時是他擁有詞法作用域this值,幫助你很好的解決this的指向問題,這是乙個很酷的方式，可以幫助你減少一些 的編寫，先來看看它的語法。var arr 1,2,3 arr.map item item 1...

深入淺出ES6之let和const命令

let和const宣告的變數只在 塊內有效 a referenceerror a is not defined.b 1 不存在變數提公升 變數一定要在宣告後使用，否則報錯 var tmp 123 if true 不允許重複宣告 報錯 function 塊級作用域 function f functio...