JavaScript類比數組合并concat,javascriptconcat

來源:互聯網
上載者:User

JavaScript類比數組合并concat,javascriptconcat

定義和用法

concat() 方法用於串連兩個或多個數組。

該方法不會改變現有的數組,而僅僅會返回被串連數組的一個副本。

文法

arrayObject.concat(arrayX,arrayX,......,arrayX)

參數 描述
arrayX 必需。該參數可以是具體的值,也可以是數組對象。可以是任意多個。
傳回值

返回一個新的數組。該數組是通過把所有 arrayX 參數添加到 arrayObject 中產生的。如果要進行 concat() 操作的參數是數組,那麼添加的是數組中的元素,而不是數組

我們有兩個這樣的數組

var arr1 = [1,2,3];var arr2 = [4,5,6];

任務:合并成這樣,請至少提供兩種思路。

var arr1 = [1,2,3,4,5,6];

思路一:我們可以把第二個數組裡面的值挨個添加到第一個數組的末尾。

1:數組怎麼新增內容 ?[] || push || shift

2:怎麼向數組最後一個索引添加值? push || [數組.length]

3:怎麼挨個向數組一新增內容? for

4: for迴圈多少次? 你要添加多少就迴圈多少次,也就是arr2的長度

5: 要添加什麼內容?arr2裡面的值,怎麼擷取,arr[?]

代碼實現:

var arr1 = [1,2,3];var arr2 = [4,5,6];for(var i=0;i<arr2.length;i++){arr1.push(arr2[i]);}console.log(arr1); //[1, 2, 3, 4, 5, 6]

問題來了,原生js提供的concat方法不會修改原數組(arr1)的內容,而是返回一個新數組。

分析:既然是要傳回值,那我們可以定義一個函數,然後再定義一個變數,這個變數來接收我們添加好的值,但是我們會一個問題,那就是不能在arr1上面push內容了,不然還是會修改原數組的內容。於是我覺得要把原數組複製一份,但是又有一個問題,就是對象是參考型別,簡單來說雖然我們可以把數組1複製到一個變數中,但是如果我用push或者[]的形式修改裡面的值,或者添加,那麼我們的原數組也會被修改,(如果你不知道什麼是參考型別,可以去看我部落格的第一頁或者在第二頁)這不是我們想要的結果,但是我們必須複製一份arr1。此時你有什麼解決方案?

解決數組引用問題:

for(var i=0;i<arr1.length;i++){arr3[i] = arr1[i];}

我的思路是把數組1的值挨個的添加到arr3這個數組中,此時的arr3是這樣的

console.log(arr3) //[1, 2, 3]

任務:在這個新的數組arr3中添加arr2的所以值,方法和第一步一樣,如果忘記了回頭看看。

代碼實現:

var arr1 = [1,2,3];var arr2 = [4,5,6];var arr3 = [];for(var i=0;i<arr1.length;i++){arr3[i] = arr1[i];}for(var i=0;i<arr2.length;i++){arr3.push(arr2[i]);}console.log(arr3);

問題:雖然這個已經實現了數組的合并,但是我每次合并都要重新寫一份,那樣太麻煩,於是我們得想個辦法把它封裝成一個函數,下次我們要用的時候調用它就行。

var arr1 = [1,2,3];var arr2 = [4,5,6,7];function Concat(arr1,arr2){var arr3 = [];for(var i=0;i<arr1.length;i++){arr3[i] = arr1[i];}for(var i=0;i<arr2.length;i++){arr3.push(arr2[i]);}return arr3;}console.log(Concat(arr1,arr2));

思路二:

分析:把arr1和arr2都轉換成字串,然後將這兩段字串相加得到一個組合,然後再把這個字串轉成數組。

代碼實現:

var arr1 = [1,2,3];var arr2 = [4,5,6,7,8,9];var arr3 = (arr1.join(",")+","+arr2.join(",")).split(",");

出了點小問題,這個這個數組裡面的值是字串了。

["1", "2", "3", "4", "5", "6", "7", "8", "9"]

解決思路:遍曆這個數組,挨個把他們轉換成數字。

var arr1 = [1,2,3];var arr2 = [4,5,6,7,8,9];var arr3 = (arr1.join(",")+","+arr2.join(",")).split(",");for(var i=0;i<arr3.length;i++){arr3[i] = +arr3[i];}console.log(arr3);

課外擴充:繼承版

var arr1 = [1,2,3];var arr2 = [4,5,6,7,8,9];Array.prototype.Concat = function(arr){var arr3 = [];for(var i=0;i<this.length;i++){arr3[i] = this[i];}for(var i=0;i<arr.length;i++){arr3.push(arr[i]);}return arr3;}console.log(arr1.Concat(arr2));

以上所述是小編給大家介紹的JavaScript類比數組合并concat的相關知識,希望對大家有所協助!

您可能感興趣的文章:
  • JS實現合并兩個數組並去除重複項只留一個的方法
  • JS數組合并push與concat區別分析
  • JavaScript中數組的合并以及排序實現樣本
  • JavaScript合并兩個數組並去除重複項的方法
  • 原生JavaScript實現合并多個數組樣本
  • JS合并數組的幾種方法及優劣比較
  • 使用不同的方法結合/合并兩個JS數組
  • JavaScript中合并數組的N種方法
  • JavaScript及jquey實現多個數組的合併作業
  • JavaScript中將數組進行合并的基本方法講解

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.