最全總結 JavaScript Array 方法詳解

小阿鑫發表於2021-08-09

前言

我們在日常開發中，與介面打交道最多了，前端通過訪問後端介面，然後將介面資料二次處理渲染到頁面當中。二次處理的過程是考驗 Coder 對 Array 是否熟練以及在何種場景下使用哪種方法處理最優。小編，在最近開發中就遇到了 Array 問題，在處理複雜的業務需求時，沒想到Array 有類似的方法，然後將方法組合起來解決當下問題。

「文章用下班時間肝了一週才寫完，看完點贊、轉發是對我最大的支援。」

遍歷陣列方法

不會改變原陣列的遍歷方法

`forEach()`

forEach() 方法按照升序為陣列中每一項執行一次給定的函式。

「語法」

arr.forEach(callback(currentValue , index , array) ，thisArg)

currentValue : 陣列當前項值
index : 陣列當前項索引
arr : 陣列物件本身
thisArg : 可選引數。當執行回撥函式 callback 時，用作 this 的值。

「注意」

如果使用 「箭頭函式表示式」來傳入函式引數， thisArg 引數會被忽略，因為箭頭函式在詞法上繫結了 this 值。
forEach 不會直接改變呼叫它的物件，但是那個物件可能會被 callback 函式改變。
every 不會改變原陣列。

//防盜貼：微信公眾號: 前端自學社群

const arr = [2,3,4,1,44]

arr.forEach(val =>{
    console.log(`值為${val*2}`)
    
})
console.log(`原陣列為${arr}`);
// 值為4
// 值為6
// 值為8
// 值為2
// 值為88
// 原陣列為2,3,4,1,44

`reduce()`

reduce()陣列元素累計器，返回一個合併的結果值。

「語法」

arr.reduce(callback(accumulator, currentValue, index, array), initialValue)

accumulator : 累計器，預設為陣列元素第一個值
currentValue : 當前值
index : 當前元素索引可選
array : 陣列可選
initialValue : 初始值可選

reduce 有兩個引數，一個是回撥函式，一個是初始值。

它有兩種取值情況：

1. 當提供了 initialValue 初始值時，那麼accumulator 的值為 initialValue , currentValue 的值為 陣列第一個值
1. 當沒有提供 initialValue 初始值時，那麼 accumulator 的值為陣列第一個值， currentValue 為第二個值。

「注意」

如果陣列為空，且沒有提供initialValue 初始值時，會丟擲 TypeError .
如果陣列有一個元素，且沒有提供initialValue 或者提供了initialValue ，陣列為空，那麼唯一值被返回不會執行 callback 回撥函式。

「求和」

//防盜貼：微信公眾號: 前端自學社群/
const arr = [1, 2, 3, 4]

const sum = arr.reduce((accumulator, currentValue) => accumulator + currentValue, 10)

console.log(sum) //20 
// accumulator  累計器
// currentValue  當前值
// initialValue  累計 初始值 為10 

//10 + 1 + 2 + 3 + 4


## 注意
// 回撥函式第一次執行時，accumulator 和currentValue的取值有兩種情況：
// 如果呼叫reduce()時提供了initialValue，accumulator取值為initialValue，currentValue取陣列中的第一個值；
// 如果沒有提供 initialValue，那麼accumulator取陣列中的第一個值，currentValue取陣列中的第二個值。

「計算物件中的值」

要累加物件陣列中包含的值，必須提供初始值，以便各個item正確通過你的函式。

/*
 * @Description: 
 * @Author: 微信公眾號: 前端自學社群
 * @Date: 2021-08-07 00:53:51
 * @LastEditTime: 2021-08-07 00:53:51
 * @LastEditors: Do not edit
 */
const data = [
    {
        date: '2021-8-1',
        income: 200
    },
    {
        date: '2021-8-2',
        income: 400
    },
    {
        date: '2021-8-3',
        income: 300
    },
]

