摘要：創建數組中創建數組的方式數組字面量一個數組。傳入一個回調函數，找到數組中符合當前搜索規則的第一個元素，返回它，并且終止搜索。用新元素替換掉數組內的元素，可以指定替換下標范圍。

ES5提供的數組已經很強大，但是ES6中繼續改進了一些，主要是增加了新的數組方法，所以這章的知識非常少。

ES5中創建數組的方式：數組字面量、new一個數組。

const arr1 = [] //數組字面量
const arr2 = new Array() //new構建

ES6創建數組：Array.of()、Array.from()

ES5中new一個人數組的時候，會存在一個令人困惑的情況。當new一個數字的時候，生成的是一個長度為該數字的數組，當new一個字符串的時候，生成的是該字符串為元素的數組。

const a = new Array(2)
const b = new Array("2")
console.log(a, b) //[undefined, undefined] ["2"]

這樣一來，導致new Array的行為是不可預測的，Array.of()出現為的就是解決這個情況。

const c = Array.of(2)
const d = Array.of("2")
console.log(c, d) // [2] ["2"]

使用Array.of()創建的數組傳入的參數都是作為數組的元素，而不在是數組長度，這樣就避免了使用上的歧義。

如果說Array.of()是創建一個新數組，而Array.from()是將類數組轉換成數組。

下面的例子講的是將arguments轉換成數組。arguments是類數組對象，他表示的是當前函數的所有參數，如果函數沒有參數，那么arguments就為空。

function test(a, b) {
  let arr = Array.from(arguments)
  console.log(arr)
}
test(1, 2) //[1, 2]

映射轉換：Array.from(arg1, arg2)，我們可以給該方法提供2個參數，第二個參數作為第一個參數的轉換。看個簡單例子你就懂了。

function test(a, b) {
  let arr = Array.from(arguments, value => value + 2)
  console.log(arr)
}
test(1, 2) //[3, 4]

Array.from還可以設置第三個參數，指定this。

Array.from()轉換可迭代對象：這個用法只需要一個例子，數組去重。

function test() {
  return Array.from(new Set(...arguments))
}
const s = test([1, "2", 3, 3, "2"])
console.log(s) // [1,"2",3]

ES6給數組添加了幾個新方法：find()、findIndex()、fill()、copyWithin()。

1、find()：傳入一個回調函數，找到數組中符合當前搜索規則的第一個元素，返回它，并且終止搜索。

const arr = [1, "2", 3, 3, "2"]
console.log(arr.find(n => typeof n === "number")) // 1

2、findIndex()：傳入一個回調函數，找到數組中符合當前搜索規則的第一個元素，返回它的下標，終止搜索。

const arr = [1, "2", 3, 3, "2"]
console.log(arr.findIndex(n => typeof n === "number")) // 0

3、fill()：用新元素替換掉數組內的元素，可以指定替換下標范圍。

arr.fill(value, start, end)

測試一下

const arr = [1, 2, 3]
console.log(arr.fill(4)) // [4, 4, 4] 不指定開始和結束，全部替換

const arr1 = [1, 2, 3]
console.log(arr1.fill(4, 1)) // [1, 4, 4] 指定開始位置，從開始位置全部替換

const arr2 = [1, 2, 3]
console.log(arr2.fill(4, 0, 2)) // [4, 4, 3] 指定開始和結束位置，替換當前范圍的元素

4、copyWithin()：選擇數組的某個下標，從該位置開始復制數組元素，默認從0開始復制。也可以指定要復制的元素范圍。

arr.copyWithin(target, start, end)

測試一下

const arr = [1, 2, 3, 4, 5]
console.log(arr.copyWithin(3)) // [1,2,3,1,2] 從下標為3的元素開始，復制數組，所以4, 5被替換成1, 2

const arr1 = [1, 2, 3, 4, 5]
console.log(arr1.copyWithin(3, 1)) // [1,2,3,2,3] 從下標為3的元素開始，復制數組，指定復制的第一個元素下標為1，所以4, 5被替換成2, 3

const arr2 = [1, 2, 3, 4, 5]
console.log(arr2.copyWithin(3, 1, 2)) // [1,2,3,2,5] 從下標為3的元素開始，復制數組，指定復制的第一個元素下標為1，結束位置為2，所以4被替換成2

其他還有定型數組、數組緩沖區的概念，你可以詳細查看書上教程。

掌握新的創建數組的方式，以及數組新增的幾個方法，就夠你使用了。定型數組和數組緩沖區一般人可以不用了解的太詳細。

=> 返回文章目錄