JavaScript 最常用的數(shù)組方法大全

1、push

語法:array.push(item1, item2, …, itemX)哀卫;
功能:push( )方法:可以將一個(gè)或者更多的參數(shù)添加在數(shù)組的尾部;返回添加后的數(shù)組的長度躁锁,原數(shù)組發(fā)生改變拄显。;
代碼示例:

var arr=[1,2,3,4];
var a=arr.push(9,8,7);
console.log(a,arr);//1,2,3,4,9,8,7矢渊;

2继准、unshift

語法:array.unshift(item1,item2, …, itemX);
功能:unshift( )方法:可以將一個(gè)或者更多的參數(shù)添加在數(shù)組的頭部矮男;返回添加后的數(shù)組的長度移必,原數(shù)組發(fā)生改變。毡鉴;
代碼示例:

var arr=[1,2,3,4];
var a=arr.unshift(9,8,7);
console.log(a,arr);//9,8,7,1,2,3,4崔泵;

3、 pop

語法:array.pop()猪瞬;
功能:pop( )方法:從數(shù)組尾部刪除一個(gè)元素憎瘸,返回這個(gè)被刪除的元素,原數(shù)組發(fā)生改變陈瘦。幌甘;
代碼示例:

var arr=[1,2,3,4];
var a=arr.pop();
console.log(a,arr)//4;1,2,3痊项,

4锅风、 shift

語法:array.shift();
功能:shift( ) 方法:從數(shù)組頭部刪除一個(gè)元素线婚,返回這個(gè)被刪除的元素遏弱,原數(shù)組發(fā)生改變。塞弊;
代碼示例:

var arr = [1,2,3,4];
var a = arr.shift();
console.log(a,arr)//1漱逸;2,3,4,

5游沿、 slice

語法:array.slice(start, end)饰抒;
功能:slice()方法:如果不傳參數(shù),會(huì)返回原數(shù)組诀黍;如果一個(gè)參數(shù)袋坑,從該參數(shù)表示的索引開始截取,直至數(shù)組結(jié)束眯勾,返回這個(gè)截取數(shù)組枣宫,原數(shù)組不變婆誓;
兩個(gè)參數(shù),從第一個(gè)參數(shù)對(duì)應(yīng)的索引開始截取也颤,到第二個(gè)參數(shù)對(duì)應(yīng)的索引結(jié)束洋幻,但包括第二個(gè)參數(shù)對(duì)應(yīng)的索引上值,原數(shù)組不改變 &最多接受兩個(gè)參數(shù)翅娶。文留;
代碼示例:

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(1,3);
console.log(citrus )//Orange,Lemon

6、 splice

語法:array.splice(index,howmany,item1,…,itemX)竭沫;
功能:splice( ) 方法:沒有參數(shù)燥翅,返回空數(shù)組,原數(shù)組不變蜕提;
一個(gè)參數(shù)森书,從該參數(shù)表示的索引位開始截取,直至數(shù)組結(jié)束贯溅,返回截取的 數(shù)組拄氯,原數(shù)組改變;
兩個(gè)參數(shù)它浅,第一個(gè)參數(shù)表示開始截取的索引位,第二個(gè)參數(shù)表示截取的長度镣煮,返回截取的 數(shù)組姐霍,原數(shù)組改變;
三個(gè)或者更多參數(shù)典唇,第三個(gè)及以后的參數(shù)表示要從截取位插入的值镊折。;
代碼示例:

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2,2);
console.log(fruits )//Banana,Orange

7介衔、 reverse

語法:array.reverse()恨胚;
功能:reverse( )方法:用于顛倒數(shù)組中元素的順序。炎咖;
代碼示例:

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.reverse();
console.log(fruits)//Mango,Apple,Orange,Banana

8赃泡、 sort

語法:array.sort(sortfunction);
功能:sort( ) 方法:用于對(duì)數(shù)組的元素進(jìn)行排序乘盼。升熊;
代碼示例:

var Array = [1,2,3,4,5];
var fruits = Array.sort(function(a,b){
    //return a - b; //從小到大
    return b-a; //從大到小
})
console.log(fruits);//5,4,3,2,1

9、 join

語法:array.join(separator)绸栅;
功能:join( ) 方法:于把數(shù)組中的所有元素轉(zhuǎn)換一個(gè)字符串,元素是通過指定的分隔符進(jìn)行分隔的级野。;
代碼示例:

var arr = [1,2,3,4]
var bbc = arr.join()
console.log(bbc)//1,2,3,4

9.1粹胯、 split()

語法:
功能:split 方法用于將字符串分割成數(shù)組蓖柔,類似join方法的反函數(shù)辰企。
代碼示例:

let price = "99,78,68";
console.log(price.split(",")); //["99", "78", "68"]

10、 concat

語法:string.concat(string1, string2, …, stringX)
功能:concat( ) 方法:屬于字符串的方法况鸣,數(shù)組也可以用蟆豫,接受一個(gè)或多個(gè)參數(shù),將參數(shù)中的值放到操作的數(shù)組后邊懒闷,返回拼接的數(shù)組十减,原數(shù)組不變。如果參數(shù)是一個(gè)數(shù)組愤估,則先把值提取出來再操作帮辟。;
代碼示例:

var arr = [1,2,3,4];
arr.concat([5,6,7])//[1,2,3,4,5,6,7]

11玩焰、 indexOf()

語法:string.indexOf(searchvalue,start)由驹;
功能:indexOf( ) 方法:字符串的方法,數(shù)組也可適用昔园,此方法可返回某個(gè)指定的字符串值在字符串中首次出現(xiàn)的位置蔓榄;若一個(gè)參數(shù),返回這個(gè)參數(shù)在數(shù)組里面的索引值默刚,如果參數(shù)不在操作的數(shù)組中甥郑,則返回 -1。荤西;
代碼示例:

let arr = [7, 3, 2, 8, 2, 6];
console.log(arr.indexOf(2)); // 2 從前面查找2出現(xiàn)的位置
let arr2 = [7, 3, 2, 8, 2, 6];
//從第二個(gè)元素開始向后查找
console.log(arr2.indexOf(2, 3)); //4

12澜搅、 lastIndexOf()

語法:array.lastIndexOf(item,start);
功能:使用 lastIndexOf 從后向前查找元素出現(xiàn)的位置邪锌,如果找不到返回 -1勉躺。;
代碼示例:

let arr = [7, 3, 2, 8, 2, 6];
console.log(arr.lastIndexOf(2)); // 4 從后查找2出現(xiàn)的位置
let arr2 = [7, 3, 2, 8, 2, 6];
//從第五個(gè)元素向前查找
console.log(arr2.lastIndexOf(2, 5));
//從最后一個(gè)字符向前查找
console.log(arr2.lastIndexOf(2, -2));

13觅丰、 forEach()

語法:array.forEach(function(currentValue, index, arr), thisValue)饵溅;
功能:forEach( ) 方法:數(shù)組遍歷,且只能夠遍歷數(shù)組妇萄,不接受返回值或返回值為 undefined蜕企。;
代碼示例:

var arr = [1,2,3,4,5];
arr.forEach((item,index,arr)=>{
    //item 為當(dāng)前數(shù)組元素
    // index 為當(dāng)前索引
    // arr 為數(shù)組名字
})

14嚣伐、 for/in()

語法:for (key in object) {執(zhí)行的代碼塊}糖赔;
功能:for/in 語句用于循環(huán)對(duì)象屬性,遍歷時(shí)的 key 值為數(shù)組的索引。轩端;
代碼示例:

let lessons = [
    {title: '媒體查詢響應(yīng)式布局',category: 'css'},
    {title: 'FLEX 彈性盒模型',category: 'css'},
    {title: 'MYSQL多表查詢隨意操作',category: 'mysql'}
];
for (let key in lessons) {
  console.log('標(biāo)題:'+ lessons[key].title +';分類:'+ lessons[key].category);
}

