JavaScript基礎整理之數組(一)

原文發佈在:http://blog.xiaofeixu.cn/2017...數組

數組應該是平常開發中最多見的數據結構了,雖然常見,可是卻不必定能優雅地處理好,JavaScript中數組的處理方法不少,各個方法的參數、返回值、是否修改原數組等也容易記混。這些方法雖然都比較簡單,可是初學的時候沒怎麼重視,後來在實際的項目中卻發現,可否靈活地運用這些方法對開發進度仍是有很大的影響的,因此在此整理一下,溫故知新。數據結構

array.slice(a,b)

  • 描述:slice 接受兩個參數:開始和結束的索引值,返回原數組的從a到b的一部分(包含a,不包含b),原數組不發生改變
  • 原數組:不變
  • 返回:原數組的從a到b的一部分(包含a,不包含b)
    能夠將slice用於數組的淺複製
let arr = [1,2,3,4,5];
let arr2 = arr.slice(1,3);
let arr1 = arr.slice();
arr1.push([6])
let arr3 = arr1.slice();
arr3[arr3.length-1].push(7)
console.log(arr)  //[ 1, 2, 3, 4, 5 ]
console.log(arr1) //[ 1, 2, 3, 4, 5, [ 6, 7 ] ]
console.log(arr2) //[ 2, 3 ]
console.log(arr3) ////[ 1, 2, 3, 4, 5, [ 6, 7 ] ]

array.splice(a,b,item1,item2…)

  • 描述:slice 接受三個參數:開始的索引值、要刪除元素的個數、用於代替刪除元素的內容,返回被刪除的元素構成的數組,原數組
  • 原數組:變
  • 返回:被刪除元素構成的數組
let arr = [1,2,3,4,5]
let arr3 = arr.splice(1,2,'m','n','p')
console.log(arr);//[ 1, "m", "n", "p", 4, 5 ]
console.log(arr3);//[ 2, 3 ]

array.concat()

  • 描述:concat 接受一個或多個參數,若參數爲數組,則將該數組與原數組合並,若不爲數組,則將該參數做爲原數組的一個元素
  • 原數組:不變
  • 返回:合併後的新數組
let arr = [ 1, "m", "n", "p", 4, 5 ]
let arr4 = arr.concat('abcd',[100,[101]]);
console.log(arr)//[ 1, "m", "n", "p", 4, 5 ]
console.log(arr4);// [ 1, "m", "n", "p", 4, 5, "abcd", 100, [101] ]

array.join()

  • 描述:join 接受一個參數,做爲返回的字符串的分隔符,
  • 原數組:不變
  • 返回:以參數爲分隔符的字符串

    let arr = [ 1, "m", "n", "p", 4, 5 ]
    let str = arr.join('-')
    console.log(arr)//[ 1, "m", "n", "p", 4, 5 ]
    console.log(str)//1-m-n-p-4-5code

array.reverse()

  • 描述:無參數,將原數組的元素先後顛倒
  • 原數組:變,順序顛倒
  • 返回:顛倒位置後的原數組

    let arr = [ 1, "p", 4, 5, 4, 5 ]
    let arr6 = arr.reverse()
    console.log(arr) //[ 5, 4, 5, 4, "p", 1 ]
    console.log(arr6) //[ 5, 4, 5, 4, "p", 1 ]blog

array.toString()

  • 描述:無參數,將原數組轉換成字符串,以 ‘,’ 分割。(不可指定分隔符,比array.join()的功能弱)
  • 原數組:不變
  • 返回:字符串

    let arr = [ 5, 4, 5, 4, "p", 1 ]
    let str1 = arr.toString()
    console.log(arr)
    console.log(str1)索引

array.push()/array.unshift()

  • 描述:將參數做爲數組的元素,置於數組的尾部/頭部
  • 原數組:變
  • 返回:新數組的長度

    let arr = [ 1, "p", 4, 5, 4, 5, 6 ]
    let l = arr.push(8)
    console.log(l)// 8
    console.log(arr)// [ 1, "p", 4, 5, 4, 5, 6, 8 ]
    let l2 = arr.unshift(0)
    console.log(l2) //1
    console.log(arr) // [ 0, 1, "p", 4, 5, 4, 5, 6, 8 ]ip

array.pop()/array.shift()

  • 描述:分別去除數組的最後一個/第一個元素
  • 原數組:變
  • 返回:被刪除的元素
let arr = [ 0, 1, "p", 4, 5, 4, 5, 6, 8 ]
let ele = arr.shift();
console.log(ele)//0
console.log(arr)//[ 1, "p", 4, 5, 4, 5, 6, 8 ]
let ele2 = arr.pop();
console.log(ele2)//8
console.log(arr)// [ 1, "p", 4, 5, 4, 5, 6 ]

array.copyWithin(target,start,end)——ES6新增

  • 描述:接受三個參數,target爲目標位置的索引,start 爲待複製數據的起始索引,默認爲0,end爲待複製數據的結束索引(不包含),默認等於數組長度(最後一位元素的索引+1)
  • 原數組:變,但不更改原數組的長度
  • 返回:改變後的數組

    let arr = [ 1, "m", "n", "p", 4, 5 ]
    let arr5 = arr.copyWithin(1,3,6)
    console.log(arr) // [ 1, "p", 4, 5, 4, 5 ]
    console.log(arr5) // [ 1, "p", 4, 5, 4, 5 ]開發

這只是數組的一部分,還有數組迭代、查詢、淺複製、深複製等不少方法沒有說,下次再說吧。字符串

相關文章
相關標籤/搜索