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

JavaScriptのcopyWithin()メソッドの使い方をわかりやすく解説

JavaScriptのcopyWithin()メソッドは、配列内の要素を同じ配列の別の位置へコピーするためのメソッドです。元の配列のサイズは変わらず、指定した範囲の要素が上書きされる形でコピーされます。

このメソッドでは、コピー元・コピー先のインデックス位置を自由に指定できます。主なパラメータは以下の3つです。

  • target ー 要素のコピー先となるインデックス位置（必須）。
  • begin ー コピーを開始する要素のインデックス（省略可能）。省略した場合は配列の先頭からコピーされます。
  • end ー コピーを終了する要素のインデックス（省略可能）。省略した場合は配列の末尾までコピーされます。なお、endで指定したインデックス自体はコピー範囲に含まれません。

サンプルコード

以下のコードを実行すると、copyWithin()メソッドの動作を確認できます。ここでは、インデックス0〜3の要素（"One"〜"Four"）を、インデックス3以降の位置へコピーしています。

<!DOCTYPE html>
<html>
    <body>
        <script>
            var num = ["One", "Two", "Three", "Four", "Five", "Six", "Seven"];
            document.write(num);

            document.write("<br>"+num.copyWithin(3,0,4));
        </script>
    </body>
</html>

実行結果

上記コードの出力は次のようになります。

One,Two,Three,Four,Five,Six,Seven
One,Two,Three,One,Two,Three,Four

このように、copyWithin()メソッドを使うことで、配列の一部を効率的に別の位置へ複製できます。配列の並べ替えやデータの再配置を行いたい場合に便利なメソッドですので、ぜひ活用してみてください。

  1. JavaScript DOMとは？基本の仕組みと要素の取得方法をわかりやすく解説

    JavaScriptのDOM（Document Object Model：ドキュメントオブジェクトモデル）は、Webページ上のHTML要素を表現する仕組みです。DOMはインターフェースとして機能し、ページのコンテンツやスタイルを変更することで、Webページを自由に操作できるようにします。 DOMにアクセスするには、Webページ上で右クリックして「検証（Inspect）」を選択します。すると画面の右側または左側にパネルが表示され、現在閲覧しているページのHTML要素を確認できます。要素にマウスカーソルを合わせると、ページ上の該当部分がハイライトされるため、どの要素がページのどのセクションに対応

  2. JavaScriptの_.size()メソッドとは？配列のサイズを取得する方法を解説

    _.size()メソッドとは_.size()は、JavaScriptの定番ユーティリティライブラリであるunderscore.jsに用意されている関数です。主に配列の要素数（サイズ）を取得するために使われます。このメソッドを使用する前に、underscore.jsのCDNをページに読み込んでおく必要がある点に注意してください。構文_.size(array);例1：通常の配列の場合次の例では、数値を格納した通常の配列を_.size()メソッドに渡し、配列のサイズを取得しています。<html> <body> <head> <script src =