有回調(diào)函數(shù)的方法都有兩個(gè)參數(shù)（不寫默認(rèn)是window)

例：map，forEach，find

let arr=[1,2,3,4]; let obj={a:1,b:2}; let _this=null; arr.map(v=>{_this=thisreturn v+1 },obj) console.log(_this)

數(shù)組方法細(xì)則

方法功能參數(shù)返回值是否改變?cè)瓟?shù)組備注

arr.push()	從后面添加元素	需要添加的元素	數(shù)組的長(zhǎng)度	是
arr.pop()	從后面刪除元素，只能是一個(gè)	無	刪除的元素 ? ? ?	是
arr.shift()	從前面刪除元素，只能刪除一個(gè)	無	刪除的元素 ? ?	是 ?
arr.unshift()	從前面添加元素	需要添加的元素	數(shù)組的長(zhǎng)度 ? ? ??	是 ?
arr.concat()	連接數(shù)組	需要連接的數(shù)組?	連接后的新數(shù)組 ? ? ?	否 ?
str.split()	將字符串轉(zhuǎn)為數(shù)組	（ “ ”? ）	轉(zhuǎn)化之后的數(shù)組 ? ? ?	否 ?
arr.sort(callback)	將數(shù)組進(jìn)行排序	（a,b)=>{return a-b}	排序后的數(shù)組 ? ? ?	是
arr.reverse()	將數(shù)組反轉(zhuǎn) ?	無	反轉(zhuǎn)之后的數(shù)組 ? ? ?	是
arr.slice(start,end)	截取數(shù)組	（索引值，索引值）? ?	不包含結(jié)束 切出來的數(shù)組 ? ? ?	否 ?
arr.forEach(callback)	遍歷數(shù)組 ?	（ v, i, arr）	無 ? ? ?	是	arr[i]賦值改變?cè)瓟?shù)組 ，v不行
arr.map(callback)	映射數(shù)組 ?	（ v, i, arr）	新數(shù)組 ? ? ?	是	arr[i]賦值改變?cè)瓟?shù)組 ，v不行
arr.filter(callback)	過濾數(shù)組 ?	（ v, i, arr）	新數(shù)組 ? ? ? ?	否 ?
arr.every(callback)	全部滿足返回true ?	（ v, i, arr）	Boolean? ? ? ? ?	否
arr.some(callback)	只要有一個(gè)滿足返回true ?	（ v, i, arr）	Boolean? ? ? ? ?	否 ?
arr.reduce(callback)	累加 ? ?	?(上一次調(diào)用回調(diào)返回的值,當(dāng)前處理的數(shù)組項(xiàng))	數(shù)組元素的和 ? ? ?	?否 ?
arr.reduceRight(callback)	從后向前累加	?(上一次調(diào)用回調(diào)返回的值,當(dāng)前處理的數(shù)組項(xiàng))	數(shù)組元素的和 ? ?	?否 ?
arr.indexOf()	查找元素索引，有則返回第一個(gè)的索引，沒有返回-1 ? ? ?	（ v ）	索引 ? ? ?	?否
arr.lastIndexOf()	從后向前查找 ? ? ?	（ v ）	索引 ? ? ? ?	否
以下是es6?
?Array.from() ?	將偽數(shù)組變?yōu)閿?shù)組（有l(wèi)ength的都行） ?	? 字符串等?	數(shù)組 ? ? ?	否
Array.of()	將一組值轉(zhuǎn)換為數(shù)組，類似聲明數(shù)組 ? ?	? 數(shù)字等	數(shù)組 ? ? ?	否 ?
arr.find(callback)	找到第一個(gè)符合條件的元素 ?	（ v, i, arr）	找到的第一個(gè)值 ? ? ?	否
arr.findIndex(callback)	找到第一個(gè)符合條件的元素的索引 ?	（ v, i, arr）	找到的第一個(gè)值的索引 ? ? ?	否 ?
arr.fill(target,start,end)	填充數(shù)組	?(待填充元素，開始索引，結(jié)束索引)	數(shù)組 ? ??	是
? arr.includes()	判斷數(shù)組中是否有給定的值(可判斷NaN)	v	boolean ? ? ?	否
? arr.keys()	遍歷數(shù)組鍵名	無	數(shù)組 ? ?	?否 ?
? ? arr.values()?	遍歷數(shù)組鍵值	無	數(shù)組 ? ? ?	否
arr.entries()	遍歷數(shù)組鍵值對(duì) ?	無	數(shù)組 ? ?	否

