ES6 配列のコピーおよびフィルメソッド copyWithin() および fill() の具体的な使用法

ES6 配列のコピーおよびフィルメソッド copyWithin() および fill() の具体的な使用法

copyWithin() と fill() の共通点は何ですか?

  • 配列インスタンスの範囲を指定する必要があります。開始インデックスを含み、終了インデックスは除外します。
  • このメソッドを使用すると、配列の内容は変更されますが、配列のサイズは変更されません。

バッチコピー copyWithin()

  • copyWithin() メソッドは、配列内の指定された位置から配列内の別の指定された位置に要素をコピーするために使用されます。
  • copyWithin() は、指定された範囲内の配列の内容を浅くコピーし、指定されたインデックスから挿入します。

文法

配列.copyWithin(ターゲット、開始、終了)

パラメータ:

パラメータ説明する
ターゲット必須。指定されたターゲット インデックスの場所にコピーします。
始めるオプション。要素のコピーの開始位置。
終わりオプション。コピーを終了するインデックス位置(デフォルトは 配列の長さ)。負の値の場合は逆の意味になります。

戻り値: コピーされた配列を返します

コード例:

// 配列の最初の 2 つの要素を最後の 2 つの要素にコピーします。
var fruit = ["バナナ", "オレンジ", "リンゴ", "マンゴー"]; 
fruit.copyWithin(2, 0);//バナナ、オレンジ、バナナ、オレンジ

// 配列の最初の 2 つの要素を 3 番目と 4 番目の位置にコピーします。
var fruit = ["バナナ", "オレンジ", "リンゴ", "マンゴー", "キウイ", "パパイヤ"]; 
fruit.copyWithin(2, 0, 2); //バナナ、オレンジ、バナナ、オレンジ、キウイ、パパイヤ

配列を埋めるメソッド fill()

fill() メソッドは、配列の要素を固定値に置き換えるために使用されます。

文法:

配列.fill(値、開始、終了)

パラメータ:

パラメータ説明する
価値必須。入力する値。
始めるオプション。ポジションの充足を開始します。
終わりオプション。充填停止位置(デフォルトは 配列の長さ)

戻り値: 配列

コード例:

//配列の最後の 2 つの要素に「Runoob」を入力します。
var fruit = ["バナナ", "オレンジ", "リンゴ", "マンゴー"]; 
fruit.fill("Runoob", 2, 4); //[ "バナナ", "オレンジ", "Runoob", "Runoob" ]

// 配列を固定値で埋めます:
var fruit = ["バナナ", "オレンジ", "リンゴ", "マンゴー"]; 
fruit.fill("Runoob");//Runoob、Runoob、Runoob、Runoob

指数の計算方法については、どちらの方法も同じである。

  • 開始インデックスは、塗りつぶしを開始する位置を指定するために使用され、オプションです。
  • 終了インデックスが指定されていない場合、配列は最後まで埋められます。
  • 負のインデックスは配列の末尾からカウントされます。負のインデックスは、配列の長さに正のインデックスを加えたものと考えることもできます。
  • 配列外、長さゼロ、および逆方向のインデックス範囲は、暗黙的に無視されます。

コード例:

定数ゼロ = [0,0,0,0,0];

// インデックスが 3 以上の要素を 6 個のゼロで埋めます。fill(6, 3);//[0,0,0,6,6]
zeroes.fill(0); //リセット //インデックスが1以上3未満の要素を7つのzeroesで埋めます。zeroes.fill(7,1,3); //[0,7,7,0,0]
zeroes.fill(0); //リセット //インデックスが1以上4未満の要素を8で埋める //(-4+zeroes.length=1) (-1+zeroes.length=4)
ゼロを埋める(8,-4,-1); //[0,8,8,8,0]

//インデックスが低すぎるため、ゼロは無視します。fill(1,-10,-6);//[0,0,0,0,0]
//インデックスが高すぎるため、ゼロは無視されます。fill(1,10,15);//[0,0,0,0,0]
//インデックスを逆にしてゼロを無視します。fill(2,4,2);//[0,0,0,0,0]
//インデックス部分は使用可能です。使用可能な部分を埋めてください。zeroes.fill(4,3,10);//[0,0,0,4,4]

ES6 のコピーおよびフィルメソッド copyWithin() と fill() の具体的な使用法についてはこれで終わりです。ES6 の copyWithin() と fill() の詳細については、123WORDPRESS.COM の過去の記事を検索するか、以下の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。

以下もご興味があるかもしれません:
  • ES6 で Array.copyWithin() 関数を使用する詳細な例

<<:  W3C チュートリアル (13): W3C WSDL アクティビティ

>>:  CSSはヒントボックス、バブルボックス、三角形を作成します

推薦する

データベースの削除から逃走までの MySQL の徹底分析_上級編 (I) - データ整合性

1. データ整合性の概要1. データ整合性の概要データの冗長性とは、データベース内に重複したデータが...

LinuxにComposerをインストールする方法

1. インストールスクリプト(composer-setup.php)を現在のディレクトリにダウンロー...

Linuxのバージョン情報を復号化する方法

Linux バージョンに関する情報を表示および解釈するのは、見た目よりも少し複雑です。単純なバージョ...

JavaScript マクロタスクとマイクロタスクの実行順序についての簡単な説明

目次1. JavaScriptはシングルスレッドです1. 同期タスク2. 非同期タスク2. タスクキ...

W3C チュートリアル (9): W3C XPath アクティビティ

XPath は、XML ドキュメントの一部を選択するための言語です。 XPath は、XSLT、XQ...

Ubuntu 16.04 で Python 3 を使用して Django プロジェクトを作成し、実行する方法

ステップ1: Djangoプロジェクトを作成するターミナルを開き、書き込みたいプロジェクトのアドレス...

Linux クラウド サーバー上に SFTP サーバーとイメージ サーバーを構築する方法

まず、SFTP プロトコルと FTP プロトコルの違いを理解してください。ここでは詳細には触れません...

静的ページと動的ページの実行メカニズムの説明

1. 静的ページとは、Web ページ内に HTML タグのみが含まれるページです。WEB 開発者がこ...

jsはポップアップウィンドウをクリックすることでポップアップログインボックスを実装します

この記事では、ポップアップウィンドウをクリックしたときにポップアップログインボックスを実現するための...

Vueはリストのシームレスなスクロールを実装します

この記事の例では、リストのシームレスなスクロールを実現するためのvueの具体的なコードを参考までに共...

配列をフィルタリングするJavaScript

この記事では、配列フィルタリングを実装するためのJavaScriptの具体的なコードを参考までに紹介...

MySQL エラー: ロックを取得しようとしたときにデッドロックが見つかりました。トランザクションの解決策を再起動してください

問題を見つける最近、以前のデータを入力していたときに、プログラムが突然次のエラーを報告しました。 [...

Linuxでファイルの作成時間を表示する方法

1. はじめにLinux でファイルの作成時刻が見つかるかどうかは、ファイル システムの種類によって...

Windows が MySQL サービスを開始できず、エラー 1067 を報告する場合の解決策

突然、MySQLにログインすると、アクセスが拒否されたか、データベースに接続できないと表示されました...

携帯電話向けウェブページ作成のヒント

現在では多くの人がスマートフォンを使用していることを考慮すると、モバイル Web ページの書き方は、...