JavaScript >> Javascript 文檔 >  >> Tags >> Arrays

如何在 JavaScript 中合併兩個數組

在 vanilla JavaScript 中,有多種方法可以組合兩個數組的所有元素並返回一個新數組。您可以使用 Array.concat() 方法或擴展運算符(... ) 合併多個數組。

Array.concat() 接受一個或多個數組作為輸入,並將所有後續數組合併到第一個:

const fruits = ['Apple', 'Orange', 'Banana'];

const moreFruits = ['Kiwi', 'Lemon'];

// merge all fruits
const allFruits = fruits.concat(moreFruits);

console.log(allFruits);

// ['Apple', 'Orange', 'Banana', 'Kiwi', 'Lemon']

此方法適用於所有現代瀏覽器以及 IE6 及更高版本。您還可以使用 Array.concat() 合併兩個以上的數組 方法:

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

let combined = [].concat(arr1, arr2, arr3);

console.log(combined); // [ 1, 2, 3, 4, 5, 6 ]

注意 [].concat() 我們在上面的例子中使用的語法來合併數組。與第一個示例類似,只是輸入數組與空數組合併。

如果你只關心現代瀏覽器,最好使用 ES6 spread operator 合併數組:

const fruits = ['Apple', 'Orange', 'Banana'];

const moreFruits = ['Kiwi', 'Lemon'];

// merge all fruits
const allFruits = [...fruits, ...moreFruits];

console.log(allFruits);

// ['Apple', 'Orange', 'Banana', 'Kiwi', 'Lemon']

如果數組包含 duplicate 怎麼辦 元素?在 ECMAScript 5 中沒有“內置”方法來刪除重複項。但是,您可以使用 ES6 Set 對象和擴展運算符來過濾掉所有重複項:

const fruits = ['Apple', 'Lemon', 'Banana'];

const moreFruits = ['Kiwi', 'Lemon'];

// merge all fruits
const allFruits = [...new Set([...fruits, ...moreFruits])];

console.log(allFruits);

// ['Apple', 'Lemon', 'Banana', 'Kiwi']

這種方法僅適用於現代瀏覽器和 Node.js。查看這篇文章,了解更多關於在 JavaScript 中從數組中刪除重複項的信息。

要了解有關 JavaScript 數組的更多信息,請查看本指南,該指南詳細解釋了 JavaScript 數組的工作原理以及如何使用它們將多條信息存儲在單個變量中。


Tutorial JavaScript 教程
  1. 我在 Facebooks F8 2019 的體驗

  2. Extjs - 帶有子菜單的工具欄按鈕菜單下拉菜單。這是可能的?

  3. 如何在帶有 Expo 的 React Native 中使用 SVG

  4. 將 ReactJS 應用程序部署到 Github 頁面

  5. NodeJS、Madmapper 和 arduino 之間的通信系統

  6. 使用 javascript 在 json 中組合對象

  7. 學習 JavaScript 的路上發生了一件有趣的事

  1. 如何禁止瀏覽器的身份驗證對話框?

  2. 黃蜂發布 Acid3 測試

  3. 2021 年加快研發團隊速度的 5 種工具

  4. 使用 IIFE 創建模塊

  5. JavaScript 和嵌入式系統:它們適合嗎?

  6. ES6:JavaScript 中的承諾

  7. 讓我們使用 React 和 JAMstack 構建自定義電子商務 - 第 3 部分

  1. 更新一個有 25 年曆史的網站

  2. Node.js 變得更簡單了

  3. 哦,困境!你應該學習 React、Angular、Vue 還是“另一個框架”.js

  4. 通過 JavaScript 操作 HTML DOM。 . .