console.log(`總收入： ${data.reduce( (pre,currentValue) => pre + currentValue.income,0)}`);
//總收入： 900

「二維陣列轉一位陣列」

const array = [[1,2],[3,4]]

console.log(array.reduce((a,b) => a.concat(b)));
//[ 1, 2, 3, 4 ]

`find()`

find() 返回滿足特定條件的元素物件或者元素值，不滿足返回 undefined

「語法」

arr.find((element,index,array), thisArg)

element ：當前元素
index : 當前元素索引可選
array : 陣列本身可選
thisArg : 執行回撥時用作this 的物件。可選

// 從資料中找出第一個滿足特定條件的物件

const data = [
    {
        name:'張三',
        article: 3
    },
    {
        name:'老王',
        article: 9
    },
    {
        name:'老李',
        article: 10
    }
]

console.log(data.find(item => item.article > 9 ));

// { name: '老李', article: 10 }

`findIndex()`

findIndex() 返回陣列中符合條件的第一個元素的索引，沒有，則返回 -1 。

「語法」

arr.findIndex((element,index,array), thisArg)

element ：當前元素
index : 當前元素索引可選
array : 陣列本身可選
thisArg : 執行回撥時用作this 的物件。可選

const arr = [22,33,44,55]
console.log(arr.findIndex(val => val > 33));    //2
console.log(arr.findIndex(val => val > 99));    //-1

`key()`

key() 返回一個新的「Array Iterator」物件，該物件包含陣列中每個索引的鍵。

「語法」

keys()

「注意」

如果陣列中有空原元素，在獲取key 時，也會加入遍歷的佇列中。

const inputModal = [
    {
        name:''
    },
    {
        age:''
    },
    {
        hobby:''
    }
]
for(const key of inputModal.keys()){
    console.log(key)
}
// 0
// 1
// 2

const arr = [1,2,,3]
for(const key of arr.keys()){
    console.log(key);
}
// 0
// 1
// 2
// 3


//Object.keys() 方法會返回一個由一個給定物件的自身可列舉屬性組成的陣列
// 所以 Object.keys(arr) = [ '0', '1', '3' ]
for(const key of Object.keys(arr)){
    console.log(key);
}
// 0
// 1
// 3

`values()`

values()方法返回一個新的 「Array Iterator」 物件，該物件包含陣列每個索引的值。

「語法」

arr.values()

const Color = ['red','yelloe','orange']

for(val of Color.values()){
    console.log(val);
}
// red
// yelloe
// orange

返回布林值

`every()`

every 用來判斷陣列內所有元素是否符合某個條件，返回 「布林值」

「語法」

arr.every(callback(currentValue , index , array) ，thisArg)

currentValue : 陣列當前項值必須
index : 陣列當前項索引可選
arr : 陣列物件本身可選
thisArg : 可選引數。當執行回撥函式 callback 時，用作 this 的值。可選

「注意」

當所有的元素都符合條件才會返回true
every 不會改變原陣列。
若傳入一個空陣列，無論如何都會返回 true。

//防盜貼：微信公眾號: 前端自學社群

const arr = [2,3,4,1,44]

console.log(arr.every(val =>  val > 0 ));   //true

console.log(arr.every(val => { val > 2 })) //false

`some()`

some() 用來判斷陣列元素是否符合某個條件，只要有一個元素符合，那麼返回 true.

「語法」

arr.some(callback(currentValue , index , array) ，thisArg)

currentValue : 陣列當前項值必須
index : 陣列當前項索引可選
arr : 陣列物件本身可選
thisArg : 可選引數。當執行回撥函式 callback 時，用作 this 的值。可選

「注意」

some() 被呼叫時不會改變陣列。
如果用一個空陣列進行測試，在任何情況下它返回的都是false。
some() 在遍歷時，元素範圍已經確定，在遍歷過程中新增的元素，不會加入到遍歷的序列中。