14放典、 for/of()

語法:for (value in object) {執(zhí)行的代碼塊};
功能:與 for/in 不同的是 for/of 每次循環(huán)取其中的值而不是索引。奋构;
代碼示例:

for (let value of lessons) {
    // console.log(value);
     console.log('標(biāo)題:'+ value.title +';分類:'+ value.category);
}

15壳影、 map()

語法:array.map(function(currentValue,index,arr), thisValue);
功能:map( ) 方法:數(shù)組的遍歷弥臼,用來接收一個(gè)返回值宴咧,創(chuàng)建一個(gè)新數(shù)組,不改變?cè)瓟?shù)組.
代碼示例:

var arr = [1,2,3,4,5,6];
arr.map(function(item,index,arr){
    return item * 2
})
//輸出 [2,4,6,8,10,12]

16径缅、 some()

語法:array.some(function(currentValue,index,arr),thisValue)掺栅;
功能:some( ) 方法:檢測(cè)數(shù)組中是否含有某一個(gè)值,返回一個(gè)布爾值纳猪,如果數(shù)組中有任意一個(gè)元素滿足給定的條件氧卧,結(jié)果就為 true否則則為false。氏堤;
代碼示例:

var ages = [3, 10, 18, 20];
function checkAdult(age) {
    return age >= 18;
}
function myFunction() {
    document.getElementById("demo").innerHTML = ages.some(checkAdult);
}
//輸出結(jié)果為:true
})

17沙绝、 filter()

語法:array.filter(function(currentValue,index,arr), thisValue);
功能:filter( ) 方法:過濾出一些符合條件的元素鼠锈,返回一個(gè)新數(shù)組闪檬。;
代碼示例:

var ages = [32, 33, 16, 40];
function checkAdult(age) {
    return age >= 18;
    //返回?cái)?shù)組 ages 中所有元素都大于 18 的元素:
}
function myFunction() {
    document.getElementById("demo").innerHTML = ages.filter(checkAdult);
}
//輸出結(jié)果為:32,33,40

18购笆、 every()

語法:array.every(function(currentValue,index,arr), thisValue)粗悯;
功能:every( ) 方法:方法用于檢測(cè)數(shù)組所有元素是否都符合指定條件(通過函數(shù)提供),返回一個(gè)布爾值,結(jié)果為 true或false。由桌;
代碼示例:

var ages = [32, 33, 16, 40];
function checkAdult(age) {
    return age >= 18;
    //檢測(cè)數(shù)組 ages 的所有元素是否都大于等于 18 
}
function myFunction() {
    document.getElementById("demo").innerHTML = ages.every(checkAdult);
}
//輸出結(jié)果為:false

19为黎、 reduce()

語法:array.reduce(function(total, currentValue, currentIndex, arr), initialValue);
功能:reduce( ) 方法:對(duì)數(shù)組中的所有元素調(diào)用指定的回調(diào)函數(shù)行您,該回調(diào)函數(shù)的返回值為累計(jì)結(jié)果。并且把返回值在下一次回調(diào)函數(shù)時(shí)作為參數(shù)提供剪廉。娃循;
代碼示例:

var numbers = [65, 44, 12, 4];
function getSum(total, num) {
    return total + num;
    //計(jì)算數(shù)組相加的總和
}
function myFunction(item) {
    document.getElementById("demo").innerHTML = numbers.reduce(getSum);
}
//輸出結(jié)果為:125

20、 Array.from( )

語法:Array.from(arrayLike[, mapFn[, thisArg]])斗蒋;
功能:Array.from( ) 方法:將類數(shù)組對(duì)象或可迭代對(duì)象轉(zhuǎn)化為數(shù)組捌斧,比如arguments,js選擇器找到dom集合和對(duì)象模擬的數(shù)組泉沾。捞蚂;
代碼示例:

