【JavaScript】配列内で指定した値に最も近い要素のインデックスを取得する方法

問題の概要

JavaScriptで、数値の配列を第一引数、単一の数値（ターゲット値）を第二引数として受け取る関数を作成することを考えます。

この関数の役割は、配列内の要素の中から第二引数で指定された値に最も近い要素を見つけ出し、そのインデックスを返すことです。

実装例

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

const arr = [0, 65, 131, 196, 259, 323, 388, 453, 517];
const target = 425;

const findClosest = (arr, target) => {
    let min;
    let chosen = 0;
    for (let i in arr) {
        min = Math.abs(arr[chosen] − target);
        if (Math.abs(arr[i] − target) < min) {
            chosen = i;
        };
    };
    return chosen;
};

console.log(findClosest(arr, target));

出力結果

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

7

コードの解説

この関数の仕組みは以下の通りです。

まず、初期状態として0番目の要素を候補（chosen = 0）に設定します。その後、for...inループで配列を先頭から順に走査し、各要素とターゲット値との差の絶対値をMath.abs()で計算します。

現在の候補よりもターゲットに近い要素が見つかるたびに、chosenをそのインデックスで更新していきます。ループが完了した時点で、chosenには最も近い要素のインデックスが格納されているため、それを返り値としています。

今回の例では、ターゲット値425との差を比較すると、arr[6] = 388（差：37）よりもarr[7] = 453（差：28）の方が近いため、結果は7となります。

より安全な書き方のポイント

for...inループはインデックスを文字列として返すため、戻り値が文字列型になる点に注意が必要です。数値型のインデックスを確実に得たい場合は、以下のようにfor...ofとentries()を組み合わせる方法が推奨されます。

const findClosest = (arr, target) => {
    let chosen = 0;
    let minDiff = Math.abs(arr[0] − target);
    for (const [i, value] of arr.entries()) {
        const diff = Math.abs(value − target);
        if (diff < minDiff) {
            minDiff = diff;
            chosen = i;
        }
    }
    return chosen;
};

また、最小値の計算をループ外に出して一度だけ行うことで、無駄な再計算を避け、パフォーマンス面でもわずかな改善が期待できます。