在 JavaScript 中壓縮兩個陣列

1. 在 JavaScript 中使用 map() 方法壓縮兩個陣列
2. 在 JavaScript 中使用 Array.from() 方法壓縮兩個陣列
3. 使用 Array.prototype.fill() 方法壓縮兩個陣列

JavaScript 有 map() 方法來壓縮兩個一定長度的陣列。但是，如果相應的兩個陣列的長度不匹配，則最小加長陣列將列印 undefined 作為其匹配項。

在這裡，除了 map() 方法，我們將看到 Array.form() 方法和 Array.prototype.fill() 方法的演示，該方法明確宣告瞭何時執行陣列長度不匹配。

在 JavaScript 中使用 map() 方法壓縮兩個陣列

map() 函式接受一個回撥函式，該函式將呼叫 x 陣列元素並將它們與 y 陣列的元素對映。這種簡單的拉鍊方式也很容易掌握。

程式碼片段：

var x = [1,2,3];
var y = ["10", "20","30"];
var z = x.map(function(e, i) {
  return [e, y[i]];
});
console.log(z);

輸出：

在 JavaScript 中使用 Array.from() 方法壓縮兩個陣列

在 Array.from() 方法的例項中，我們將有兩個陣列並將它們傳遞給箭頭函式。該函式將首先匹配長度，然後對映來自兩個不同陣列的元素。此外，當發現任何元素丟失時，相應的地圖將為此列印 undefined。

程式碼片段：

var x = [1,2,3,4];
var y = ["10", "20", "30"];
var zip = (x, y) => Array.from(Array(Math.max(x.length, y.length)), (_, i) => [x[i], y[i]]);
console.log(zip(x,y));

輸出：

使用 Array.prototype.fill() 方法壓縮兩個陣列

Array.prototype.fill() 方法的工作方式與 Array.from() 方法類似，並按預期輸出。

程式碼片段：

var x = [1,2,3];
var y = ["10", "20", "30", "40"];
const zip = (x, y) => Array(Math.max(x.length, y.length)).fill().map((_,i) => [x[i], y[i]]);
console.log(zip(x,y));

輸出：