js--常用的Array數(shù)組方法

  • 關(guān)于數(shù)組長(zhǎng)度:

  • 如果為一個(gè)數(shù)組元素賦值,它的索引 i 大于或等于現(xiàn)有數(shù)組的長(zhǎng)度時(shí),length的值會(huì)自動(dòng)設(shè)置為 i+1

  • 設(shè)置length為一個(gè)小于當(dāng)前長(zhǎng)度的非負(fù)整數(shù) n 時(shí),那些索引值大于或等于 n 的元素將從中刪除

  • 添加數(shù)組元素:

  • push():在末尾添加,length+1

  • a.unshift():在頭部添加,length+1

  • a[a.length]:在末尾添加,length+1

  • 刪除數(shù)組元素:

  • pop():在末尾刪除,length-1

  • shift():在頭部刪除,length-1,并且被刪后面的元素自動(dòng)往前挪

  • 直接指定length為更小的值,則索引大于等于length的部分被切除,即使后面再將length改回來,也無法找回?cái)?shù)據(jù),均為undefined

  • splice():可插入,刪除,替換,會(huì)根據(jù)需要修改length的值,并移動(dòng)元素到更高或更低的索引處

  • delete:可以刪除某個(gè)數(shù)組元素,刪除后用undefined占位,不會(huì)移動(dòng)其他元素,length不會(huì)自動(dòng)改變

數(shù)組方法:
改變?cè)瓟?shù)組:
  1. pop()
  2. push()
  3. shift()
  4. unshift():以上,都是返回添加或刪除的單個(gè)元素
  5. reverse():返回位置逆序數(shù)組,非大小逆序
  • undefined也會(huì)參與逆序占位,并輸出
  1. sort():返回排序后的數(shù)組
  • 默認(rèn)是按字母表排序
  • 傳入回調(diào)函數(shù)時(shí),假設(shè)第一個(gè)參數(shù)應(yīng)該在前,就要返回一個(gè)大于0的數(shù)值,所以按從小到大排序時(shí):function(a,b){return a-b }
  • undefined會(huì)被排在最后,也會(huì)占位輸出
  1. splice():返回被刪除的片段