const arr = [2,3,4,1,44]

console.log(arr.some(val => val > 2))  //true
console.log([].some(val => val > 2 )); //false


const newList = [11,22,33,44]
console.log(newList.some(val => {
    newList.push(55)
    newList.push(66)
    val > 55
}));   //false

不改變原有陣列，形成新的陣列

`filter()`

filter() 用來遍歷原陣列，過濾拿到符合條件的陣列元素，形成新的陣列元素。

「語法」

arr.some(callback(currentValue , index , array) ，thisArg)

currentValue : 陣列當前項值必須
index : 陣列當前項索引可選
arr : 陣列物件本身可選
thisArg : 可選引數。當執行回撥函式 callback 時，用作 this 的值。可選

「注意」

filter 不會改變原陣列，它返回過濾後的新陣列。
filter() 在遍歷時，元素範圍已經確定，在遍歷過程中新增的元素，不會加入到遍歷的序列中。

const arr = [11,22,33,44,55,66]
 

console.log(arr.filter(val => val > 44 ))
console.log(`原陣列為${arr}`);

// [ 55, 66 ]
// 原陣列為11,22,33,44,55,66

`map()`

map() 建立一個新的陣列，其結果是該陣列中的每個元素都呼叫一個提供的函式後返回的結果。

「語法」

arr.map(callback(currentValue , index , array) ，thisArg)

currentValue : 陣列當前項值必須
index : 陣列當前項索引可選
arr : 陣列物件本身可選
thisArg : 可選引數。當執行回撥函式 callback 時，用作 this 的值。可選

「注意」

map不修改呼叫它的原陣列本身
map() 在遍歷時，元素範圍已經確定，在遍歷過程中新增的元素，不會加入到遍歷的序列中。

const arr = [1,2,3,4]

console.log(arr.map(val => val*3 ))  // [ 3, 6, 9, 12 ]
console.log(arr)  // [ 1, 2, 3, 4 ]

陣列 CRUD

改變原陣列方法

`reverse()`

reverse() 方法將陣列中元素的位置顛倒，並返回該陣列。陣列的第一個元素會變成最後一個，陣列的最後一個元素變成第一個。該方法會改變原陣列。

const arr = [1,2,3]

console.log(arr.reverse(11,22,33))  //[ 3, 2, 1 ]

`sort()`

sort() 方法採用 「原地演算法」進行排序並返回陣列。預設排序順序是在「將元素轉換為字串」，然後「比較它們的UTF-16程式碼單元值序列」

「原地演算法」是一個使用輔助的資料結構對輸入進行轉換的演算法。但是，它允許有少量額外的儲存空間來儲存輔助變數。當演算法執行時，輸入通常會被輸出覆蓋。原地演算法僅通過替換或交換元素來更新輸入序列。

const arr = [23,11,33,44,1]

console.log(arr.sort())  //[ 1, 11, 23, 33, 44 ]


const arr = [23,11,33,44,1000000000]

console.log(arr.sort())  
// [ 1000000000, 11, 23, 33, 44 ]

刪除元素

`shift()`

shift() 方法從陣列中刪除「第一個」元素，並返回該元素的值。此方法更改陣列的長度。

「語法」

arr.shift()

「注意」

從陣列中刪除的元素; 如果陣列為空則返回undefined

const data = [
    {
        id:1,
        name:'前端'
    },
    {
        id:2,
        name:'後端'
    },
    {
        id:3,
        name:'移動端'
    },
    {
        id:4,
        name:'嵌入式開發'
    },
]

const deleObj = data.shift()



console.log('==============刪除後的元素======================');
console.log(data);
console.log('=================刪除後的元素===================');


console.log('===============被刪除的元素=====================');
console.log(deleObj);
console.log('================被刪除的元素====================');