// 參數(shù)為數(shù)組,返回與原數(shù)組一樣的數(shù)組
console.log(Array.from([1, 2])); // [1, 2] 
// 參數(shù)含空位
console.log(Array.from([1, , 3])); // [1, undefined, 3]

21、 Array.of( )

語法:Array.of(element0[, element1[, ...[, elementN]]])跷究;
功能:Array.of( ) 方法:數(shù)組創(chuàng)建姓迅,將參數(shù)中所有值作為元素形成數(shù)組,如果參數(shù)為空,則返回一個(gè)空數(shù)組丁存。肩杈;
代碼示例:

console.log(Array.of(1, 2, 3, 4)); // [1, 2, 3, 4] 
// 參數(shù)值可為不同類型
console.log(Array.of(1, '2', true)); // [1, '2', true] 
// 參數(shù)為空時(shí)返回空數(shù)組
console.log(Array.of()); // []

22、 find( )

語法:array.find(function(currentValue, index, arr),thisValue)解寝;
功能:find( ) 方法:查找數(shù)組中符合條件的元素,若有多個(gè)符合條件的元素扩然,則返回第一個(gè)元素;返回第一次找到的值,不繼續(xù)查找;如果找不到返回值為undefined聋伦。夫偶;
代碼示例:

let arr = Array.of(1, 2, 3, 4);
console.log(arr.find(item => item > 2)); // 3 
// 數(shù)組空位處理為 undefined
console.log([, 1].find(n => true)); // undefined

23、 findIndex( )

語法:array.findIndex(function(currentValue, index, arr), thisValue)觉增;
功能:findIndex( ) 方法:查找數(shù)組中符合條件的元素索引兵拢,若有多個(gè)符合條件的元素,則返回第一個(gè)元素索引抑片。卵佛;
代碼示例:

let arr = Array.of(1, 2, 1, 3);
// 參數(shù)1:回調(diào)函數(shù)
// 參數(shù)2(可選):指定回調(diào)函數(shù)中的 this 值
console.log(arr.findIndex(item => item = 1)); // 0
// 數(shù)組空位處理為 undefined
console.log([, 1].findIndex(n => true)); //0

24、 includes( )

語法:string.includes(searchvalue, start)敞斋;
功能:includes( ) 方法:檢測(cè)數(shù)組中是否包含一個(gè)值;與 Set 和 Map 的 has 方法區(qū)分截汪;Set 的 has 方法用于查找值;Map 的 has 方法用于查找鍵名植捎。衙解;
代碼示例:

// 參數(shù)1:包含的指定值
[1, 2, 3].includes(1);    // true
// 參數(shù)2:可選,搜索的起始索引焰枢,默認(rèn)為0
[1, 2, 3].includes(1, 2); // false
// NaN 的包含判斷
[1, NaN, 3].includes(NaN); // true

25蚓峦、fill( )

語法:array.fill(value, start, end) ;
功能:fill( ) 方法:將一定范圍索引的數(shù)組元素內(nèi)容填充為單個(gè)指定的值济锄。暑椰;
代碼示例:

let arr = Array.of(1, 2, 3, 4);
// 參數(shù)1:用來填充的值
// 參數(shù)2:被填充的起始索引
// 參數(shù)3(可選):被填充的結(jié)束索引,默認(rèn)為數(shù)組末尾
console.log(arr.fill(0,1,2)); // [1, 0, 3, 4]

26荐绝、keys( )

語法:array.keys() 一汽;
功能:keys( ) 方法:遍歷鍵名。
代碼示例:

for(let key of ['a', 'b'].keys()){
    console.log(key);
}
// 0
// 1 
// 數(shù)組含空位
console.log([...[,'a'].keys()]); // [0, 1]

27低滩、values( )

語法:array.values() 召夹;
功能:*values( ) 方法:遍歷鍵值。恕沫;
代碼示例:

for(let value of ['a', 'b'].values()){
    console.log(value);
}
// "a"
// "b"
// 數(shù)組含空位
console.log([...[,'a'].values()]); // [undefined, "a"]

