ホームページ > ウェブフロントエンド > jsチュートリアル > JavaScriptで配列要素を削除する方法

JavaScriptで配列要素を削除する方法

藏色散人
リリース: 2023-01-05 16:10:48
オリジナル
11581 人が閲覧しました

配列要素を削除する Javascript メソッド: 1. length 属性を使用して配列要素を削除; 2. delete キーワードを使用して削除; 3. stack メソッドを使用して削除; 4. queue メソッドを使用して削除; 5 、削除されました1. 演算法による除去; 6. 反復法による除去; 7. プロトタイプ法による除去。

JavaScriptで配列要素を削除する方法

この記事の動作環境: Windows7 システム、JavaScript バージョン 1.8.5、Dell G3 コンピューター。

#JavaScript で配列要素を削除する 7 つの方法のまとめ

JavaScript では、Object に加えて、Array 型がおそらく最も一般的に使用される型です。他の言語の配列とは大きく異なり、JavaScript の配列は非常に柔軟です。今日はJavaScriptで配列を削除する方法をまとめます。大まかに分類すると以下のようになります。

1. 長さ
2. 削除
3. スタック方式
4. キュー方式
5. 演算方式
6. イテレーション方式
7. プロトタイプ手法

以下、上記の手法を一つ一つ例を挙げて解説していきます。

1. length

JavaScript中Array的length属性非常有特点一一它不是只读的。因此,通过设置这个属性可以从数组的末尾移除项或添加新项,请看下面例子:
ログイン後にコピー
var colors = ["red", "blue", "grey"];   //创建一个包含3个字符串的数组colors.length = 2;
console.log(colors[2]);  //undefined
ログイン後にコピー

2. deleteKeyword


var arr = [1, 2, 3, 4];delete arr[0];console.log(arr);   //[undefined, 2, 3, 4]
ログイン後にコピー

配列の長さは削除後も変化しませんが、削除された要素は未定義に設定されます。


3. Stack メソッド

var colors = ["red", "blue", "grey"];
var item = colors.pop();
console.log(item);      
//"grey"console.log(colors.length);    
//2
ログイン後にコピー

Pop メソッドが呼び出されると、配列は最後の項目 (「灰色」) を返し、項目が 2 つだけであることがわかります。配列に残った要素。


4. キュー方式

キューのデータ構造のアクセスルールはFIFO(先入れ先出し)で、リストの最後に項目を追加し、項目を削除します。リストの先頭から順に並べ替えます。配列の最初の項目を削除し、配列の長さを 1 減じた値を返すシフト メソッドを使用します。

var colors = ["red", "blue", "grey"];
var item = colors.shift();
console.log(item);      
//"red"console.log(colors.length);    
//2
ログイン後にコピー

5. 操作方法


splice() はおそらく最も強力な配列メソッドであり、さまざまな使用方法がありますが、ここでは配列要素を削除する方法のみを紹介します。 。配列要素を削除する場合、任意の数の項目を削除できます。指定する必要があるのは 2 つのパラメータだけです: 削除する最初の項目の位置と削除する項目の数です。たとえば、splice(0, 2) は削除します配列の最初の項目 2 つの項目。

var colors = ["red", "blue", "grey"];var item = colors.splice(0, 1);console.log(item);      
//"red"console.log(colors);    
//["blue", "grey"]
ログイン後にコピー

[推奨学習:

javascript 上級チュートリアル]

6. 反復手法


いわゆる反復法 ループを使って配列要素を繰り返し、削除対象に一致する項目を削除する方法です。最もよく使用されるのは、配列内の要素がオブジェクトであり、配列の要素がオブジェクトである場合に、その要素を元に削除する場合です。 ID などのオブジェクトの属性。以下に 2 つのメソッドを紹介します。

最初のメソッドは、最も一般的な ForEach ループを使用して要素を比較し、要素が見つかったら削除します。

var colors = ["red", "blue", "grey"];

colors.forEach(function(item, index, arr) {
    if(item == "red") {
        arr.splice(index, 1);
    }
});
ログイン後にコピー

2 つ目のメソッドは、ループ内で filter メソッドを使用します。


var colors = ["red", "blue", "grey"];

colors = colors.filter(function(item) {
    return item != "red"});

console.log(colors);    
//["blue", "grey"]
ログイン後にコピー

コードは非常に単純で、要素が「赤」ではない項目の数を調べ、それを色に返します (実際には、新しい配列が得られます)。削除の影響。


7. プロトタイプ メソッド

削除の目的は、配列プロトタイプにメソッドを追加することで達成されます:

Array.prototype.remove = function(dx) {

    if(isNaN(dx) || dx > this.length){        return false;
    }    for(var i = 0,n = 0;i < this.length; i++) {        if(this[i] != this[dx]) {            this[n++] = this[i];
        }
    }    this.length -= 1;
};var colors = ["red", "blue", "grey"];
colors.remove(1);

console.log(colors);    //["red", "grey"]
ログイン後にコピー

ここでは、削除メソッドが配列に追加されます。 .プロトタイプ オブジェクト、この環境内のすべての Array オブジェクトはこのメソッドを使用できます。変更することは可能ですが、運用アプリケーションでネイティブ オブジェクト プロトタイプを変更することはお勧めしません。理由は簡単で、実装に特定のメソッドが欠落しているためにこのメソッドをネイティブ オブジェクトのプロトタイプに追加すると、このメソッドをサポートする別の実装でコードを実行したときに名前の競合が発生する可能性があります。そうすると、誤ってネイティブ メソッドをオーバーライドしてしまう可能性があります。


ここでは、JavaScript 配列の要素を削除する一般的な方法をまとめましたので、どなたでも追加していただけます。

以上がJavaScriptで配列要素を削除する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート