原創(chuàng)聲明
本文系作者辛苦碼字所得,歡迎分享和轉(zhuǎn)載,但請?jiān)诿黠@位置注明作者的如下信息:
筆名:來碗雞蛋面
簡書主頁:http://www.itdecent.cn/u/4876275b5a73
郵箱:job_tom@foxmail.com
CSDN ID:tom_wong666
需求:
js數(shù)組(Array)方法匯總
索引:
對數(shù)組方法的學(xué)習(xí)和匯總,分為三大類:
一,改變原數(shù)組的方法(10種):
1,arr[key]='tom';
2,arr.splice();
3,arr.reverse();
4,arr.sort();
5,arr.push();
6,arr.pop();
7,arr.unshift();
8,arr.shift();
9,arr.fill();
10,arr.copyWithin();
二,不動原數(shù)組,只產(chǎn)生新數(shù)據(jù)的方法(14種):
1,arr.concat();
2,arr.slice();
3,arr.join();
4,arr.toString();
5,arr.map();
6,arr.filter();
7,arr.reduce()和arr.reduceRight();
8,arr.find();
9,Array.from();
10,Array.of();
11,Object.keys(arr);
12,arr.values();
13,arr.keys();
14,arr.entries();
三,不動原數(shù)組,只依據(jù)原數(shù)組進(jìn)行判斷/處理的方法(10種):
1,arr.forEach()---遍歷方法1;
2,for()---遍歷方法2;
3,for...of....---遍歷方法3;
4,for...in...---遍歷方法4;
5,...(spread);
6,arr.indexOf()||arr.lastIndexOf();
7,arr.every()||arr.some();
8,Array.isArray();
9,arr.includes();
10,arr.findIndex();
正文:
一,改變原數(shù)組的方法
1,arr[key]='tom';依據(jù)下標(biāo)直接賦值
代碼如下,說明一點(diǎn):索引和關(guān)聯(lián)數(shù)組不是互斥的,這里為了方便說明定義了兩個空數(shù)組,實(shí)際上,可以同時用數(shù)字和字符串作為下標(biāo)為同一個數(shù)組賦值;
//定義一個空數(shù)組
let indexArr=[];
//以索引數(shù)組賦值方式
indexArr[0]='tom';
console.log(indexArr);//['tom']
//定義一個空數(shù)組
let associativeArr=[];
//以關(guān)聯(lián)數(shù)組方式賦值
associativeArr['age']=30;
console.log(associativeArr);//[age:30]

2,arr.splice()
(1)作用:允許從指定的數(shù)組中,刪除一部分元素,同時還可以添加另外一部分元素;
(2)語法:var res=數(shù)組名.splice(start,count,e1,e2,e3);
(3)語法解釋:start:開始刪除和(或)添加元素的位置;count:刪除的數(shù)量,0表示不刪除任何元素,省略表示從開始位置全部刪除;e1,e2,e3:新添加的元素;
(4)返回值:返回的是刪除的元素組成的數(shù)組,原數(shù)組會被刪除對應(yīng)的元素;
(5)示例代碼:
// 定義一個數(shù)組
let arr=[1,2,3,4,5,6];
// 用splice方法處理
let res=arr.splice(1,2,'new1','new2','new3');
// 查看返回值
console.log('res',res);// [2,3]
// 查看修改后的數(shù)組
console.log('arr',arr);// [1, "new1", "new2", "new3", 4, 5, 6]
// 驗(yàn)證為count為0的情況
let newRes=arr.splice(1,0);
console.log(newRes);// []
console.log(arr);// [1, "new1", "new2", "new3", 4, 5, 6]
// 驗(yàn)證count空著的情況
let myNewRes=arr.splice(1);
console.log(myNewRes);// ["new1", "new2", "new3", 4, 5, 6]
console.log(arr);// [1]

