Javascript數(shù)組常用方法你都知道嗎
我用這些方法主要從五個(gè)方面去學(xué)習(xí)。
1.方法是干什么的。
2.誰(shuí)能用 (當(dāng)然是數(shù)組啦)。
3.有沒(méi)有返回值,返回值是什么。
4.修不修改原來(lái)的對(duì)象。
5.如何使用。
接下來(lái)就是干貨了。
1.push 向數(shù)組內(nèi)添加一個(gè)或多個(gè)元素,添加到數(shù)組的最后面,方法返回值是新數(shù)組的長(zhǎng)度。
arr.push(200) arr.push(200,2,32)
2.pop 刪除數(shù)組末尾的一個(gè)元素,不需要傳參,方法返回值是被刪除的元素 。
arr.pop()
3.unshift 向數(shù)組中添加一個(gè)或多個(gè)元素,添加到最前面,返回值是新數(shù)組的長(zhǎng)度。
arr.unshift(1)arr.unshift(1,2)arr.unshift(1) arr.unshift(1,2)
4.shift 刪除數(shù)組最前面的一個(gè)元素 返回值是被刪除的元素。
arr.shift()
5. concat 拼接兩個(gè)數(shù)組,返回拼接后的數(shù)組,原數(shù)組不變。
let arr1 = [1,2] let arr2 = [2,3] arr1.concat(arr2) console.log(arr1); // [1,2] console.log(arr1.concat(arr2)); // [1,2,2,3]
6. reverse 數(shù)組顛倒,返回顛倒后的數(shù)組,原數(shù)組改變。
arr.reverse()
7.slice 數(shù)組的截取,包括開(kāi)頭,不包括結(jié)尾,返回截取后的數(shù)組,原數(shù)組不變。
let arr = [1,2,3,4,5,6] // 填兩個(gè)參數(shù) a,b 從a截取到b 不包括b // 填一個(gè)參數(shù) a 從a截取到末尾 // 不填參數(shù) 從0截取到最后 //截取arr 里面的 3-5 也就是數(shù)組下標(biāo)2-4 但是第二個(gè)參數(shù)不包括 所以就是 2-5 arr.slice(2,5)
8.splice 數(shù)組的添加或者刪除,返回被刪除的元素組成的數(shù)組,原數(shù)組改變。
//用法 splice(a,b,c) //a 表示添加或者刪除的開(kāi)始的下標(biāo) //b 表示刪除的個(gè)數(shù) 不想刪除只想添加 b寫(xiě)成0 //c 表示添加的元素 添加的元素可以是多個(gè) c,d,e 不添加就不用寫(xiě)c var arr = [1,2,3,4,5,6] // 把4刪除 換成10 arr.splice(3,1,10)
9.join 將數(shù)組內(nèi)的所有元素以某個(gè)值進(jìn)行字符串拼接,默認(rèn)是以 , 拼接。返回值是拼接的字符串,原數(shù)組不變。
let arr = [1,2,3,4,5,6] arr.join() arr.join('-')
10.indexOf 檢測(cè)數(shù)組中是否存在某個(gè)元素 ,存在的話返回第一次找到的下標(biāo),不存在返回 -1,原數(shù)組不變。
let arr = [1,2,3,4,5,6] let ind = arr.indexOf(5)
11.lastIndexOf 和 indexOf用法一樣,從數(shù)組后面開(kāi)始找。
12.includes 檢測(cè)數(shù)組中是否存在某個(gè)元素 存在返回 true 不出在返回false 用法和indexOf一樣。
13.sort 對(duì)數(shù)組進(jìn)行排序,返回排序后的數(shù)組,原數(shù)組改變。
// 漢字看筆畫(huà) 英文字母看因?yàn)樽帜疙樞? // 默認(rèn)排序是按照首字符的順序開(kāi)始排序的 let arr = [2,3,5,4,9,6] arr.sort() //sort可以寫(xiě)函數(shù) // a,b 代表的就是數(shù)組中相鄰的兩個(gè)數(shù) // 從小到大排 arr.sort(function(a,b){ return a - b })
14.every 檢測(cè)數(shù)組內(nèi)的所有元素是否滿足某個(gè)條件, 有一個(gè)必須參數(shù),返回值是布爾值。
let arr = [100,15,50,110] let myarr = arr.every(function(el){ return el>14 }) console.log(myarr) //true
15.some 檢測(cè)數(shù)組內(nèi)是否有元素滿足某個(gè)條件,有一個(gè)必須參數(shù),返回值是布爾值。
var arr = [100,15,50,110] var myarr1 = arr.some(function(el){ return el>100 }) console.log(myarr1) //true
16.find 返回?cái)?shù)組中匹配的 第一個(gè)元素 的值,沒(méi)有返回 undefined,有一個(gè)必須參數(shù)。
var arr = [100,15,50,110] var myarr2 = arr.find(function(el){ return el > 10 }) console.log(myarr2) // 100
17.findIndex 方法同find 返回值是對(duì)應(yīng)的索引值。
18.filter 返回符合條件的元素形成一個(gè)新數(shù)組 ,返回值是一個(gè)數(shù)組
var arr = [100,15,8,50,110] var myarr3 = arr.filter(function(el){ return el<18 }) console.log(myarr3) //[15,8]
19.map 創(chuàng)建一個(gè)數(shù)組,該數(shù)組中每個(gè)元素是調(diào)用過(guò)函數(shù)之后返回的值。
var arr = [100,15,8,50,110] var arr5 = arr.map(function(el){ return el*1+5 }) console.log(arr5); //[105, 20, 13, 55, 115]
20.reduce 用這個(gè)方法可以實(shí)現(xiàn)以上的所有方法 比如數(shù)組內(nèi)數(shù)累加,返回值是單個(gè)數(shù)
// reduce(函數(shù),最終結(jié)果的初始值) // 每次遍歷的函數(shù),有四個(gè)參,每次查詢(xún)數(shù)組的元素時(shí)執(zhí)行的函數(shù) // function(res,ele,index,array) // res 結(jié)果變量 // ele 數(shù)組內(nèi)元素 // index 對(duì)應(yīng)的索引 // array 原數(shù)組 // 必須設(shè)置返回值,上一次返回的值是res的值,最后返回值是最終結(jié)果,也是reduce函數(shù)的返回值。 let arr = [100,15,8,50,110] // res 是自己創(chuàng)的累加器 ele是當(dāng)前值 let total = arr.reduce(function(res,ele){ return res + ele },0)
總結(jié)
本篇文章就到這里了,希望能夠給你帶來(lái)幫助,也希望您能夠多多關(guān)注腳本之家的更多內(nèi)容!
相關(guān)文章
使用JS調(diào)用工控機(jī)(Windows)虛擬鍵盤(pán)
在工控機(jī)觸摸屏中,通過(guò)瀏覽器web端進(jìn)行表單輸入,當(dāng)聚焦表單輸入框并不會(huì)出現(xiàn)虛擬鍵盤(pán)進(jìn)行輸入,本文介紹將給大家介紹如何通過(guò)js調(diào)用工控機(jī)(Windows)虛擬鍵盤(pán),文中通過(guò)代碼示例介紹的非常詳細(xì),需要的朋友可以參考下2024-01-01javascript在myeclipse中報(bào)錯(cuò)的解決方法
jqueryjQueryJQUERYJqueryJQueryjquery報(bào)錯(cuò)jsJSJsmyeclipseMyEclipseMyeclipse,很多朋友應(yīng)該都會(huì)遇到過(guò)這個(gè)情況吧,按照下面的步驟便可迎刃而解2013-10-10詳解ES6 擴(kuò)展運(yùn)算符的使用與注意事項(xiàng)
擴(kuò)展運(yùn)算符 (spread syntax) 是 ES6 提供的一種非常便捷的新語(yǔ)法,給我們操作數(shù)組和對(duì)象帶來(lái)了非常大的便利,我在很多文章中也提到了這個(gè)語(yǔ)法。但是其實(shí)擴(kuò)展運(yùn)算符的用法還是比較多比較雜的,我用一篇文章來(lái)做一下總結(jié),梳理一下擴(kuò)展運(yùn)算的語(yǔ)法和使用細(xì)節(jié)。2020-11-11JS實(shí)現(xiàn)根據(jù)數(shù)組對(duì)象的某一屬性排序操作示例
這篇文章主要介紹了JS實(shí)現(xiàn)根據(jù)數(shù)組對(duì)象的某一屬性排序操作,涉及javascript針對(duì)json數(shù)組的遍歷、比較、排序等相關(guān)操作技巧,需要的朋友可以參考下2019-01-01js prototype深入理解及應(yīng)用實(shí)例分析
這篇文章主要介紹了js prototype深入理解及應(yīng)用,結(jié)合實(shí)例形式分析了JavaScript prototype屬性功能、原理、使用方法及操作注意事項(xiàng),需要的朋友可以參考下2019-11-11javascript 獲取url參數(shù)和script標(biāo)簽中獲取url參數(shù)函數(shù)代碼
不要在方法中調(diào)用方法,否則可能始終獲取的是最后一個(gè)js的文件的參數(shù),要在方法中使用,請(qǐng)先用變量保存,在方法中直接獲取2010-01-01js實(shí)現(xiàn)input的賦值小結(jié)
這篇文章主要介紹了js實(shí)現(xiàn)input的賦值問(wèn)題小結(jié),在實(shí)際的開(kāi)發(fā)中,為了頁(yè)面的美觀,可能用到一些框架,比如EasyUI框架,文中介紹了easyui的input框賦值代碼,感興趣的朋友一起看看吧2023-12-12