資料結構
網路
關係型資料庫管理系統
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 語言程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理學
化學
生物學
數學
英語
經濟學
心理學
社會學
時尚研究
法律研究如何在 TypeScript 中合併多個數組？
陣列在 TypeScript 中儲存不同資料型別的元素。它是一個元素集合，我們可以用它來儲存和訪問資料，以備不時之需。
在處理多個數組時，我們需要將兩個或多個數組組合起來。在 TypeScript 中，有多種方法可以組合多個數組，我們將在本 TypeScript 教程中介紹所有方法。此外，我們還將討論最後應該使用哪種方法才是最好的。
使用 For 迴圈連線兩個陣列
我們可以採用使用 for-of 迴圈連線兩個陣列的傳統方法。我們可以遍歷陣列並將每個元素推送到另一個數組中以連線兩者。
語法
使用者可以按照以下語法使用 for-of 迴圈在 TypeScript 中連線兩個或多個數組。
let array1 = [ ];
let array2 = [ ];
for (let element of array2) {
array1.push(element);
}
演算法
步驟 1 - 建立兩個或多個數組。
步驟 2 - 使用 for-of 迴圈遍歷第二個陣列的每個元素。
步驟 3 - 在 for-of 迴圈內部，使用 push() 方法將第二個陣列的每個元素推送到第一個陣列中。
步驟 4 - 當 for-of 迴圈迭代完成後，第一個陣列將包含兩個陣列的元素。
示例
在本例中，我們建立了兩個數字陣列。之後，我們使用 for-of 迴圈遍歷 array2 並將其合併到 array1 中。
在輸出中，使用者可以看到 array1 共包含 7 個元素，4 個是它自己的元素，3 個是 array2 的元素。
// defining the two array of numbers and initializing them with some number values
let array1: Array<number> = [10, 20, 30, 40];
let array2: Array<number> = [50, 60, 70];
// Iterate through the every element of array2 and push them to array1
for (let element of array2) {
array1.push(element);
}
console.log("The array1 after joining the array1 and array2 in the array1");
console.log(array1);
編譯後，它將生成以下 JavaScript 程式碼
// defining the two array of numbers and initializing them with some number values
var array1 = [10, 20, 30, 40];
var array2 = [50, 60, 70];
// Iterate through the every element of array2 and push them to array1
for (var _i = 0, array2_1 = array2; _i < array2_1.length; _i++) {
var element = array2_1[_i];
array1.push(element);
}
console.log("The array1 after joining the array1 and array2 in the array1");
console.log(array1);
輸出
以上程式碼將產生以下輸出：
The array1 after joining the array1 and array2 in the array1 [ 10, 20, 30, 40, 50, 60, 70 ]
使用擴充套件運算子連線 N 個數組
擴充套件運算子的符號是三個點 (...)。在 TypeScript 中，我們可以使用擴充套件運算子一次性複製可迭代物件（如陣列、字串等）的所有元素。
在我們的例子中，我們將使用擴充套件運算子來連線 N 個不同的陣列。
語法
使用者可以按照以下語法使用擴充套件運算子將 N 個數組連線到單個數組中。
let first = []; let second = []; let result = [...first, ...second, ...arrayN];
示例
在本例中，我們定義了第一個和第二個陣列。使用擴充套件運算子，我們定義了 result 變數來儲存連線第一個和第二個陣列後的結果陣列。我們還多次連線了第一個和第二個陣列，這展示瞭如何連線 N 個相同或不同的陣列。
此外，我們還連線了第三個和第一個陣列，而沒有使用額外的記憶體空間。
// Creating the two arrays of numbers and booleans respectively
let first: Array<number> = [302, 560, 767, 8];
let second: Array<boolean> = [true, false, true];
// merging first and second array using the spread operator
let result = [...first, ...second];
console.log("After merging the first and second array.");
console.log(result);
// N array merging using spread operator
result = [...first, ...second, ...first];
console.log("After merging the first and second array multiple times.");
console.log(result);
// In place merging, without using extra space
let third: Array<number> = [98, 65, 6, 3];
third = [...third, ...first];
console.log("After merging to first array to third wihtout using extra memory");
console.log(third);
編譯後，它將生成以下 JavaScript 程式碼：
var __spreadArrays = (this && this.__spreadArrays) || function () {
for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length;
for (var r = Array(s), k = 0, i = 0; i < il; i++)
for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++)
r[k] = a[j];
return r;
};
// Creating the two arrays of numbers and booleans respectively
var first = [302, 560, 767, 8];
var second = [true, false, true];
// merging first and second array using the spread operator
var result = __spreadArrays(first, second);
console.log("After merging the first and second array.");
console.log(result);
// N array merging using spread operator
result = __spreadArrays(first, second, first);
console.log("After merging the first and second array multiple times.");
console.log(result);
// In place merging, without using extra space
var third = [98, 65, 6, 3];
third = __spreadArrays(third, first);
console.log("After merging to first array to third wihtout using extra memory");
console.log(third);
輸出
以上程式碼將產生以下輸出：
After merging the first and second array. [ 302, 560, 767, 8, true, false, true ] After merging the first and second array multiple times. [ 302, 560, 767, 8, true, false, true, 302, 560, 767, 8 ] After merging to first array to third wihtout using extra memory [ 98, 65, 6, 3, 302, 560, 767, 8 ]
使用 Concat() 方法連線多個數組
concat() 方法是連線或合併多個數組的內建庫，也是連線它們的有效方法。我們可以透過獲取陣列的例項作為引用來呼叫 contact() 方法，並將其他陣列作為 contact 方法的引數傳遞，這些陣列需要連線。
語法
使用者可以按照以下語法在 TypeScript 中使用 concat() 方法連線多個數組。
let arr1 = []; let arr2 = []; let result = arr1.concat(arr2,...,arrN);
引數
arr2, arr3, …, arrN - 這是需要與 arr1 合併的陣列。
返回值
concat() 方法在將陣列作為引數傳遞給引用陣列後返回新的陣列。它按照我們傳遞引數的順序合併陣列。
示例
在本例中，我們建立了三個不同的陣列，名為 arr1、arr2 和 arr3。首先，我們將 arr2 和 arr3 連線到 arr1。之後，我們將 arr3 和 arr1 連線到 arr2。
在輸出中，使用者可以觀察到結果陣列的順序，它首先包含引用陣列的元素，然後是其他陣列的元素，因為我們已將陣列作為引數傳遞。
// Defining the three arrays containing the values of the different data types
let arr1 = [20, 30, true, "Hello"];
let arr2 = ["Hi", false, Infinity, NaN];
let arr3 = ["T", "u", "T", "o", "r", "i", "a", "l"];
// Merging the arr2, and arr3 to arr1
let result = arr1.concat(arr2, arr3);
console.log("After merging the arr2, and arr3 to arr1. ");
console.log(result);
// changing the order to concat the array
result = arr2.concat(arr3, arr1);
console.log("After merging the arr3, and arr1 to arr2. ");
console.log(result);
編譯後，它將生成以下 JavaScript 程式碼：
var arr1 = [20, 30, true, "Hello"];
var arr2 = ["Hi", false, Infinity, NaN];
var arr3 = ["T", "u", "T", "o", "r", "i", "a", "l"];
// Merging the arr2, and arr3 to arr1
var result = arr1.concat(arr2, arr3);
console.log("After merging the arr2, and arr3 to arr1. ");
console.log(result);
// changing the order to concat the array
result = arr2.concat(arr3, arr1);
console.log("After merging the arr3, and arr1 to arr2. ");
console.log(result);
輸出
以上程式碼將產生以下輸出：
After merging the arr2, and arr3 to arr1. [ 20, 30, true, 'Hello', 'Hi', false, Infinity, NaN, 'T', 'u', 'T', 'o', 'r', 'i', 'a', 'l' ] After merging the arr3, and arr1 to arr2. [ 'Hi', false, Infinity, NaN, 'T', 'u', 'T', 'o', 'r', 'i', 'a', 'l', 20, 30, true, 'Hello' ]
我們學習了三種不同的方法來連線兩個或多個數組。此外，還有其他方法可以連線陣列。例如，我們可以使用 reduce 方法來連線多個數組。此外，我們還可以使用擴充套件運算子和 push 方法來連線陣列。
連線多個數組的最佳和最現代的方法是使用擴充套件運算子；這樣，我們需要編寫的程式碼更少。concat() 方法效率也很高。在開發中不建議使用 for-of 迴圈來合併多個數組。我們添加了這種方法來展示 concat() 方法的內部工作原理。
3K+ 次檢視