3,arr.reverse()
(1)作用:將一個數(shù)組反轉(zhuǎn)(次序反轉(zhuǎn));
(2)語法:var res=數(shù)組名.reverse();
(3)語法解釋:#;
(4)返回值:該函數(shù)會改變原有數(shù)組,返回的時反轉(zhuǎn)后的新數(shù)組;
(5)示例代碼:
let arr=[1,2,3,4,5,6];
let res=arr.reverse();
console.log(res);// [6, 5, 4, 3, 2, 1]
console.log(arr);// [6, 5, 4, 3, 2, 1]

4,arr.sort()
(1)作用:將數(shù)組中的元素排序;
(2)語法:arr.sort();
(3)語法解釋:小括號內(nèi)可以帶參數(shù),如果不帶參數(shù),默認(rèn)依照字母表順序排列,如果數(shù)組中有unefined值,將會被排到數(shù)組尾部;小括號內(nèi)也可以帶一個函數(shù)作為參數(shù):
function(a,b){
// value是a和b比較的結(jié)果
return value;
}

函數(shù)解釋:a,b分別代表數(shù)組的兩個元素,數(shù)組元素采用冒泡方法比較,每個元素至少會比較一次;value值如果小于0,從小到大排序,value如果大于0,從大到小排序,value如果等于0,不動順序(如果是a===b的情況value需要等于0,其實(shí)可以忽略這個判斷);
函數(shù)個人理解如下,僅供參考,完整用例見(5)示例代碼:
// 從小到大排序
function(a,b){
// 個人來理解:如果a小于b,a-b強(qiáng)制等于-1=>a小于b,a排前面(升序)
// 基于a-b的判斷,結(jié)果可以強(qiáng)制定義,依據(jù)定義的結(jié)果,小值永遠(yuǎn)在前
if(a<b)return -1;
return 1;
}
// 從大到小排序
function(a,b){
// 個人來理解:如果a小于b,a-b強(qiáng)制等于1=>a大于b,b排前面(降序)
// 基于a-b的判斷,結(jié)果可以強(qiáng)制定義,依據(jù)定義的結(jié)果,小值永遠(yuǎn)在前
if(a<b)return 1;
return -1;
}

(4)返回值:返回排序后的數(shù)組,注意undefined值總會被默認(rèn)排在最后,無論升序還是降序;
(5)示例代碼:
let arr=['b','c','a',undefined,'e','d'];
// 不帶參數(shù)排序
let res=arr.sort();
// 驗(yàn)證返回值
console.log(res);// ["a", "b", "c", "d", "e",undefined]
// 驗(yàn)證原數(shù)組
console.log(arr);// ["a", "b", "c", "d", "e",undefined]
// 驗(yàn)證返回值是否指向原數(shù)組
console.log(res===arr); // true
// 驗(yàn)證排序規(guī)則-從小到大
let arr1=['b','c','a',undefined,'e','d'];
arr1.sort((a,b)=>{
if(a<b)return -1;
return 1;
})
console.log(arr1);// ["a", "b", "c", "d", "e", undefined]
// 驗(yàn)證排序規(guī)則-從大到小
let arr1=['b','c','a',undefined,'e','d'];
arr1.sort((a,b)=>{
if(a<b)return 1;
return -1;
})
console.log(arr1);// ["e", "d", "c", "b", "a", undefined]
// 讓某個值排在第一位比如'd'
// 注意一個現(xiàn)象:如果要求'd'在第一位,而其他元素排序不變,在元素偏多時(比如10個以上)
// 'd'在第一位不會出問題,但是其他元素的排序可能不穩(wěn)定
let arr=['c','b','a','d','e'];
arr.sort((a,b)=>{
// 個人來理解:如果a是‘d’,a-b強(qiáng)制等于-1=>a小于b,a排前面
if(a==='d')return -1;
// 個人理解:如果b是‘d’,a-b強(qiáng)制等于1=>b小于a,b排前面
if(b==='d')return 1;
return 0;
})
console.log(arr); // ["d", "c", "b", "a", "e"]