不改變?cè)瓟?shù)組:
  1. concat():a.concat([4,5]),返回拼接后的新數(shù)組
  2. slice():參數(shù)start,end,包前不包后,返回被切除的片段。參數(shù)可以為負(fù),此時(shí)實(shí)際的索引值為用長(zhǎng)度加上該負(fù)值以后的值,如果start小于end,則返回空數(shù)組。
  • 例: 長(zhǎng)度為5的數(shù)組,slice(-2,-1),實(shí)際指的是slice(3,4)
  1. filter():【跳過undefined的值,輸出時(shí)去除空缺】需要回調(diào)函數(shù)function(value)將每個(gè)元素值傳入,經(jīng)過一系列判斷,如果返回值為true或能轉(zhuǎn)化為true的值,則將其添加到新數(shù)組中,返回新數(shù)組。
  • 應(yīng)用:a.filter(function(x){return true})可以去除數(shù)組中的undefined值,但不能去除null,如果要去除null,需要再回調(diào)函數(shù)里進(jìn)一步判斷。
  1. forEach():【不會(huì)處理undefined的值】需要回調(diào)函數(shù)function(value元素值,index下標(biāo),arr數(shù)組本身),返回值始終為undefined,循環(huán)過程中無法停止
  2. map():【不會(huì)處理undefined的值,即不傳入回調(diào)函數(shù)處理,但輸出時(shí)保留空缺】需要回調(diào)函數(shù)function(value元素值,index下標(biāo),arr數(shù)組本身)},返回一個(gè)新數(shù)組,其中每一個(gè)下標(biāo)的值為原數(shù)組經(jīng)過回調(diào)函數(shù)處理后return的相應(yīng)值,原來的undefined會(huì)在新數(shù)組中繼續(xù)占位。
  • 應(yīng)用舉例:
  • a = [4, 5, 6, undefined × 1, 99, undefined × 2] a.map(function(x){if(x === undefined){console.log("uuu")}else{return x*x }}) 運(yùn)行結(jié)果:輸出:[16, 25, 36, undefined × 1, 9801, undefined × 2] 原數(shù)組a的值不變
  • 與forEach比較:
  • a.forEach(function(x){if(x === undefined){console.log("uuu")}else{return x*x }}) 運(yùn)行結(jié)果:輸出:undefined,數(shù)組a的值也不變
  • 比較結(jié)果:兩者都不會(huì)處理undefined,forEach不會(huì)提前返回,函數(shù)返回值永遠(yuǎn)是Undefined,map永遠(yuǎn)返回一個(gè)數(shù)組,數(shù)組中的元素是回調(diào)函數(shù)里面return的值,原來undefined的值還會(huì)在新數(shù)組中原地占位。
  1. reduce():【不會(huì)處理undefined的值】需要回調(diào)函數(shù)function callbackfn(previousValue, currentValue, currentIndex, array1),每次傳入兩個(gè)元素值,經(jīng)過一系列化簡(jiǎn)處理,最終得到一個(gè)值,返回。應(yīng)用舉例:累加
  • 函數(shù)完整參數(shù):array1.reduce(callbackfn[, initialValue])
  1. every():【也不處理undefined的值】有回調(diào),檢查是否每個(gè)value都滿足回調(diào)函數(shù)返回true,否則返回false

  2. some():有回調(diào),只要有一個(gè)value令回調(diào)函數(shù)返回true,則some返回true

  3. find():有回調(diào),返回回調(diào)函數(shù)里面第一個(gè)返回true的value。

    • function isBigEnough(element) { return element >= 15; } [12, 5, 8, 130, 44].find(isBigEnough); // 130
  4. findIndex():有回調(diào),返回回調(diào)函數(shù)里面第一個(gè)返回true的value的index

    • function isBigEnough(element) { return element >= 15; } [12, 5, 8, 130, 44].findIndex(isBigEnough); // index of 3rd element in the Array is returned, it will result in '3'
  5. indexOf():按內(nèi)容查找,返回第一個(gè)找到的index,否則返回-1

  • var a = [2, 9, 9]; a.indexOf(2); // 0 a.indexOf(7); // -1
  1. lastIndexOf():反向搜索,其他同上。
  2. Array.from():將DOM-list和arguments這樣的類數(shù)組轉(zhuǎn)化為數(shù)組,使其可以使用數(shù)組原型上的方法。
  3. Array.entries() : 返回一個(gè)新數(shù)組,里面是多個(gè)子數(shù)組,每個(gè)子數(shù)組的[0]是原數(shù)組的下標(biāo),[1]是原數(shù)組下標(biāo)對(duì)應(yīng)的值.
  • 例如:
    const arr = ['a','b','c'];
    let aaa= arr.entries(); // [[0,'a'],[1,'b'],[2,'c']]

應(yīng)用補(bǔ)充:

  • 利用數(shù)組方法可以實(shí)現(xiàn)數(shù)組的深拷貝:
  • var newArr = arr.slice() // 原理:從index=0開始截取直到結(jié)束,返回一個(gè)新數(shù)組
  • var newArr = arr.concat() // 原理:數(shù)組拼接,返回新數(shù)組
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • Javascript有很多數(shù)組的方法,有的人有W3C的API,還可以去MDN上去找,但是我覺得API上說的不全,M...
    頑皮的雪狐七七閱讀 4,480評(píng)論 0 6
  • 創(chuàng)建數(shù)組 arr.length--- title: js正則表達(dá)式categories: javascriptda...
    angelwgh閱讀 1,463評(píng)論 0 2
  • 由于最近都在freecodecamp上刷代碼,運(yùn)用了很多JavaScript數(shù)組的方法,因此做了一份關(guān)于JavaS...
    2bc5f46e925b閱讀 2,166評(píng)論 0 16
  • 彼此喜歡,就在一起;不小心懷孕,就結(jié)婚……在我的人生中,滿滿的,都是意外。 認(rèn)識(shí)你,是個(gè)意外。 那年秋天,剛剛開學(xué)...
    于小魚歪歪閱讀 159評(píng)論 0 0
  • 今天一妹子來店里買牛肉飯。在我備好食材就要烹制的時(shí)候,她提出要進(jìn)廚房看看我怎么做——當(dāng)然我嚴(yán)(委)厲(婉)拒絕了她...
    十一號(hào)井閱讀 2,255評(píng)論 3 2

友情鏈接更多精彩內(nèi)容