JavaScript
 Computer >> コンピューター >  >> プログラミング >> JavaScript

JavaScriptのTypedArray.fill()メソッドの使い方を徹底解説

TypedArrayのfill()メソッドとは

JavaScriptのTypedArrayオブジェクトが持つfill()メソッドは、配列内の指定した範囲の要素を、あらかじめ決めておいた固定値で一括して置き換えるための関数です。

このメソッドは最大3つの引数を受け取ります。

  • 第1引数: 配列に代入する固定値
  • 第2引数: 置き換えを開始するインデックス
  • 第3引数(省略可): 置き換えを終了するインデックス

終了インデックスを省略した場合は、開始位置から配列の末尾までのすべての要素が指定した値で上書きされます。また、負のインデックスを指定すると、配列の末尾からの相対位置として解釈される点も覚えておくと便利です。

構文

fill()メソッドの基本的な構文は以下の通りです。

int32View.fill(464, 3);

サンプルコード

実際にInt32Arrayに対してfill()メソッドを使用し、3番目以降の要素を464という値で置き換える例を見てみましょう。

<html>
<head>
    <title>JavaScript TypedArray fill Method</title>
</head>
<body>
    <script type="text/javascript">
        var int32View = new Int32Array([64, 89, 65, 21, 14, 66, 87, 55]);
        document.write("Contents of the typed array: " + int32View);
        document.write("<br>");
        result = int32View.fill(464, 3);
        document.write("Contents of the typed array after fill: " + int32View);
    </script>
</body>
</html>

実行結果

上記のコードを実行すると、コンソールには次のように出力されます。

Contents of the typed array: 64,89,65,21,14,66,87,55
Contents of the typed array after fill: 64,89,65,464,464,464,464,464

動作のポイント

元の配列は「64, 89, 65, 21, 14, 66, 87, 55」という8つの要素を持っていましたが、fill(464, 3)を実行することで、インデックス3以降(21, 14, 66, 87, 55)がすべて464に置き換えられています。インデックス0〜2の要素(64, 89, 65)はそのまま保持されている点に注目してください。

なお、fill()メソッドは元の配列自体を変更する破壊的メソッドであり、戻り値としては変更後の配列自身を返します。特定の範囲だけをまとめて初期化したい場合などに、ループ処理を書くことなく簡潔に記述できるのが大きなメリットです。

  1. JavaScriptのarray.includes()メソッドとは？配列に特定の要素が含まれているか判定する方法

    JavaScriptのarray.includes()メソッドは、配列の中に指定した要素が含まれているかどうかを判定するために使用します。戻り値はブール値（true / false）で、要素が見つかればtrue、見つからなければfalseを返します。 構文 array.includes(ele, start) 各パラメータの意味は以下のとおりです。 ele：検索したい要素（必須） start：検索を開始する位置（省略可能）。デフォルトは0で、配列の先頭から検索が始まります それでは、JavaScriptでarray.includes()メソッドを実際に実装してみましょう。 例1：数値の配列

  2. JavaScriptのarray.toLocaleString()関数の使い方｜配列をロケール形式の文字列に変換する方法

    array.toLocaleString()関数とはJavaScriptのarray.toLocaleString()関数は、配列の要素を文字列として返し、各要素をカンマなどロケール固有の区切り文字で連結します。引数としてロケール（言語タグ）を指定することもでき、指定した言語・地域の書式に従って文字列へ変換されます。例えば、日付オブジェクトが含まれる配列に対してこの関数を使用すると、「en-GB」や「ja-JP」などのロケールに応じた形式で日付が表示されます。ロケールを省略した場合は、実行環境のデフォルトのロケールが使用されます。主な特徴配列のすべての要素を文字列化し、区切り文字で連結して返す