5,arr.push()
(1)作用:在數(shù)組尾部(棧頂)添加新元素;
(2)語法:var res=數(shù)組名.push(n);
(3)語法解釋:n是需要插入數(shù)組的元素;
(4)返回值:更新后的原數(shù)組的長度;
(5)示例代碼:
let arr=[10,20,30];
let res=arr.push(40);
console.log(arr);// [10, 20, 30, 40]
console.log(res);// 4

6,arr.pop()
(1)作用:刪除數(shù)組尾部(棧頂)的元素;
(2)語法:var res=數(shù)組名.push();
(3)語法解釋:#;
(4)返回值:被刪除的元素;
(5)示例代碼:
let arr=[10,20,30];
let res=arr.pop();
console.log(arr);// [10, 20]
console.log(res);// 30

7,arr.unshift()
(1)作用:在數(shù)組頭部(棧底)添加新元素;
(2)語法:var res=數(shù)組名.unshift(n);
(3)語法解釋:n是需要插入數(shù)組的元素;
(4)返回值:更新后的原數(shù)組的長度;
(5)示例代碼:
let arr=[10,20,30];
let res=arr.unshift(40);
console.log(arr);// [40, 10, 20, 30]
console.log(res);// 4

8,arr.shift()
(1)作用:刪除數(shù)組頭部(棧底)的元素;
(2)語法:var res=數(shù)組名.shift();
(3)語法解釋:#;
(4)返回值:被刪除的元素;
(5)示例代碼:
let arr=[10,20,30];
let res=arr.shift();
console.log(arr);// [20, 30]
console.log(res);// 10

9,arr.fill()
(1)作用:用一個固定值填充一個數(shù)組中從起始索引到終止索引內(nèi)的全部元素;
(2)語法:arr.fill(value,start,end);
(3)語法解釋:value某個值,start起始下標(biāo),end結(jié)束下標(biāo);
(4)返回值:修改后的原數(shù)組;
(5)示例代碼:
let arr=[1,2,3,4,5,6,7,8,9];
const res=arr.fill('tom',2,14);
console.log(res);// [1, 2, "tom", "tom", "tom", "tom", "tom", "tom", "tom"]
console.log(arr);// [1, 2, "tom", "tom", "tom", "tom", "tom", "tom", "tom"]
console.log(res===arr);// true

10,arr.copyWithin()
(1)作用:淺拷貝數(shù)組的部分元素到同一數(shù)組的不同位置,且不改變數(shù)組的長度;
(2)語法:arr.copyWithin(target,start,end);
(3)語法解釋:target---復(fù)制序列即將覆蓋元素的目標(biāo)位置,如果是負(fù)數(shù),target 將從末尾開始計(jì)算,如果 target 大于等于 arr.length,將會不發(fā)生拷貝,如果 target 在 start 之后,復(fù)制的序列將被修改以符合 arr.length;start 被復(fù)制元素的起始位置,如果是負(fù)數(shù),start 將從末尾開始計(jì)算,如果 start 被忽略,copyWithin 將會從0開始復(fù)制;end 被復(fù)制元素的結(jié)束位置,如果是負(fù)數(shù),end 將從末尾開始計(jì)算,如果 end 被忽略,copyWithin 將會復(fù)制到 arr.length;以上位置遵循數(shù)組索引規(guī)則(即位于元素的左下角);
(4)返回值:修改后的原數(shù)組;
(5)示例代碼:
const arr=[1,2,3,4,5,6,7,8,9];
const res=arr.copyWithin(0,1,3)
console.log(res);// [2, 3, 3, 4, 5, 6, 7, 8, 9]
console.log(res===arr);// true