//  ==============刪除後的元素======================
// [
//     { id: 2, name: '後端' },
//     { id: 3, name: '移動端' },
//     { id: 4, name: '嵌入式開發' }
//   ]
//   =================刪除後的元素===================

  
//   ===============被刪除的元素=====================
//   { id: 1, name: '前端' }
//   ================被刪除的元素====================

`pop()`

pop()方法從陣列中刪除最後一個元素，並返回該元素的值。此方法更改陣列的長度。

用法和 shift 類似。

「語法」

arr.pop()

「注意」

從陣列中刪除的元素; 如果陣列為空則返回undefined

const data = [
    {
        id:1,
        name:'前端'
    },
    {
        id:2,
        name:'後端'
    },
    {
        id:3,
        name:'移動端'
    },
    {
        id:4,
        name:'嵌入式開發'
    },
]

const deleObj = data.pop()




console.log(data);
// [
//     { id: 1, name: '前端' },
//     { id: 2, name: '後端' },
//     { id: 3, name: '移動端' }
// ]
console.log(deleObj);
// { id: 4, name: '嵌入式開發' }

`splice()`

splice() 方法通過「刪除」或「替換」現有元素或者原地新增新的元素來修改陣列,並以陣列形式返回被修改的內容。此方法會改變原陣列。

「語法」

array.splice(start,deleteCount, [item1,item2....])

start : 開始的索引
deleteCount : 刪除的個數可選
[item1，item2 .....] ；從開始的索引進行新增的增加和替換的元素，可選

「注意」

由被刪除的元素組成的一個陣列。如果只刪除了一個元素，則返回只包含一個元素的陣列。如果沒有刪除元素，則返回空陣列。

如果只傳遞了開始的索引位置，則會刪除索引後的所有元素物件

const data = [
    {
        id:1,
        name:'前端'
    },
    {
        id:2,
        name:'後端'
    },
    {
        id:3,
        name:'移動端'
    },
    {
        id:4,
        name:'嵌入式開發'
    },
]
data.splice(1)
console.log(data)
// [ { id: 1, name: '前端' } ]

「從索引為 2 開始，刪除 1 個陣列元素物件，新增兩個陣列元素物件」

const data = [
    {
        id:1,
        name:'前端'
    },
    {
        id:2,
        name:'後端'
    },
    {
        id:3,
        name:'移動端'
    },
    {
        id:4,
        name:'嵌入式開發'
    },
]


data.splice(2,1,...[{id:5,name:'人工智慧'},{id:6,name:'大資料開發'}])

console.log(data);
// [
//     { id: 1, name: '前端' },
//     { id: 2, name: '後端' },
//     { id: 5, name: '人工智慧' },
//     { id: 6, name: '大資料開發' },
//     { id: 4, name: '嵌入式開發' }
// ]

增加元素

`splice()`

上面已經有介紹

`push()`

push() 方法將一個或多個元素新增到陣列的「末尾」，並返回該陣列的新長度。

「語法」

arr.push(element1, ..., elementN)

const data = [
    {
        id:1,
        name:'前端'
    },
    {
        id:2,
        name:'後端'
    },
]

console.log(data.push({id:3,name:'移動端'}))  //3

「合併陣列」

const data = [
    {
        id:1,
        name:'前端'
    },
    {
        id:2,
        name:'後端'
    },
]


var obj = [
    {
        id:4,
        name:'嵌入式開發'
    },
]

// 相當於 data.push({id:4,name:'嵌入式開發'});
Array.prototype.push.apply(data, obj);

console.log(data);

[
  { id: 1, name: '前端' },
  { id: 2, name: '後端' },
  { id: 4, name: '嵌入式開發' }
]

`unshift()`

unshift() 方法將一個或多個元素新增到陣列的「開頭」，並返回該陣列的「新長度」。

const arr = [1,2,3]



console.log(arr.unshift(11,22,33))  //6 
console.log(arr)  //[ 11, 22, 33, 1, 2, 3 ]

