JavaScript配列の一般的なメソッドの詳細な説明

JavaScript配列の一般的なメソッドの詳細な説明

元の配列を変更しない方法

1. 連結

2 つ以上の配列を結合するために使用されます。このメソッドは既存の配列を変更せず、新しい配列を返します。

文法:

var new_array = old_array.concat(値1[, 値2[, ...[, 値N]]])

パラメータ:

ValueN (オプション):

新しい配列にマージされる配列および/または値。すべての valueN パラメータが省略されている場合、concat はこのメソッドが呼び出された既存の配列の浅いコピーを返します。

戻り値:

新しい配列

ここに画像の説明を挿入

2. 参加する

配列 (または配列のようなオブジェクト) のすべての要素を文字列に連結し、その文字列を返します。配列に項目が 1 つしかない場合は、その項目は区切り文字なしで返されます。

文法:

arr.join([セパレータ])

パラメータ:

separator (オプション):

配列の各要素を区切る文字列を指定します。必要に応じて、区切り文字を文字列に変換します。この値を省略すると、配列要素はカンマ (,) で区切られます。セパレータが空の文字列 ("") の場合、すべての要素の間に文字は配置されません。

戻り値:

すべての配列要素が連結された文字列。 arr.length が 0 の場合、空の文字列が返されます。

ここに画像の説明を挿入

知らせ:

要素が未定義または null の場合、空の文字列に変換されます。

3. スライス

begin と end (begin を含み end を含まない) によって決定される元の配列の浅いコピーである新しい配列オブジェクトを返します。元の配列は変更されません。

文法:

arr.slice([開始[, 終了]])

パラメータ:

begin (オプション): 抽出が開始されるインデックス (0 から開始)。ここから元の配列要素が抽出されます。パラメータが負の数の場合、元の配列の最後の要素から抽出を開始することを意味します。Slice(-2) は、元の配列の最後から 2 番目の要素から最後の要素 (最後の要素を含む) までを抽出することを意味します。 begin が省略された場合、スライスはインデックス 0 から始まります。 begin が元の配列のインデックス範囲を超える場合、空の配列が返されます。

end (オプション): 抽出が終了するインデックス (0 から始まる)。ここで元の配列要素の抽出は終了します。 slice は、begin から end までのインデックスを持つ元の配列内のすべての要素を抽出します (begin は含みますが、end は含みません)。このパラメータが負の数の場合、抽出が終了する元の配列の最後の要素を示します。 end を省略すると、スライスは元の配列の末尾まで抽出されます。 end が配列の長さより大きい場合、slice は元の配列の末尾まで抽出されます。

戻り値:

抽出された要素を含む新しい配列。

ここに画像の説明を挿入

4. 文字列

指定された配列とその要素を表す文字列を返します。

文法:

ar.toString() 関数

戻り値:

指定された配列とその要素を表す文字列。

ここに画像の説明を挿入

元の配列を変更する方法

1. ポップ

配列から最後の要素を削除し、その要素の値を返します。

文法:

arr.pop()

戻り値

配列から削除する要素 (配列が空の場合は undefined を返します)。

ここに画像の説明を挿入

2. プッシュ

配列の末尾に 1 つ以上の要素を追加し、配列の新しい長さを返します。

文法:

arr.push(要素1、...、要素N)

パラメータ:

elementN : 配列の末尾に追加する要素。

戻り値:

このメソッドが呼び出されると、新しい長さプロパティ値が返されます。

ここに画像の説明を挿入

3. シフト

配列から最初の要素を削除し、その要素の値を返します。このメソッドは配列の長さを変更します。

文法:

arr.shift() 関数

戻り値:

配列から削除された要素。配列が空の場合は undefined を返します。

ここに画像の説明を挿入

4. シフト解除

配列の先頭に 1 つ以上の要素を追加し、配列の新しい長さを返します (このメソッドは元の配列を変更します)。

文法:

arr.unshift(要素1, ..., 要素N)

パラメータ:

elementN: 配列の先頭に追加する要素。

戻り値:

このメソッドがオブジェクトに対して呼び出されると、その length プロパティの値が返されます。

ここに画像の説明を挿入

5. 接合

既存の要素を削除または置換するか、新しい要素を追加して配列を変更し、変更された内容を配列として返します。このメソッドは元の配列を変更します。

文法:

配列.splice(開始[, 削除カウント[, 項目1[, 項目2[, ...]]]])

**パラメータ:**

start​​ : 変更の開始位置を指定します(0 からカウント)。配列の長さを超えた場合、配列の末尾からコンテンツが追加されます。負の値の場合は、配列の末尾からのビット数を示します (-1 からカウントします。つまり、-n は末尾から n 番目の要素であり、array.length-n に相当します)。負の数の絶対値が配列の長さより大きい場合は、開始位置が 0 であることを示します。