二,不動原數(shù)組,只產(chǎn)生新數(shù)據(jù)的方法
1,arr.concat()
(1)作用:拼接兩個或多個數(shù)組;
(2)語法:let res=數(shù)組名.concat(arr1,arr2,arr3.......);
(3語法解釋:arr指代數(shù)組;
(4)返回值:拼接后的新數(shù)組;
(5)示例代碼:
const arr=["中國","俄羅斯","英國"];
const arr1=["日本","韓國","朝鮮"];
const arr2=["美國","巴西","西班牙"];
const res=arr.concat(arr1,arr2);
console.log(res);// ["中國", "俄羅斯", "英國", "日本", "韓國", "朝鮮", "美國", "巴西", "西班牙"]
console.log(arr);// ["中國", "俄羅斯", "英國"]

2,arr.slice()
(1)作用:用來截取子數(shù)組,從指定的數(shù)組中,截取幾個連續(xù)的元素,組成一個新數(shù)組;
(2)語法:let res=數(shù)組名.slice(start,[end]);
(3)語法解釋:start截取的開始下標(biāo),end截取的結(jié)束下標(biāo)(可省略,如果省略,一直截取到數(shù)組末尾),[]表示可以省略;
(4)返回值:截取的元素組成的新數(shù)組;
(5)示例代碼:
const arr=[1,2,3,4,5,6,7,8,9];
const res=arr.slice(2,5);
console.log(res);// [3, 4, 5]
console.log(arr);// [1, 2, 3, 4, 5, 6, 7, 8, 9]

3,arr.join()
(1)作用:將數(shù)組的元素值通過指定的字符連接到一起,并組成一個新的字符串;
(2)語法:let res=arr.join(str);
(3)語法解釋:str指代一個字符串;
(4)返回值:返回?cái)?shù)組元素加分割字符串組成的一個新數(shù)組;和字符串方法arr.split(str)有互反的作用;
(5)示例代碼:
const arr=[1,2,3,4,5,6,7,8,9];
const res=arr.join('-');
console.log(res);// 1-2-3-4-5-6-7-8-9
console.log(arr);// [1, 2, 3, 4, 5, 6, 7, 8, 9]
const test=res.split('-');
console.log(test);// ["1", "2", "3", "4", "5", "6", "7", "8", "9"]
console.log(res);// 1-2-3-4-5-6-7-8-9

4,arr.toString()
(1)作用:將數(shù)組的元素值通過逗號連接到一起,并組成一個新的字符串;
(2)語法:let res=arr.toString();
(3)語法解釋:#;
(4)返回值:返回用數(shù)組元素加逗號分隔組成的新字符串;
(5)示例代碼:
const arr=[1,2,3,4,5,6,7,8,9];
const res=arr.toString();
console.log(res);// 1,2,3,4,5,6,7,8,9
console.log(arr)// [1, 2, 3, 4, 5, 6, 7, 8, 9]

5,arr.map()
(1)作用:將數(shù)組的每個元素傳遞給指定函數(shù), 并返回一個數(shù)組;
(2)語法:arr.map(function(item){return item*item});
(3)語法解釋:item指代數(shù)組的元素,每個元素都會調(diào)用后面的函數(shù)處理一次;
(4)返回值:函數(shù)處理后的新數(shù)組;
(5)示例代碼:
const arr=[1,2,3,4,5,6,7,8,9];
const res=arr.map((item)=>{return item*item});
console.log(res);// [1, 4, 9, 16, 25, 36, 49, 64, 81]
console.log(arr);// [1, 2, 3, 4, 5, 6, 7, 8, 9]