　參數(shù)： i 索引值? ? ? n 個(gè)數(shù)

?1?arr.push()?從后面添加元素，返回值為添加完后的數(shù)組的長(zhǎng)度

let arr = [1,2,3,4,5] console.log(arr.push(5)) // 6 console.log(arr) // [1,2,3,4,5,5]

2?arr.pop()?從后面刪除元素，只能是一個(gè)，返回值是刪除的元素

let arr = [1,2,3,4,5] console.log(arr.pop()) // 5 console.log(arr) //[1,2,3,4]

3?arr.shift()?從前面刪除元素，只能刪除一個(gè) 返回值是刪除的元素

let arr = [1,2,3,4,5] console.log(arr.shift()) // 1 console.log(arr) // [2,3,4,5]

4?arr.unshift()?從前面添加元素, 返回值是添加完后的數(shù)組的長(zhǎng)度

let arr = [1,2,3,4,5] console.log(arr.unshift(2)) // 6 console.log(arr) //[2,1,2,3,4,5]

5?arr.splice(i,n)?刪除從i(索引值)開始之后的那個(gè)元素。返回值是刪除的元素

let arr=[1,2,3,4,5]let arr1=arr.splice(0,2,5) // 從第三個(gè)值開始替換console.log(arr1) //[1,2] console.log(arr) //[5,3,4,5]

6?arr.concat()?連接兩個(gè)數(shù)組 返回值為連接后的新數(shù)組

let arr = [1,2,3,4,5] console.log(arr.concat([1,2])) // [1,2,3,4,5,1,2] console.log(arr) // [1,2,3,4,5]

7?str.split()?將字符串轉(zhuǎn)化為數(shù)組

let str = '123456' console.log(str.split('')) // ["1", "2", "3", "4", "5", "6"]

8?arr.sort()?將數(shù)組進(jìn)行排序,返回值是排好的數(shù)組，默認(rèn)是按照最左邊的數(shù)字進(jìn)行排序，不是按照數(shù)字大小排序的，見例子。

let arr = [2,10,6,1,4,22,3] console.log(arr.sort()) // [1, 10, 2, 22, 3, 4, 6] let arr1 = arr.sort((a, b) =>a - b) console.log(arr1) // [1, 2, 3, 4, 6, 10, 22] let arr2 = arr.sort((a, b) =>b-a) console.log(arr2) // [22, 10, 6, 4, 3, 2, 1] //字母排序 a.localeCompare(b)let arr=[{name:'key'},{name:'value'}]arr.sort((a,b)=>{return a.name.localeCompare(b.name)})

9?arr.reverse()?將數(shù)組反轉(zhuǎn),返回值是反轉(zhuǎn)后的數(shù)組

let arr = [1,2,3,4,5] console.log(arr.reverse()) // [5,4,3,2,1] console.log(arr) // [5,4,3,2,1]

10?arr.slice(start,end)?切去索引值start到索引值end的數(shù)組，不包含end索引的值，返回值是切出來的數(shù)組

let arr = [1,2,3,4,5] console.log(arr.slice(1,3)) // [2,3] console.log(arr) // [1,2,3,4,5]

11?arr.forEach(callback)?遍歷數(shù)組,無return??即使有return，也不會(huì)返回任何值，并且會(huì)影響原來的數(shù)組　　callback的參數(shù)： value --當(dāng)前索引的值

　　　　　　　　　　index --索引

　　　　　　　　　　array --原數(shù)組

