查漏補缺系列--js數組操做

昨天學弟去某公司面試實習，回來講竟然被一些基礎題給絆了腳，幸虧本身慢慢回憶起來，沒有致使太尷尬的局面。其中有一題就是問：js數組操做中，有哪些會影響到數組自己？哪些不會影響？分別舉例說明。其實這個問題咱們平時都能接觸到不少，項目中處處都有數組，追加、截取、替換、遍歷不少，但是忽然被問起這種問題可能還會心中咯噔一下，因此咱們今天就來好好梳理一下，js數組操做中的幾個容易忽略的知識點。

1.建立數組的三種方法

（1）建立定長空數組：初始化一個長度爲10的空數組

// 語法： var arr = new Array(len)
var arr = new Array(10); // 建立一個長度爲10的空數組，每一項都爲undefined複製代碼

（2）建立一個包含有數據的數組：每一項都被初始化了賦值了

// 語法： var cols = new Array(data1,data2,……)
// 數組中的數據類型能夠不一樣，可是通常建立一個數組建議是同一類數據
var arr = new Array(1, 'a', 'hello', true);複製代碼

（3）簡單語法糖

var arr = []; // 建立一個空數組，長度爲0複製代碼

2.數組的操做

（1）遍歷

for循環：

for(var i=0; i<arr.length; i++){
    console.log(arr[i]);
}複製代碼

map：

打標記：返回一個新的數組，不影響原來的數組

（2）push/pop末尾追加/刪除

打標記：修改的是原數組

push()：追加不會去重，返回值是追加後的數組長度

pop()：刪除數組最後一個元素，返回值是被刪除的那個元素

（3）unshift/shift

打標記：修改的是原數組

unshift()：將參數順序添加到數組開頭，返回值是新數組的長度

shift()：刪除數組的第一個元素，返回值是被刪除的那個元素

（4）join：

用於把數組中的全部元素放入一個字符串，元素是經過指定的分隔符進行分隔的,若是不指定，則默認爲逗號（','）

打標記：獲得一個新的字符串，不修改原來的數組

（5）reverse：反排序

打標記：影響原來的數組

（6）sort排序：對數組中元素進行排序 arrayObject.sort(sortBy)

打標記：影響原來的數組

• 即便數組中的每一項都是數值，sort()方法比較的也是字符串sort()
• 方法能夠接受一個比較函數做爲參數
• sortBy必須是函數

降序排列（升序排列同理）：

var arr=[1,5,8,2,-3,20,15];
// 降序
arr.sort(function(a,b){console.log(a,b); return b-a})複製代碼

我特地把每次比較的數據打印出來，不難看出，這是符合冒泡排序的，兩兩比較，true則換位，繼續和前一個比較，直到頂部，而後下一個值開始進行第二輪比較。

（7）concat：用於鏈接兩個或多個數組

打標記：返回一個新的數組，不影響原來的數組，同時不會去重

附加：若是須要去重，ES5能夠利用for循環，ES6能夠運用拓展運算符、

數組的from和set方法進行處理，具體from()，set用法就在這裏不贅述了，代碼以下：

（8）slice：從已有數組中返回選定的元素

打標記：返回一個新的數組，不影響原來的數組

// 語法 arrayObject.slice(start, end);複製代碼

start必填：規定從何處開始選取，若是是負數，從數組尾部開始算起

end選填，給定從何處結束選取，是數組片斷結束處的數組下標（不包含該元素）

w3c中說明start是必填項，可是實際上slice()中若是不填寫參數的話，也能正常返回結果，返回的是數組自己。

（9）splice

打標記：會修改原來的數組

• 刪除：arrayObject.splice(index, count); 刪除從index開始的0個或多個元素，返回值是被刪除的元素的數組
• 插入：arrayObject.splice(index, 0, item1,……,itemX) 在指定的位置插入值，index：起始位置，0：要刪除的項數，item1……itemX：要插入的項
• 替換：arrayObject.splice(index,count,item1,……,itemX); 指定位置插入值，同時刪除任意數量的項

（10）其餘

length：返回數組長度

indexOf()：從數組的指定位置開始向後查找，第一個命中值所在的位置

   返回值：查找項在數組中的位置，沒有找到返回-1

// 語法： arrayObject.indexOf(searchValue, startIndex)複製代碼

   lastIndexOf：從數組的末尾開始查找

   indexOf和lastIndexOf支持IE9+瀏覽器

這種查詢方法和屬性都不會影響數組自己

總結：經過上面的整理，咱們應該能很清晰地知道，map、join、concat、slice這些方法在操做數組的時候是返回一個新的對象，而不會影響到被操做的數組自己。而push、pop、shift、unshift、reverse、sort、splice這種增刪改性質的方法會直接修改數組自己，因此在項目中進行這一類數組操做的時候須要特別注意，防止一處修改，致使其餘引用的異常。

附：感謝您的閱讀，也但願對您有所幫助。同時若是以上內容中存在疑問和錯誤，歡迎留言或者私信。