6,arr.filter()
(1)作用:依據(jù)指定的函數(shù)邏輯判斷,并返回原數(shù)組的一個元素的子集組成的新數(shù)組;
(2)語法:arr.filter(function(item){return item<n});
(3)語法解釋:item指代數(shù)組元素,符合條件(判定為true)的item會被返回;
(4)返回值:返回符合判斷條件的元素組成的新數(shù)組;
(5)示例代碼:
// 示例1
const arr=[1,2,3,4,5,6,7,8,9];
const res=arr.filter((item)=>{return item<5});
console.log(res);// [1, 2, 3, 4]
// 示例2
const arr2=[0,1,2,3];
const res2=arr2.filter((item)=>{return true});
console.log(res2);// [0, 1, 2, 3]
// 示例3--true過濾空元素
const arr3=[0,,1,2,3];
const res3=arr3.filter((item)=>{return true})
console.log(res3);// [0, 1, 2, 3]
// 示例4--true過濾不掉null
const arr4=[0,null,1,2,3];
const res4=arr4.filter((item)=>{return true})
console.log(res4);// [0, null, 1, 2, 3]
//示例5--true過濾不掉undefined
const arr5=[0,undefined,1,2,3];
const res5=arr5.filter((item)=>{return true})
console.log(res5);
//示例6--過濾null和undefined
const arr6=[0,undefined,1,2,null,3];
const res6=arr6.filter((item)=>{return item!==undefined && item!==null})
console.log(res6);// [0, 1, 2, 3]

7,arr.reduce()和arr.reduceRight()
(1)作用:依據(jù)指定函數(shù)對數(shù)組進(jìn)行收斂/縮減,最終返回單一值作為計(jì)算結(jié)果;
(2)語法:arr.reduce(function(res,value,index,arr){return res+value},n);
(3)語法解釋:res為每次計(jì)算的結(jié)果,初始值是n,如果n沒給,則延取數(shù)組第一個元素作為其初始值,value則延取數(shù)組第二個元素;value是數(shù)組的元素值,index是數(shù)組的下標(biāo),arr是數(shù)組本身;res和value必須給,index/arr/n可選;注意arr為空數(shù)組且未給參數(shù)n時報錯;arr為單元素?cái)?shù)組,未給n時,簡單返回單元素;arr為空數(shù)組,n給了時,簡單返回n;reduce從左到右處理,reduceRight從右到左處理;
(4)返回值:返回最終計(jì)算后的res值;
(5)示例代碼:
const arr=[1,2,3,4,5,6,7,8,9];
const res1=arr.reduce((res,value)=>{return res+value},0);
console.log(res1);// 45 求和
const res2=arr.reduce((res,value)=>{return res*value},1);
console.log(res2);// 362880 求積
const res3=arr.reduce((res,value)=>{return res>value?res:value});
console.log(res3);// 9 求最大值

8,arr.find()
(1)作用:判斷數(shù)組內(nèi)是否有符合條件的元素,并返回這個元素;
(2)語法:arr.find(function(item,index,arr){return item<9});
(3)語法解釋:item數(shù)組元素,index數(shù)組下標(biāo),arr數(shù)組本身;
(4)返回值:返回?cái)?shù)組內(nèi)通過判斷的第一個元素的值,若找不到返回undefined;空數(shù)組不執(zhí)行函數(shù);
(5)示例代碼:
const arr=[1,2,3,4,5,6,7,8,9];
const res=arr.find((item)=>{return item<4})
console.log(res);// 1
const arr1=[{name:'tom',age:30},{name:'jery',age:35}];
const res1=arr1.find((item)=>{return item.name==='tom'});
console.log(res1);// {name: "tom", age: 30}
const res2=arr1.find((item)=>{return item.name==='tomBro'});
console.log(res2);// undefined

9,Array.from()
(1)作用:從一個類似數(shù)組或可迭代對象中創(chuàng)建一個新的數(shù)組;
(2)語法:Array.from(arrayLike, mapFn, thisArg);
(3)語法解釋:arrayLike(必須)想要轉(zhuǎn)換成數(shù)組的偽數(shù)組對象或可迭代對象;mapFn(可選)如果指定了該參數(shù),新數(shù)組中的每個元素會執(zhí)行該回調(diào)函數(shù);thisArg(可選)執(zhí)行回調(diào)函數(shù) mapFn 時的 this 對象;
(4)返回值:一個新的數(shù)組;
(5)示例代碼:
function fun() {
return Array.from(arguments);
}
const res=fun('tom', 'jery');
console.log(res);// ["tom", "jery"]
const res1=Array.from('test');
console.log(res1);// ["t", "e", "s", "t"]
const res4=Array.from('test',item=>item+2);
console.log(res4);// ["t2", "e2", "s2", "t2"]
const set = new Set(['test', window]);
const res2=Array.from(set);
console.log(res2);// ["test", Window]
const map = new Map([[1, 2], [2, 4], [4, 8]]);
const res3=Array.from(map);
console.log(res3);// [[1, 2], [2, 4], [4, 8]]