不改變原陣列元素方法

`indexOf()`

indexOf()方法返回可以在陣列中找到給定元素的第一個索引，如果不存在，則返回 -1。

「語法」

indexOf(searchElement)
indexOf(searchElement, fromIndex)

searchElement : 要查詢的元素
fromIndex ：按指定的索引進行查詢出現的指定元素的第一個索引。可選
- 如果索引大於或等於陣列的長度，則返回-1
- 如果提供的索引值為負數，則將其視為距陣列末尾的偏移量
- 如果提供的索引為負數，仍然從前到後搜尋陣列
- 如果提供的索引為 0，則將搜尋整個陣列。
- 預設值：0（搜尋整個陣列）。

const arr = [1,1,2,3,4,5,4,4,6]

console.log(arr.indexOf(3));  //3
console.log(arr.indexOf(9));  //-1


console.log(arr.indexOf(3,4)); //-1
//從索引為 4 的元素進行查詢 3, 顯然後面沒有3 ， 返回 -1

「陣列去重」

建立一個新的空陣列，通過indexOf 來判斷空陣列是否第一次存在某個元素，

不存在則返回 [ < 0 ] ，push 到空陣列中.

const newArr = []
arr.forEach(val => {
    if(newArr.indexOf(val) < 0){
       newArr.push(val)
    }
})
console.log(newArr);
// [ 1, 2, 3, 4, 5, 6 ]

`lastIndexOf()`

lastIndexOf() 查詢陣列中元素最後一次出現的索引，如未找到返回-1。

如果不存在則返回 -1。從陣列的後面向前查詢，從 fromIndex 處開始。

「語法」

arr.lastIndexOf(searchElement, fromIndex)

searchElement : 要查詢的元素
fromIndex ：按指定的索引進行查詢出現的指定元素的第一個索引。可選
- 從指定的索引位置 「逆向」 查詢
- 預設為陣列的長度減 1(arr.length - 1)，即整個陣列都被查詢。
- 如果該值大於或等於陣列的長度，則整個陣列會被查詢。
- 如果為負值，陣列仍然會被從後向前查詢。
- 如果該值為負時，其絕對值大於陣列長度，則方法返回 -1，即陣列不會被查詢。

「注意」

lastIndexOf 使用的是 「嚴格相等」 === 比較 searchElement 和陣列中的元素。

const arr = [1,1,2,3,4,5,4,4,6]

console.log(arr.lastIndexOf(4)); //7

console.log(arr.lastIndexOf(4,11));  
//7    指定的查詢的索引 大於 陣列的長度， 會進行整個陣列查詢

console.log(arr.lastIndexOf(4,-33));
// -1   指定的索引為負數，且絕對值大於陣列長度， 則返回 -1

console.log(arr.lastIndexOf(4,-5));
//4    指定的索引為負數，且絕對值小於陣列長度， 則會 從向前進行查詢

`inCludes()`

includes() 方法用來判斷一個陣列是否包含一個指定的值，根據情況，如果包含則返回 true，否則返回false。

「語法」

arr.includes(searchElement, fromIndex)

searchElement : 要查詢的元素

❝
查詢時，區分大小寫
❞
fromIndex ：按指定的索引進行查詢出現的指定元素的第一個索引。可選
- 從指定的索引進行查詢
- 如果為負值，則按升序從 array.length + fromIndex 的索引開始搜
- 如果 fromIndex 大於等於陣列的長度，則會返回 false，且該陣列不會被搜尋。
- 預設為0

const arr = [1,1,2,3,4,5,4,4,6]

console.log(arr.includes(4)); //true

console.log(arr.includes(4,66)); //false

console.log(arr.includes(1,-1)); //false

`concat()`

concat() 方法用於合併兩個或多個陣列。

「語法」

var new_array = old_array.concat([arr1][arr2])

「注意」

