JavaScript數(shù)組的API

一、 扁平化嵌套數(shù)組/展平和陣列孔——flat()

實(shí)現(xiàn)效果

var arr1 = [1, 2, [3, 4]]; arr1.flat(); // [1, 2, 3, 4] var arr2 = [1, 2, [3, 4, [5, 6]]]; arr2.flat(2); // [1, 2, 3, 4, 5, 6]//flat方法刪除數(shù)組中的空槽：var arr3 = [1, 2, , 4, 5]; arr3.flat(); // [1, 2, 4, 5]

該flat([depth])方法創(chuàng)建一個(gè)新數(shù)組，所有子數(shù)組元素以遞歸方式連接到指定的深度。depth深度級(jí)別指定嵌套數(shù)組結(jié)構(gòu)應(yīng)該展平的深度。默認(rèn)為1。

2.方法解讀：

該方法的實(shí)質(zhì)是利用遞歸和數(shù)組合并方法 concat實(shí)現(xiàn)扁平。可以使用

Array.reduce()/Array.some()/Array.concat()

利用Array.reduce()和Array.concat()實(shí)現(xiàn)

const flat1 = function (arr) {return arr = arr.reduce((pre, cur) => Array.isArray(cur) ? pre.concat(flat1(cur)) : pre.concat(cur),[])}var arr3 = [1, 2, 3, [1, 2, 3, 4, [2, 3, 4]]];flat1(arr3); // [1, 2, 3, 1, 2, 3, 4, 2, 3, 4]

利用Array.some()和Array.concat()實(shí)現(xiàn)

const flat2 = function(arr){while(arr.some(item=>Array.isArray(item))){arr=[].concat(...arr);}return arr;}var arr3 = [1, 2, 3, [1, 2, 3, 4, [2, 3, 4]]];flat2(arr3); // [1, 2, 3, 1, 2, 3, 4, 2, 3, 4]

二、數(shù)組去重——set()

1.實(shí)現(xiàn)效果

Array.from(new Set([1,2,3,3,4,4])) //[1,2,3,4] [...new Set([1,2,3,3,4,4,5,6])] //[1,2,3,4,5]

set是ES6新出來的一種一種定義不重復(fù)數(shù)組的數(shù)據(jù)類型。

Array.from是將類數(shù)組轉(zhuǎn)化為數(shù)組。

…是擴(kuò)展運(yùn)算符，將set里面的值轉(zhuǎn)化為字符串。

2.方法解讀

function unique(arr) {var result =[];for (var i = 0; i < arr.length; i++) {for (var j = i+1; j < arr.length; j++) {if (arr[i] === arr[j]) {j=++i;}}result.push(arr[i]);}return result;}var arr3 = [1, 2, 3, 3, 4, 5, 4];unique(arr3);//(5) [1, 2, 3, 5, 4]

三、數(shù)組排序——sort()

1.實(shí)現(xiàn)效果

[1,3,2,5,4].sort(); [1,3,2,5,4].sort((a,b)=>b-a);

2.方法解讀

冒泡排序

Array.prototype.bulesort = function () {let arr = this,len = arr.length;for (let outer = len; outer >= 2; outer--) {for (let inner = 0; inner <= outer - 1; inner++) {if (arr[inner] > arr[inner + 1]) {[arr[inner], arr[inner + 1]] = [arr[inner + 1], arr[inner]];}} }return arr; } [3, 4, 2,1].bulesort()//[1,2,3,4]

四、最大值

1.實(shí)現(xiàn)效果

Math.max(...[1,2,3,4]); //4 Math.max.apply(this, [1, 2, 3, 4]); //4 [1, 2,3, 4].reduce((prev,cur)=>{ return Math.max(prev, cur); },0);//4

2.方法解讀

先排序，再取值。

五、求和

1.實(shí)現(xiàn)效果

[1, 2, 3, 4].reduce((prev,cur)=>{ return prev+cur; },0); //10

2.方法解讀

function sum(arr){if (arr.length==0){return 0; } else if (arr.length == 1){return arr[0]; }else{return arr[0]+sum(arr.slice(1)); } } sum([1, 2, 3, 4]);//10

六、合并

[1,2,3].concat([5,6]); [...[1,2,4],...[2,3,5,7]]

七、判斷是否有值

[2, 3, 5].indexOf(3);//1 [2,3,5].includes(4)//false [2, 3, 5].find((item) => { item === 3})//1 [2, 3, 5].findIndex((item) => item === 3)//1 [2, 3, 5].some(item=>{return item===3 })//true

八、類數(shù)組轉(zhuǎn)化

Array.prototype.slice.call(arguments); Array.prototype.slice.apply(arguments); Array.from(arguments); [...arguments]

九、每一項(xiàng)設(shè)置值

//array.fill(value, start, end) [2, 3, 5].fill(true,false,true);//(3) [false, false, false] [2, 3, 5].map(() => 0)//(3) [0, 0, 0]

十、每一項(xiàng)是否滿足/某一項(xiàng)是否滿足

[2, 3, 5].every(item=>{return item>2}) //false [2, 3, 5].some(item =>{ return item > 2 })//true

十一、過濾數(shù)組

[2, 3, 5].filter(item => { return item > 2 })//(2) [3, 5]

十二、對(duì)象和數(shù)組轉(zhuǎn)化

Object.keys({ name: '張三', age: 14 })//["name", "age"] Object.values({name: '張三', age: 14 })// ["張三", 14] Object.entries({ name: '張三', age:14 }) // (2) [Array(2), Array(2)]0: (2)["name",

總結(jié)

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

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