10,Array.of()
(1)作用:將任意數(shù)量的參數(shù),按順序組成新數(shù)組;
(2)語法:Array.of(n);
(3)語法解釋:n任意格式的數(shù)據(jù);
(4)返回值:參數(shù)按照順序組成的新數(shù)組;和Array()的區(qū)別,當(dāng)參數(shù)是Number且是>=0的整數(shù)時,Array()默認(rèn)返回對應(yīng)長度的數(shù)組(元素為空),否則報錯;而Array.of()一律將參數(shù)當(dāng)作元素看待。
(5)示例代碼:
const res=Array.of('tom');
console.log(res);// ["tom"]
const res1=Array.of('tom',1,[1,2],{name:'tom'});
console.log(res1);// ["tom", 1, [1, 2], {name: "tom"}]

11,Object.keys(arr)
(1)作用:遍歷數(shù)組的鍵(下標(biāo));
(2)語法:Object.keys(arr);
(3)語法解釋:arr指代某個數(shù)組;
(4)返回值:返回原數(shù)組的鍵(下標(biāo))組成的新數(shù)組;
(5)示例代碼:
const arr1=[1,2,3,4,5,6,7,8,9];
const res1=Object.keys(arr1);
console.log(res1);// ["0", "1", "2", "3", "4", "5", "6", "7", "8"]
let arr2=[];
arr2['name']='tom';
arr2['age']=30;
arr2['female']='man';
const res2=Object.keys(arr2);
console.log(res2);// ["name", "age", "female"]

12,arr.values()
(1)作用:該方法獲取一個數(shù)組迭代器對象,該對象包含數(shù)組中每一個索引的值;
(2)語法:arr.values();
(3)語法解釋:迭代器對象Iterator具有next()方法,可以用來依次調(diào)用它的值;
(4)返回值:返回原數(shù)組的迭代器對象,通過next()方法的value屬性獲取迭代器對象的值;
(5)示例代碼:
const arr=['tom','jery','jack','wilson'];
const res=arr.values();
console.log(res.next().value);// tom
console.log(res.next().value);// jery
console.log(res.next().value);// jack
console.log(res.next().value);// wilson
console.log(res.next().value);// undefined

13,arr.keys()
(1)作用:該方法獲取一個數(shù)組迭代器對象,該對象包含數(shù)組中每一個索引的鍵;
(2)語法:arr.keys();
(3)語法解釋:迭代器對象Iterator具有next()方法,可以用來依次調(diào)用它的值;
(4)返回值:返回原數(shù)組的迭代器對象,通過next()方法的value屬性獲取迭代器對象的值;
(5)示例代碼:
const arr=['tom','jery','jack','wilson'];
const res=arr.keys();
console.log(res.next().value);// 0
console.log(res.next().value);// 1
console.log(res.next().value);// 2
console.log(res.next().value);// 3
console.log(res.next().value);// undefined

14,arr.entries()
(1)作用:該方法獲取一個數(shù)組迭代器對象,該對象包含數(shù)組中每一個索引的鍵值對;
(2)語法:arr.entries();
(3)語法解釋:迭代器對象Iterator具有next()方法,可以用來依次調(diào)用它的值;
(4)返回值:返回原數(shù)組的迭代器對象,通過next()方法的value屬性獲取迭代器對象的值;
(5)示例代碼:
const arr=['tom','jery','jack','wilson'];
const res=arr.entries();
console.log(res.next().value);// [0, "tom"]
console.log(res.next().value);// [1, "jery"]
console.log(res.next().value);// [2, "jack"]
console.log(res.next().value);// [3, "wilson"]
console.log(res.next().value);// undefined