concat方法不會改變this或任何作為引數提供的陣列，而是返回一個「淺拷貝」，它包含與原始陣列相結合的相同元素的副本
❝
- 物件引用（而不是實際物件）：concat將物件引用複製到新陣列中。原始陣列和新陣列都引用相同的物件。也就是說，如果引用的物件被修改，則更改對於新陣列和原始陣列都是可見的。這包括也是陣列的陣列引數的元素。
- 資料型別如字串，數字和布林（不是String，Number和 Boolean) 物件）：concat將字串和數字的值複製到新陣列中。
❞

let arr1 = [1,2,3]
let arr2 = [4,5,6]
let arr3 = [[1,2],[3,4]]
console.log(arr1.concat(arr2));
//[ 1, 2, 3, 4, 5, 6 ]

// 巢狀合併
console.log(arr1.concat(arr2).concat(arr3));
// [ 1, 2, 3, 4, 5, 6, [ 1, 2 ], [ 3, 4 ] ]


let obj1 = [{a:1},{b:2}]
let obj2 = [{c:3},{d:4}]
let obj3 = obj1.concat(obj2)  
console.log(obj3); 
//[ { a: 1 }, { b: 2 }, { c: 3 }, { d: 4 } ]


obj1[0].a = 4  //改變obj[0]物件值，會直接影響合併後的陣列，因為是淺拷貝
console.log(obj3); 
//[ { a: 4 }, { b: 2 }, { c: 3 }, { d: 4 } ]

`toString()`

toString() 返回一個字串，表示指定的陣列及其元素。

「當一個陣列被作為文字值或者進行字串連線操作時，將會自動呼叫其 toString 方法。」

對於陣列物件，toString 方法連線陣列並返回一個字串，其中包含用逗號分隔的每個陣列元素。

「語法」

arr.toString()

const arr = [1,2,3]

console.log(arr.toString());  //1,2,3

`join()`

join()方法通過連線陣列元素用逗號或指定的分隔符字串分隔，返回一個字串。

如果陣列只有一項，則將在不使用分隔符的情況下返回該項。

「語法」

join()
join(separator)

separator : 指定的分割的字元可選

const arr = ['2021','08','08']

console.log(arr.join());     //2021,08,08
console.log(arr.join('-'));  //2021-08-08
console.log(arr.join('/'));  //2021/08/08

`slice()`

slice() 方法返回一個新的陣列物件，這一物件是一個由 begin 和 end 決定的原陣列的「淺拷貝」（包括 begin，不包括end）。原始陣列不會被改變。

「語法」

arr.slice(begin, end)

begin : 指定擷取的「開始」索引可選
❝
- 預設從0 開始
- 如果begin 為負數，則以陣列末尾開始的絕對值開始擷取 slice(-2) 末尾第2個元素
- 如果 begin 超出原陣列的索引範圍，則會返回空陣列。
❞
end : 指定擷取的「結束」索引可選
❝
- 如果 end 被省略，則 slice 會一直提取到原陣列末尾。
- 如果 end 大於陣列的長度，slice 也會一直提取到原陣列末尾。
- 如果 end 為負數，則它表示在原陣列中的倒數第幾個元素結束抽取。
❞

const arr = [11,22,33,44,55,66,77,88]

console.log(arr.slice(1,4));
// 應該返回 索引 1 - 3 的陣列元素
// [ 22, 33, 44 ]


console.log(arr.slice(-4,2))  //[]

console.log(arr.slice(-4));   //[ 55, 66, 77, 88 ]


console.log(arr.slice(0,-1));
// [
//     11, 22, 33, 44,
//     55, 66, 77
//   ]

參考文獻

Array - JavaScript | MDN

最後

文章用下班時間肝了一週，寫作不易，文中的內容都是參考 MDN 文件。如果喜歡的話可以點贊???關注，支援一下，希望大家可以看完本文有所收穫！

