JavaScriptで2つの配列の対応する要素が等しいかどうかを判定する方法

本記事では、2つの配列を受け取り、対応する要素同士を比較するJavaScript関数の作成方法を解説します。すべての対応する要素が等しい場合には true を返し、1つでも異なる要素があれば false を返す関数を実装していきます。

実装の考え方

まず、2つの配列の長さを比較します。長さが異なる時点で対応する要素同士の比較は成立しないため、即座に false を返します。次に、ループ処理で各要素を順番に厳密等価演算子（===）を使って比較し、不一致が見つかった時点で false を返します。最後まで一致が続けば true を返します。

コード例

実際のコードは以下のとおりです。

const arr1 = [6, 7, 8, 9, 10, 11, 12, 14];
const arr2 = [6, 7, 8, 9, 10, 11, 12, 14];
const areEqual = (first, second) => {
    if(first.length !== second.length){
        return false;
    };
    for(let i = 0; i < first.length; i++){
        if(first[i] === second[i]){
            continue;
        }
        return false;
    };
    return true;
};
console.log(areEqual(arr1, arr2));

出力結果

コンソールには以下のように出力されます。

True

別のアプローチ: every() メソッドを活用する

より簡潔に記述したい場合は、Array.prototype.every() を使う方法もおすすめです。長さの一致を確認しつつ、各要素を1行で比較できます。

const areEqual = (first, second) =>
    first.length === second.length &&
    first.every((val, i) => val === second[i]);

console.log(areEqual([1, 2, 3], [1, 2, 3])); // true
console.log(areEqual([1, 2, 3], [1, 4, 3])); // false

この方法であれば、コードの意図が明確になり、可読性も大きく向上します。状況に応じて、forループによる実装と every() を使った実装を使い分けるとよいでしょう。