deleteCount (オプション): 削除する配列要素の数を表す整数。 deleteCount が start 以降の要素の合計数より大きい場合、start 以降のすべての要素 (開始位置を含む) が削除されます。 deleteCount が省略されているか、その値が array.length - start 以上 (つまり、start 以降の要素数以上) の場合、配列の start 以降のすべての要素が削除されます。 deleteCount が 0 または負の場合、要素は削除されません。この場合、少なくとも 1 つの新しい要素を追加する必要があります。

item1, item2, … (オプション): 位置 start から始まる、配列に追加する要素。指定されていない場合、splice() は配列要素を単に削除します。

戻り値:

削除された要素で構成される配列。 1 つの要素のみが削除された場合は、 1 つの要素のみを含む配列が返されます。要素が削除されなかった場合は、空の配列が返されます。

ここに画像の説明を挿入

6. 逆

配列内の要素の位置を反転し、配列を返します。配列の最初の要素が最後の要素になり、配列の最後の要素が最初の要素になります。このメソッドは元の配列を変更します。

文法:

arr.reverse()

戻り値:

逆の配列。

ここに画像の説明を挿入

7. 並べ替え

アルゴリズムを使用して配列の要素をソートし、配列を返します。

文法:

arr.sort([比較関数])

パラメータ:

compareFunction (オプション): 順序を指定するために使用される関数。省略した場合、要素は変換された文字列内の文字の Unicode 位置に従ってソートされます。

1. firstEl : 比較する最初の要素。

2. secondEl : 比較する2番目の要素。

戻り値:

ソートされた配列。

ここに画像の説明を挿入

要約する

この記事はこれで終わりです。皆さんのお役に立てれば幸いです。また、123WORDPRESS.COM のその他のコンテンツにも注目していただければ幸いです。

以下もご興味があるかもしれません:
  • JavaScript配列の一般的なメソッドの概要
  • js の Array.forEach でループを終了する方法の例
  • JavaScript 配列オブジェクトの使用分析
  • JavaScript配列オブジェクトの基本メソッドの詳細な説明
  • js配列オブジェクト操作メソッドのまとめ

<<:  preタグを自動的に折り返すためのサンプルコード

>>:  純粋な CSS で「テキストオーバーフローの切り捨てと省略」を実装するいくつかの方法

推薦する

JavaScript における clientWidth、offsetWidth、scrollWidth の違い

1. コンセプトこれらはすべて Element の属性であり、要素の幅を示します。 Element....

IE ブラウザの HTML ハック タグの概要

コードをコピーコードは次のとおりです。 <!--[if !IE]><!-->...

JavaScript キャンバスはマウスの動きに合わせてボールを動かすことを実装します

この記事の例では、マウスに従ってボールを動かすjsの具体的なコードを参考までに共有しています。具体的...

Docker-compose ネットワークの詳細な例

今日は Docker でのネットワーク設定を試し、後で忘れないようにプロセスを記録しました。 (シス...

CSS3で実装されたグラデーションスライド効果

成果を達成する コードhtml <div class="css-slideshow&...

ウェブページを開いて数秒後に他のページにリダイレクトする

これを実現するには、次のコードを追加するだけです。方法1: メタを使用する使用方法: <Met...

macOS での MySQL 8.0.16 のインストールと設定のグラフィック チュートリアル

この記事では、macOSでのMySQL 8.0.16のインストールと設定のチュートリアルを参考までに...

MySQLクエリのソートとページング関連

概要通常、データベース内のデータを直接表示することは望ましくないため、最後の 2 つのセクションでは...

Springboot プロジェクトの Docker-compose イメージリリースプロセス分析

導入Docker-Compose プロジェクトは、Docker コンテナ クラスターの迅速なオーケス...

Reactはtodolistの追加、削除、変更、クエリを実装します

目次ToDoリストを例に挙げましょうディレクトリは次のとおりですアプリ入力.jsリスト.jsアイテム...

jQueryチェーン呼び出しの詳細な説明

目次チェーン呼び出し小さなケースチェーン呼び出しjQuery オブジェクトが任意のメソッド (ノード...

HTML Web ページにおける URL の表現

HTML では、一般的な URL はさまざまな方法で表現されます。相対 URL:コードをコピーコード...

JavaScriptは4桁のランダム検証コードの生成を実装します

この記事の例では、JavaScriptで4桁のランダムな検証コードを生成する具体的なコードを参考まで...

MYSQL は、指定されたユーザーのランキングとクエリを実装します。ランキング関数 (並列ランキング関数) のサンプルコード

序文この記事は主に、MYSQL でランキングを実現し、指定ユーザーランキング関数 (並列ランキング関...

CSS ロリポップを描くサンプルコード

背景: 毎日少しずつ進歩し、少しずつ積み重ねていけば、どんどん良くなっていきますコード: <!...