JavaScript基礎整理之數組(一)

dingda 發布于2019-08-21 17:04 / 2054人閱讀

摘要：原文發布在數組應該是日常開發中最常見的數據結構了，雖然常見，但是卻不一定能優雅地處理好，中數組的處理方法很多，各個方法的參數返回值是否修改原數組等也容易記混。

原文發布在：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-5

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 ]

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 ]

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 ]

這只是數組的一部分，還有數組迭代、查詢、淺復制、深復制等很多方法沒有說，下次再說吧。

GPU云服務器云服務器之基礎篇黑客基礎之DOS 零基礎課程之c語言基礎javascript

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/89105.html

前端開發知識點整理

摘要：前言本文主要是有關前端方面知識按照目前的認知進行的收集歸類概括和整理，涵蓋前端理論與前端實踐兩方面。前言：本文主要是有關前端方面知識按照 XX 目前的認知進行的收集、歸類、概括和整理，涵蓋『前端理論』與『前端實踐』兩方面。本文會告訴你前端需要了解的知識大致有什么，看上去有很多，但具體你要學什么，還是要 follow your heart & follow your BOSS。初衷...

Blackjun 2019-08-20 17:14 評論0 收藏0
前端開發知識點整理

摘要：前言本文主要是有關前端方面知識按照目前的認知進行的收集歸類概括和整理，涵蓋前端理論與前端實踐兩方面。前言：本文主要是有關前端方面知識按照 XX 目前的認知進行的收集、歸類、概括和整理，涵蓋『前端理論』與『前端實踐』兩方面。本文會告訴你前端需要了解的知識大致有什么，看上去有很多，但具體你要學什么，還是要 follow your heart & follow your BOSS。初衷...

Sike 2019-08-29 12:44 評論0 收藏0
前端開發知識點整理

摘要：前言本文主要是有關前端方面知識按照目前的認知進行的收集歸類概括和整理，涵蓋前端理論與前端實踐兩方面。前言：本文主要是有關前端方面知識按照 XX 目前的認知進行的收集、歸類、概括和整理，涵蓋『前端理論』與『前端實踐』兩方面。本文會告訴你前端需要了解的知識大致有什么，看上去有很多，但具體你要學什么，還是要 follow your heart & follow your BOSS。初衷...

tracy 2019-08-01 16:59 評論0 收藏0
SegmentFault 技術周刊 Vol.40 - 2018，來學習一門新的編程語言吧！

摘要：入門，第一個這是一門很新的語言，年前后正式公布，算起來是比較年輕的編程語言了，更重要的是它是面向程序員的函數式編程語言，它的代碼運行在之上。它通過編輯類工具，帶來了先進的編輯體驗，增強了語言服務。 showImg(https://segmentfault.com/img/bV1xdq?w=900&h=385); 新的一年不知不覺已經到來了，總結過去的 2017，相信小伙們一定有很多收獲...

caspar 2019-08-15 13:33 評論0 收藏0
SegmentFault 技術周刊 Vol.40 - 2018，來學習一門新的編程語言吧！

摘要：入門，第一個這是一門很新的語言，年前后正式公布，算起來是比較年輕的編程語言了，更重要的是它是面向程序員的函數式編程語言，它的代碼運行在之上。它通過編輯類工具，帶來了先進的編輯體驗，增強了語言服務。 showImg(https://segmentfault.com/img/bV1xdq?w=900&h=385); 新的一年不知不覺已經到來了，總結過去的 2017，相信小伙們一定有很多收獲...

nihao 2019-08-21 18:39 評論0 收藏0