let arr = [1,2,3,4,5] arr.forEach( (value,index,array)=>{console.log(`value:${value} index:${index} array:${array}`)}) // value:1 index:0 array:1,2,3,4,5// value:2 index:1 array:1,2,3,4,5// value:3 index:2 array:1,2,3,4,5// value:4 index:3 array:1,2,3,4,5// value:5 index:4 array:1,2,3,4,5let arr = [1,2,3,4,5] arr.forEach( (value,index,array)=>{value = value * 2console.log(`value:${value} index:${index} array:${array}`)}) console.log(arr)// value:2 index:0 array:1,2,3,4,5// value:4 index:1 array:1,2,3,4,5// value:6 index:2 array:1,2,3,4,5// value:8 index:3 array:1,2,3,4,5// value:10 index:4 array:1,2,3,4,5// [1, 2, 3, 4, 5]

var?arr?=?[1,2,3,4];?

var?res?=?arr.forEach((item,index,arr)=>{?????

?arr[index]?=?item?*?2;?

?return?arr?

})

console.log(arr);?//?[2,4,6,8]

console.log(res);?//?undefined?

12?arr.map(callback)?映射數(shù)組(遍歷數(shù)組),有return 返回一個(gè)新數(shù)組 。

　　callback的參數(shù)： value --當(dāng)前索引的值

　　　　　　　　　　index --索引

　　　　　　　　　　array --原數(shù)組

let arr = [1,2,3,4,5] arr.map( (value,index,array)=>{value = value * 2console.log(`value:${value} index:${index} array:${array}`) }) console.log(arr)

var?arr1?=?[1,2,3,4];?

var?res1?=?arr1.map((item,index,arr)=>{?

?item?=?item?*?3;?

?return?item;?

})

console.log(arr1);?//?[1,2,3,4]

console.log(res1);?//?[3,6,9,12]

ps: arr.forEach()和arr.map()的區(qū)別?
? ??1. arr.forEach()是和for循環(huán)一樣，是代替for。arr.map()是修改數(shù)組其中的數(shù)據(jù)，并返回新的數(shù)據(jù)。
? ? 2. arr.forEach() 沒有return? arr.map() 有return

13?arr.filter(callback)?過濾數(shù)組，返回一個(gè)滿足要求的數(shù)組?

? ? ? ? ? ?callback的參數(shù)： value --當(dāng)前索引的值

　　　　　　　　　　? ? ? index --索引

let arr = [1,2,3,4,5]let?arr1?=?arr.filter(?(value,?index)?=>?value<3)console.log(arr1)????//?[1,?2]

14?arr.every(callback)?依據(jù)判斷條件，數(shù)組的元素是否全滿足，若滿足則返回ture

? ? ? ? ? ? callback的參數(shù)： value --當(dāng)前索引的值

　　　　　　　　　　? ? ? index --索引

let arr = [1,2,3,4,5]let?arr1?=?arr.every(?(value,?index)?=>value<3)console.log(arr1) // falselet?arr2?=?arr.every(?(value,?index)?=>value<6)console.log(arr2)? // true

15?arr.some()?依據(jù)判斷條件，數(shù)組的元素是否有一個(gè)滿足，若有一個(gè)滿足則返回ture

?　　　　callback的參數(shù)： value --當(dāng)前索引的值

　　　　　　　　　　? ? ? index --索引

let arr = [1,2,3,4,5]let?arr1?=?arr.some(?(value,?index)?=>value<3)console.log(arr1) // truelet?arr2?=?arr.some(?(value,?index)?=>value>6)console.log(arr2) // false

16?arr.reduce(callback, initialValue)?迭代數(shù)組的所有項(xiàng)，累加器，數(shù)組中的每個(gè)值（從左到右）合并，最終計(jì)算為一個(gè)值

　　參數(shù)： callback: previousValue 必選 --上一次調(diào)用回調(diào)返回的值，或者是提供的初始值（initialValue）

　　　　　　　　　　currentValue 必選 --數(shù)組中當(dāng)前被處理的數(shù)組項(xiàng)