28监憎、entries( )

語法:array.entries() ;
功能:*entries( ) 方法:遍歷鍵值對(duì)婶溯。鲸阔;
代碼示例:

for(let [key, value] of ['a', 'b'].entries()){
    console.log(key, value);
}
// 0 "a"
// 1 "b" 
// 不使用 for... of 循環(huán)
let entries = ['a', 'b'].entries();
console.log(entries.next().value); // [0, "a"]
console.log(entries.next().value); // [1, "b"]
 
// 數(shù)組含空位
console.log([...[,'a'].entries()]); // [[0, undefined], [1, "a"]]
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末偷霉,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子隶债,更是在濱河造成了極大的恐慌腾它,老刑警劉巖,帶你破解...
    沈念sama閱讀 206,378評(píng)論 6 481
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件死讹,死亡現(xiàn)場(chǎng)離奇詭異瞒滴,居然都是意外死亡,警方通過查閱死者的電腦和手機(jī)赞警,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 88,356評(píng)論 2 382
  • 文/潘曉璐 我一進(jìn)店門妓忍,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人愧旦,你說我怎么就攤上這事世剖。” “怎么了笤虫?”我有些...
    開封第一講書人閱讀 152,702評(píng)論 0 342
  • 文/不壞的土叔 我叫張陵旁瘫,是天一觀的道長。 經(jīng)常有香客問我琼蚯,道長酬凳,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 55,259評(píng)論 1 279
  • 正文 為了忘掉前任遭庶,我火速辦了婚禮宁仔,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘峦睡。我一直安慰自己翎苫,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 64,263評(píng)論 5 371
  • 文/花漫 我一把揭開白布榨了。 她就那樣靜靜地躺著煎谍,像睡著了一般。 火紅的嫁衣襯著肌膚如雪龙屉。 梳的紋絲不亂的頭發(fā)上粱快,一...
    開封第一講書人閱讀 49,036評(píng)論 1 285
  • 那天,我揣著相機(jī)與錄音叔扼,去河邊找鬼。 笑死漫雷,一個(gè)胖子當(dāng)著我的面吹牛瓜富,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播降盹,決...
    沈念sama閱讀 38,349評(píng)論 3 400
  • 文/蒼蘭香墨 我猛地睜開眼与柑,長吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起价捧,我...
    開封第一講書人閱讀 36,979評(píng)論 0 259
  • 序言:老撾萬榮一對(duì)情侶失蹤丑念,失蹤者是張志新(化名)和其女友劉穎,沒想到半個(gè)月后结蟋,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體脯倚,經(jīng)...
    沈念sama閱讀 43,469評(píng)論 1 300
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 35,938評(píng)論 2 323
  • 正文 我和宋清朗相戀三年嵌屎,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了推正。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 38,059評(píng)論 1 333
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡宝惰,死狀恐怖植榕,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情尼夺,我是刑警寧澤尊残,帶...
    沈念sama閱讀 33,703評(píng)論 4 323
  • 正文 年R本政府宣布,位于F島的核電站淤堵,受9級(jí)特大地震影響寝衫,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜粘勒,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,257評(píng)論 3 307
  • 文/蒙蒙 一竞端、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧庙睡,春花似錦事富、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,262評(píng)論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至啡邑,卻和暖如春贱勃,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背谤逼。 一陣腳步聲響...
    開封第一講書人閱讀 31,485評(píng)論 1 262
  • 我被黑心中介騙來泰國打工贵扰, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人流部。 一個(gè)月前我還...
    沈念sama閱讀 45,501評(píng)論 2 354
  • 正文 我出身青樓戚绕,卻偏偏與公主長得像,于是被迫代替她去往敵國和親枝冀。 傳聞我的和親對(duì)象是個(gè)殘疾皇子舞丛,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 42,792評(píng)論 2 345

推薦閱讀更多精彩內(nèi)容