HOWTO · JavaScript

JavaScript で配列を ZIP する

この記事は、JavaScript で 2つ以上の配列を圧縮する方法を理解するのに役立ちます。

このページの内容

JavaScript では、2つの配列を圧縮したい場合があります。このチュートリアルでは、JavaScript を使用して 2つのコレクションをフラッシュする方法について説明します。

Python の zip 関数に対応する JavaScript を作成する必要があります。つまり、同じ長さのコレクションが多数ある場合は、ペアの配列を作成する必要があります。

map() メソッド、Array.from() メソッド、Array.prototype.fill() メソッドを使用するなど、JavaScript で 2つの配列を圧縮するさまざまな方法があります。

JavaScript で map メソッドを使用して配列を圧縮する

JavaScript の map() 関数は、特定の長さの 2つの配列を圧縮します。ただし、両方の配列の長さが一致しない場合は、undefined になります。

let a = [9, 8, 7];
let b = ['1', '2', '3'];
let zip = a.map(function(e, i) {
  return [e, b[i]];
});
console.log(zip);

コード

map() メソッドが受け入れるコールバック関数は、a 配列の要素と a コレクションにマップされた b 配列の要素を呼び出します。この方法で圧縮する方法を学ぶのも簡単です。

出力:

[[9, "1"], [8, "2"], [7, "3"]]

map メソッドを使用するときは、両方の配列の長さが同じでなければならないことを確認してください。そうしないと、結果が undefined になります。

let a = [9, 8, 7, 6];
let b = ['1', '2', '3'];
let zip = a.map(function(e, i) {
  return [e, b[i]];
});
console.log(zip);

デモはこちら

a 配列と b 配列の長さが異なることがわかります。

出力:

[[9, "1"], [8, "2"], [7, "3"], [6, undefined]]

JavaScript で Array.from メソッドを使用して配列を圧縮する

let a = [9, 8, 7, 6];
let b = ['90', '80', '70', '60'];
let zip = (a, b) =>
    Array.from(Array(Math.max(a.length, b.length)), (_, i) => [a[i], b[i]]);
console.log(zip(a, b));

実行コード

Array.from メソッドのインスタンスには 2つの配列が存在します。それらは矢印関数に送信されます。長さを一致させた後、プロセスは 2つの別々の配列からアイテムをマップします。

出力:

[[9, "90"], [8, "80"], [7, "70"], [6, "60"]]

さらに、同等のマップは、欠落している要素に対して undefined を出力します。

let a = [9, 8, 7];
let b = ['90', '80', '70', '60'];
let zip = (a, b) =>
    Array.from(Array(Math.max(a.length, b.length)), (_, i) => [a[i], b[i]]);
console.log(zip(a, b));

デモはこちら

出力:

[[9, "90"], [8, "80"], [7, "70"], [undefined, "60"]]

Array.prototype.fill() メソッドは、Array.from() メソッドと同じように機能します。

let a = [7, 8, 9];
let b = ['70', '80', '90'];
let zip = (a, b) =>
    Array(Math.max(a.length, b.length)).fill().map((_, i) => [a[i], b[i]]);
console.log(zip(a, b));

実行コード

出力:

[[7, "70"], [8, "80"], [9, "90"]]