javascript Array方法總結（下篇）
2019-03-09
JavaScript
javascript Array方法總結（上篇）
2019-03-09
JavaScript
最全JavaScript基礎總結
2020-07-20
JavaScript
JavaScript中陣列Array.sort()排序方法詳解
2018-05-26
JavaScript陣列排序
ZooKeeper最全詳解(萬字圖文總結)
2024-02-20
微服務最全詳解(圖文全面總結)
2024-02-07
微服務
負載均衡最全詳解(圖文全面總結)
2024-02-08
負載
JS-Array的方法總結
2024-10-14
JS
分散式儲存最全詳解(圖文全面總結)
2024-02-21
分散式
JavaScript陣列詳解-全網最全
2021-05-06
JavaScript陣列
JavaScript裡的陣列Array使用方法總結，超全的o
2020-04-04
JavaScript陣列
JavaScript Array map() 方法
2019-03-19
JavaScript
JavaScript Array常用方法
2018-04-08
JavaScript
高併發架構最全詳解(圖文全面總結)
2024-02-19
架構
SSO單點登入最全詳解(圖文全面總結)
2024-03-05
DDD領域驅動最全詳解(圖文全面總結)
2024-03-14
javascript Array.from()方法
2019-05-30
JavaScript
訊息佇列MQ最全詳解(萬字圖文總結)
2024-03-06
佇列MQ
js陣列方法詳解（最新最全）
2019-01-22
JS陣列
javascript遍歷方法總結
2019-02-16
JavaScript
javascript陣列方法總結
2018-08-22
JavaScript陣列
Javascript Object常用方法總結
2019-06-10
JavaScriptObject
js--陣列的 Array.of() 和 Array.from() 方法的使用總結
2021-11-10
JS陣列
JavaScript陣列方法總結（中）
2021-09-09
JavaScript陣列
JavaScript遍歷物件方法總結
2021-04-24
JavaScript物件
史上最全 Redis 高可用解決方案總結
2019-05-21
Redis
JavaScript --- Map集合結構詳解
2018-11-06
JavaScript
JavaScript — Map集合結構詳解
2018-06-10
JavaScript
JavaScript陣列去重方法總結
2019-04-05
JavaScript陣列
模擬 javaScript Array 原型上的方法
2019-04-13
JavaScript原型
JavaScript中有用的Array和Object方法
2018-07-20
JavaScriptObject
lodash已死？radash最全使用介紹（附原始碼詳細說明）—— Array方法篇（1）
2024-03-30
原始碼
史上最全webview詳解
2018-04-02
WebView
最全Drawable基礎總結
2018-04-29
JavaScript 的 this 指向和繫結詳解
2020-09-07
JavaScript
JavaScript中call,apply,bind方法的總結。
2019-04-08
JavaScriptAPP
JavaScript遍歷方法總結與對比
2019-03-30
JavaScript
ActiveMQ基本詳解與總結
2018-08-09
MQ

最全總結 JavaScript Array 方法詳解

前言

遍歷陣列方法

不會改變原陣列的遍歷方法

forEach()

reduce()

find()

findIndex()

key()

values()

返回 布林值

every()

some()

不改變原有陣列，形成新的陣列

filter()

map()

陣列 CRUD

改變原陣列方法

reverse()

sort()

刪除元素

shift()

pop()

splice()

增加元素

splice()

push()

unshift()

不改變原陣列元素方法

indexOf()

lastIndexOf()

inCludes()

concat()

toString()

join()

slice()

參考文獻

最後

相關文章

`forEach()`

`reduce()`

`find()`

`findIndex()`

`key()`

`values()`

返回布林值

`every()`

`some()`

`filter()`

`map()`

`reverse()`

`sort()`

`shift()`

`pop()`

`splice()`

`splice()`

`push()`

`unshift()`

`indexOf()`

`lastIndexOf()`

`inCludes()`

`concat()`

`toString()`

`join()`

`slice()`