三,不動原數(shù)組,只依據(jù)原數(shù)組進(jìn)行判斷/處理的方法
1,arr.forEach()
(1)作用:遍歷數(shù)組,為每個元素調(diào)用指定的函數(shù);
(2)語法:arr.forEach(function(item,index,arr){arr[index]=item+1;});
(3)語法解釋:item指代元素,index指代下標(biāo),arr指代數(shù)組本身;
(4)返回值:undefined;
(5)示例代碼:
// 示例1.1
const arr=[1,2,3,4,5,6,7,8,9];
let sum=0;
const res=arr.forEach((item)=>{sum+=item});
console.log(res);// undefined
console.log(sum);// 45
// 示例1.2
const res1=arr.forEach((item,index,arr)=>{arr[index]=item+1})
console.log(res1);// undefined
console.log(arr);// [2, 3, 4, 5, 6, 7, 8, 9, 10]
// 示例1.3
const res2=arr.forEach((item)=>{return item+1});
console.log(res2);// undefined
// 示例2
let arr2=[];
arr.forEach((item,index)=>{arr2[index]=item+1});
console.log(arr2);// [2, 3, 4, 5, 6, 7, 8, 9, 10]

2,for
(1)作用:遍歷數(shù)組;
(2)語法:for(let key=0;key<arr.lenth;key++){};
(3)語法解釋:arr指代某個數(shù)組;
(4)返回值:無;
(5)示例代碼:
const arr=[1,2,3,4,5,6,7,8,9];
for(let key=0;key<arr.length;key++){
console.log(arr[key]);
}
// 1
// 2
// 3
// 4
// 5
// 6
// 7
// 8
// 9

3,for...of...
(1)作用:遍歷數(shù)組;
(2)語法:for(let item of arr){};
(3)語法解釋:arr指代數(shù)組,item指代數(shù)組的元素;
(4)返回值:無;
(5)示例代碼:
const arr=[1,2,3,4,5,6,7,8,9];
for(let item of arr){
console.log(item)
}
// 1
// 2
// 3
// 4
// 5
// 6
// 7
// 8
// 9

4,for...in...
(1)作用:遍歷數(shù)組;
(2)語法:for(let key in arr){};
(3)語法解釋:arr指代數(shù)組,key指代數(shù)組的下標(biāo);
(4)返回值:無;
(5)示例代碼:
const arr=[1,2,3,4,5,6,7,8,9];
for(let item of arr){
console.log(item)
}
// 1
// 2
// 3
// 4
// 5
// 6
// 7
// 8
// 9

5,...(spread)
(1)作用:如果函數(shù)需要傳入多個參數(shù)值,但是給定的參數(shù)卻是數(shù)組,函數(shù)無法處理時,可以用...實(shí)現(xiàn)數(shù)組的打散和逐個分配;
(2)語法:function computed(arr){};let arr=[1,2,3];computed(...arr);
(3)語法解釋:arr指代某個數(shù)組;
(4)返回值:無;
(5)示例代碼:
const arr=[1,2,3,4,5,6,7,8,9];
console.log(...arr);// 1 2 3 4 5 6 7 8 9
const res=Math.min(...arr);
console.log(res);// 1
// 分解步驟
function getMin(){
const arrLike=arguments;
let min;
for(let key in arrLike){
if(key===0){
min=arrLike[key]
}else{
min=min<=arrLike[key]?min:arrLike[key];
}
}
return min;
}
const res1 = getMin(...arr);
console.log(res1);// 1

