ES6： 數組

ES6中數組增長了不少新的方法，可是先回顧下以前ES5中的數組的方法。

ES5中的方法

• Array.prototype.forEach
  遍歷一下數組中的每一個選項

• Array.prototype.map, Array.prototype.filter: 返回一個新的數組。
  二者的區別是：map返回的是，由原數組中的每一個元素調用一個方法後返回的新數組；filter是經過指定函數測試，而後建立了個新的數組；

• Array.prototype.some,Array.prototype.every: 返回的是Boolean值
  some只要有一個符號就返回；every只要有一個不符合就返回。

• Array.prototype.reduce, Array.prototype.reduceRight:至關於一個迭代的過程，返回最終的結果。能夠傳4個參數：previous, current, index, array.

• indexOf, lastIndexOf

ES6中新增的方法

Array.from()

這個方法是將對象轉爲真正的數組，這個對象有兩種類型：相似數組的對象和可遍歷的對象（如ES6中的Set和Map）

let arrayLike = {
    '0': 'a',
    '1': 'b',
    '2': 'c',
    length: 3
};

// ES5的寫法
var arr1 = [].slice.call(arrayLike); // ['a', 'b', 'c']

// ES6的寫法
let arr2 = Array.from(arrayLike); // ['a', 'b', 'c']

經常使用的場景

常見的相似數組對象是NodeList集合和arguments

Array.from('hello');//['h','e','l','l','o']

let namesSet = new Set(['a','b'])
Array.from(namesSet);//['a','b']

Array.from([1,2,3])//[1,2,3]

但有一點，擴展運算符(...)也能夠將某些數據結構轉爲數組

var args = [...arguments];

[...document.querySelectorAll('div')]

其實擴展運算符背後調用的是遍歷器接口(Symbol.iterator),若是一個對象沒有部署成這個接口，就沒法轉換。Array.from方法則還支持相似的數組對象，可是這種相似數組對象，必需要有length屬性，若是沒有，就不能轉換。

Array.from還能夠接受第二個參數，做用相似與數組的map方法，用於對每一個元素進行處理。

Array.of()

這個方式是用於將一組值，轉換爲數組。

Array.of(3,11,8)//[3,11,8]

這個方法的主要目的，是彌補數組構造函數Array()的不足

new Array(3)//[undefined*3]

Array.of能夠替代Array()或者new Array()

Array.of()//[]
Array.of(undefined)//[undefined]
Array.of(1)//[1]
Array.of(1,2)//[1,2]

copyWidthin()

將制定位置的成員複製到其餘位置，而後返回當前數組，就是使用這個方法，修改當前數組。
Array.prototype.copyWithin(target, start = 0, end = this.length)

• target(必選)：從該位置開始替換數據

• start(可選)：從該位置開始讀取數據，默認爲0，若是是負數，表示倒數。

• end(可選)：到該位置前中止讀取數據，默認等於數組長度。若是是負數，表示倒數。

[1,2,3,4,5].copyWidthin(0, 3)//[4,5,3,4,5]

[1,2,3,4,5].copyWidthin(0,3,4)//[3,2,3,4,5]
[1,2,3,4,5].copyWidthin(0,-2,-1)//[4,2,3,4,5]

find(), findIndex()

find(): 用於找到第一個符合條件的數組成員
findIndex(): 返回第一個符合條件的數組成員位置

fill()

這個方式使用一個定值，填充一個數組

['a','b','c'].fill(7)//[7,7,7]

entries() keys() values()

for (let index of ['a', 'b'].keys()) {
  console.log(index);
}
// 0
// 1

for (let elem of ['a', 'b'].values()) {
  console.log(elem);
}
// 'a'
// 'b'

for (let [index, elem] of ['a', 'b'].entries()) {
  console.log(index, elem);
}
// 0 "a"
// 1 "b"

includes()

這個方法表示某個數組是否包含給定的值

數組的空位，數組的空位和undefined不是同一個概念

0 in [undefined, undefined, undefined] // true
0 in [, , ,] // false

空位處理

ES5中

forEach,filter,every,some會跳過空位
map會跳過空位，但會保留這個值
join(),toString()會將空位視爲undefined,而undefined和null會被處理成空字符串.

ES6會將空位轉爲undefined.