　　　　　　　　　　index 可選 --當(dāng)前數(shù)組項(xiàng)在數(shù)組中的索引值

　　　　　　　　　　array 可選 --原數(shù)組

　　　　　initialValue: 可選 --初始值

　　實(shí)行方法：回調(diào)函數(shù)第一次執(zhí)行時(shí)，preValue 和 curValue 可以是一個(gè)值，如果 initialValue 在調(diào)用 reduce() 時(shí)被提供，那么第一個(gè) preValue 等于 initialValue ，并且curValue 等于數(shù)組中的第一個(gè)值；如果initialValue 未被提供，那么preValue 等于數(shù)組中的第一個(gè)值.

let arr = [0,1,2,3,4] let arr1 = arr.reduce((preValue, curValue) => preValue + curValue ) console.log(arr1) // 10

let arr2 = arr.reduce((preValue,curValue)=>preValue + curValue,5) console.log(arr2) // 15

reduce的高級(jí)用法

?（1）計(jì)算數(shù)組中每個(gè)元素出現(xiàn)的次數(shù)

let?names?=?['peter',?'tom',?'mary',?'bob',?'tom','peter'];

let?nameNum?=?names.reduce((pre,cur)=>{

??if(cur?in?pre){

????pre[cur]++

??}else{

????pre[cur]?=?1

??}

??return?pre

},{})

console.log(nameNum);?//{?peter:?2,?tom:?2,?mary:?1,?bob:?1?}

? ?（2）數(shù)組去重

let arr = [1,2,3,4,4,1] let newArr = arr.reduce((pre,cur)=>{if(!pre.includes(cur)){return pre.concat(cur)}else{return pre} },[]) console.log(newArr);// [1, 2, 3, 4]

（3）將多維數(shù)組轉(zhuǎn)化為一維

let arr = [[0, 1], [2, 3], [4,[5,6,7]]] const newArr = function(arr){return arr.reduce((pre,cur)=>pre.concat(Array.isArray(cur)?newArr(cur):cur),[]) } console.log(newArr(arr)); //[0, 1, 2, 3, 4, 5, 6, 7]

17?arr.reduceRight(callback, initialValue)?與arr.reduce()功能一樣，不同的是，reduceRight()從數(shù)組的末尾向前將數(shù)組中的數(shù)組項(xiàng)做累加。

　　實(shí)行方法：reduceRight()首次調(diào)用回調(diào)函數(shù)callbackfn時(shí)，prevValue 和 curValue 可以是兩個(gè)值之一。如果調(diào)用 reduceRight() 時(shí)提供了 initialValue 參數(shù)，則 prevValue 等于 initialValue，curValue 等于數(shù)組中的最后一個(gè)值。如果沒有提供 initialValue 參數(shù)，則 prevValue 等于數(shù)組最后一個(gè)值， curValue 等于數(shù)組中倒數(shù)第二個(gè)值。

let arr = [0,1,2,3,4] let arr1 = arr.reduceRight((preValue, curValue) => preValue + curValue ) console.log(arr1) // 10

let arr2 = arr.reduceRight((preValue,curValue)=>preValue + curValue,5) console.log(arr2) // 15

ps：