6,arr.indexOf()
(1)作用:搜索整個數(shù)組中是否有給定的值;
(2)語法:arr.indexOf(n) || arr.lastIndexOf(n);
(3)語法解釋:n代表某個元素值;
(4)返回值:返回找到的第一個元素的索引,如果沒找到,返回-1;indexOf從前往后找,lastIndexOf從后往前找;
(5)示例代碼:
const arr=['tom','jery','tom','jack'];
const res1=arr.indexOf('tom');
console.log(res1);// 0
const res2=arr.lastIndexOf('tom')
console.log(res2);// 2
const res3=arr.indexOf('kity')
console.log(res3);// -1

7,arr.every()和arr.some()
(1)作用:對數(shù)組元素應(yīng)用指定的函數(shù)進(jìn)行判定,判定是否符合條件;
(2)語法:arr.every(function(item){return item<n}),arr.some(function(item){return item<n});
(3)語法解釋:<n是某判斷條件;every要求所有元素符合條件,some只要求最少有一個元素符合要求
(4)返回值:返回true或者false;
(5)示例代碼:
const arr=[1,2,3,4,5,6,7,8,9];
const res=arr.every((item)=>{return item<10});
console.log(res);// true
const res1=arr.every((item)=>{return item<8});
console.log(res1);// false
const res2=arr.some((item)=>{return item <8});
console.log(res2);// true
const res3=arr.some((item)=>{return item >10});
console.log(res3);// false

8,Array.isArray()
(1)判斷一個數(shù)據(jù)是否是數(shù)組格式;
(2)語法:Array.isArray();
(3)語法解釋:n是一個待判斷的數(shù)據(jù);
(4)返回值:布爾值;
(5)示例代碼:
const data1=[1,2,3,,4,5,6];
const data2={name:'tom',age:30};
const data3='tom';
const res1=Array.isArray(data1);
console.log(res1);// true
const res2=Array.isArray(data2);
console.log(res2);// false
const res3=Array.isArray(data3);
console.log(res3);// false

9,arr.includes()
(1)作用:判斷一個數(shù)組中是否包含一個指定的值;
(2)語法:arr.includes(n);
(3)語法解釋:n某個指定的值;
(4)返回值:布爾值;
(5)示例代碼:
const arr=['中國','日本','韓國'];
const res1=arr.includes('中國');
console.log(res1);// true
const res2=arr.includes('china');
console.log(res2);// false

10,arr.findIndex();
(1)作用:判斷數(shù)組內(nèi)是否有符合條件的元素,并返回這個元素的下標(biāo);
(2)語法:arr.findIndex(function(item,index,arr){return item<9});
(3)語法解釋:item數(shù)組元素,index數(shù)組下標(biāo),arr數(shù)組本身;
(4)返回:返回?cái)?shù)組內(nèi)通過判斷的第一個元素的下標(biāo),若找不到返回-1;空數(shù)組不執(zhí)行函數(shù);
和arr.indexOf(n)的區(qū)別:indexOf直接檢查某個數(shù)組是否包含某個元素,findIndex是判斷數(shù)組內(nèi)是否有符合條件的元素,后者功能更豐富,但是前者更簡潔;另外,借助Object.is后者可以判斷NaN,前者不可以。
(5)示例代碼:
const arr=[1,2,3,4,5,6,7,8,9];
const res=arr.findIndex((item)=>{return item<4})
console.log(res);// 0
const arr1=[{name:'tom',age:30},{name:'jery',age:35}];
const res1=arr1.findIndex((item)=>{return item.name==='tom'});
console.log(res1);// 0
const res2=arr1.findIndex((item)=>{return item.name==='tomBro'});
console.log(res2);// -1
// indexOf方法不能判定NaN
const res3=[NaN].indexOf(NaN);
console.log(res3);// -1
// finIndex借助Object.is方法可以判斷NaN
const res4=[NaN].findIndex(y => Object.is(NaN, y));
console.log(res4);// 0