(如果對(duì)這兩個(gè)方法不明白，可以查看大漠老師的實(shí)例?http://www.w3cplus.com/javascript/array-part-8.html)

18?arr.indexOf()?查找某個(gè)元素的索引值，若有重復(fù)的，則返回第一個(gè)查到的索引值若不存在，則返回 -1

let arr = [1,2,3,4,5,2] let arr1 = arr.indexOf(2) console.log(arr1) // 1 let arr2 = arr.indexOf(9) console.log(arr2) // -1

19?arr.lastIndexOf()???和arr.indexOf()的功能一樣，不同的是從后往前查找

let arr = [1,2,3,4,5,2] let arr1 = arr.lastIndexOf(2) console.log(arr1) // 5 let arr2 = arr.lastIndexOf(9) console.log(arr2) // -1

20?Array.from()?將偽數(shù)組變成數(shù)組，就是只要有l(wèi)ength的就可以轉(zhuǎn)成數(shù)組。 ---es6

let str = '12345' console.log(Array.from(str)) // ["1", "2", "3", "4", "5"] let obj = {0:'a',1:'b',length:2} console.log(Array.from(obj)) // ["a", "b"]

21?Array.of()?將一組值轉(zhuǎn)換成數(shù)組，類似于聲明數(shù)組? ? ---es6

let str = '11' console.log(Array.of(str)) // ['11']

等價(jià)于

console.log(new Array('11')) // ['11

ps:

但是new Array()有缺點(diǎn)，就是參數(shù)問題引起的重載

console.log(new Array(2)) //[empty × 2] 是個(gè)空數(shù)組 console.log(Array.of(2)) // [2

22?arr.copyWithin()?在當(dāng)前數(shù)組內(nèi)部，將制定位置的數(shù)組復(fù)制到其他位置，會(huì)覆蓋原數(shù)組項(xiàng)，返回當(dāng)前數(shù)組

　　參數(shù): target --必選 索引從該位置開始替換數(shù)組項(xiàng)

　　　　??start --可選 索引從該位置開始讀取數(shù)組項(xiàng)，默認(rèn)為0.如果為負(fù)值，則從右往左讀。

　　　　??end --可選 索引到該位置停止讀取的數(shù)組項(xiàng)，默認(rèn)是Array.length,如果是負(fù)值，表示倒數(shù)

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

23?arr.find(callback)?找到第一個(gè)符合條件的數(shù)組成員

let arr = [1,2,3,4,5,2,4] let arr1 = arr.find((value, index, array) =>value > 2) console.log(arr1) // 3

24?arr.findIndex(callback)?找到第一個(gè)符合條件的數(shù)組成員的索引值let arr = [1,2,3,4,5] let arr1 = arr.findIndex((value, index, array) => value > 3) console.log(arr1) // 3

25?arr.fill(target, start, end)?使用給定的值，填充一個(gè)數(shù)組,ps:填充完后會(huì)改變?cè)瓟?shù)組

　　參數(shù)： target -- 待填充的元素

　　　　　 start -- 開始填充的位置-索引

　　　　? ??end -- 終止填充的位置-索引（不包括該位置)

let arr = [1,2,3,4,5] let arr1 = arr.fill(5) console.log(arr1) // [5, 5, 5, 5, 5] console.log(arr) // [5, 5, 5, 5, 5] let arr2 = arr.fill(5,2) console.log(arr2) let arr3 = arr.fill(5,1,3) console.log(arr3)

26?arr.includes()?判斷數(shù)中是否包含給定的值

let arr = [1,2,3,4,5] let arr1 = arr.includes(2) console.log(arr1) // ture let arr2 = arr.includes(9) console.log(arr2) // false let arr3 = [1,2,3,NaN].includes(NaN) console.log(arr3) // true

ps:與indexOf()的區(qū)別：

1 indexOf()返回的是數(shù)值，而includes()返回的是布爾值

2 indexOf() 不能判斷NaN，返回為-1 ，includes()則可以判斷

27?arr.keys()?遍歷數(shù)組的鍵名

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

28?arr.values()?遍歷數(shù)組鍵值

let arr = [1,2,3,4] let arr1 = arr.values() for (let val of arr1) {console.log(val); // 1,2,3,4 }

29?arr.entries()?遍歷數(shù)組的鍵名和鍵值

let arr = [1,2,3,4] let arr1 = arr.entries() for (let e of arr1) {console.log(e); // [0,1] [1,2] [2,3] [3,4] }

entries() 方法返回迭代數(shù)組。

迭代數(shù)組中每個(gè)值 前一個(gè)是索引值作為 key， 數(shù)組后一個(gè)值作為 value。

轉(zhuǎn)載? ? ?熱愛前端的17號(hào)誒? ? ?https://www.cnblogs.com/sqh17/p/8529401.html

總結(jié)

以上是生活随笔為你收集整理的数组方法 包含es6的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。