JavaScript の配列の追加、削除、変更、確認 学習メモ_JavaScript スキル
プログラミング言語における配列の重要性は自明のことですが、JavaScript の配列は最も一般的に使用されるオブジェクトの 1 つであり、弱い型であるため、非常に柔軟で強力です。同じ型またはそのサブタイプの要素のみを格納できる Java などの厳密に型指定された高級言語の配列とは異なり、JavaScript は複数の型の要素を同じ配列に格納でき、長さを動的に調整することもできます。データが増加するにつれて、または配列の長さの自動変更を減らします。
配列は JavaScript の一般的なオブジェクトであり、配列の追加、削除、変更、チェックなどの古典的な操作がいくつかあります。この記事では、これに関連する操作方法を中心にまとめます。
配列項目を追加
まず、配列項目を配列に追加する方法を見てみましょう。次の配列があるとします:
var arr = [];
上記は配列を宣言していますが、この配列は空の配列 [] であり、その長さの値は 0 です。次に、配列項目を配列 arr に追加する方法を見ていきます。最も簡単な方法は、インデックス値を使用して配列項目を配列に追加することです:
var arr = []; arr[0] = 'a'; arr[1] = 'b'; arr[2] = 1; arr[3] = 2; console.log(arr); // ["a", "b", 1, 2] console.log(arr.length); // 4
さらに、配列の長さの値を変更して配列項目を配列に追加することもできますが、この方法で配列に追加された配列項目はすべて未定義です :
var arr = []; arr[0] = 'a'; // 给数组arr添加一个`a`数组项 arr.length = 5; // 改变数组的`length`值为`5` console.log(arr); // ["a", undefined × 4]
この方法でも配列項目を配列に追加しますが、比較的面倒です。実際、配列項目を配列に追加することは、配列が提供するネイティブ メソッドを通じて、それほど面倒ではありません。
push()
push() メソッドを使用して、1 つ以上の配列項目を配列の末尾に追加します。
var arr = []; arr.push('a','b'); console.log(arr); // ['a','b'] unshift()
push() メソッドを使用して 1 つ以上の配列項目を配列の末尾に追加し、次に unshift() メソッドを使用して 1 つ以上の配列項目を配列の先頭に追加します。
var arr = ['a','b']; arr.unshift(1,2); console.log(arr); // [1, 2, "a", "b"]
これら 2 つのメソッドに加えて、splice() メソッドを使用して配列項目を配列に追加することもできます。
var arr = ['a','b','c',1,2]; arr.splice(2,0,'d','c','e'); console.log(arr); // ["a", "b", "d", "c", "e", "c", 1, 2]
splice() メソッドに加えて、concat() メソッドを使用して配列項目を配列に追加することもできます。ただし、このメソッドを使用すると、元の配列は変更されませんが、元の配列に新しい配列が作成されます。配列:
var arr = ['a','b','c']; var arr2 = arr.concat('d',1,2,['e',3]); console.log(arr); // ["a", "b", "c"] console.log(arr2); // ["a", "b", "c", "d", 1, 2, "e", 3]
配列項目を削除
配列操作では、配列項目の追加に加えて、配列の削除が必要になることがよくあります。配列項目を削除するために一般的に使用されるメソッドは、pop() と SHIFT() です。
ポップ()
pop() メソッドは、配列の末尾から配列項目を削除できます。
var arr = ['a','b','c','d',1,2]; arr.pop(); console.log(arr); // ["a", "b", "c", "d", 1]
shift()
shift() メソッドは、pop() メソッドの逆で、配列の最初の項目を削除できます。
var arr = ['a','b','c','d',1,2]; arr.shift(); console.log(arr); // ["b", "c", "d", 1, 2]
pop() メソッドでも、shift() メソッドでも、一度に配列から削除できる配列項目は 1 つだけですが、多くの場合、この方法で配列項目を削除するのは比較的面倒です。配列操作では、これら 2 つのメソッドに加えて、slice() メソッドと splice() メソッドを使用して配列項目を削除することもできます。
スライス()
slice() メソッドは配列から複数の配列項目を削除できますが、異なる点は、slice() は元の配列には影響せず、元の配列に基づいて配列のコピーを作成するだけであることです。
var arr = [1,2,3,4,'a','b']; var arr2 = arr.slice(2); console.log(arr); // [1, 2, 3, 4, "a", "b"] console.log(arr2); // [3, 4, "a", "b"] console.log(arr3); // ["a", "b"]
スプライス()
splice() メソッドは、配列項目を配列に追加するだけでなく、配列から配列項目を削除することもできます。
var arr = [1,2,3,4,'a','b','c']; var arr2 = arr.splice(2,2); console.log(arr); // [1, 2, "a", "b", "c"] console.log(arr2); // [3, 4]
配列の変更
配列の splice() メソッドは、配列の強力なメソッドであり、配列項目を配列に追加したり削除したりできるだけでなく、配列を変更することもできます。
var arr = [1,2,3,4,5,6]; var arr2 = arr.splice(2,3,'a','b','c'); console.log(arr); // [1, 2, "a", "b", "c", 6] console.log(arr2); // [3, 4, 5]
配列クエリ
ここで説明する配列クエリは、実際には配列のクエリ抽出を指します。使用されるメソッドは、slice() メソッドです:
var arr = [1,2,3,4,5,6]; var arr2 = arr.slice(-3); console.log(arr); // [1, 2, 3, 4, 5, 6] console.log(arr2); // [4, 5, 6]
概要
ここでは、配列の追加、削除、変更、チェックに関連するメソッドの簡単な概要を示します。簡単に要約すると:
配列項目を追加する方法: 配列項目の値を直接変更し、配列の長さを変更して配列項目を配列に追加するほかに、push()、unshift()、concat() を使用することもできます。および splice() で配列項目を追加します
配列項目を削除するメソッド: 配列項目を削除するメソッドには、pop()、shift()、slice()、splice() メソッドが含まれます
配列項目の変更方法: 配列では、主に splice() メソッドを使用して配列項目を変更します
配列項目のクエリ メソッド: 配列項目のクエリ メソッドは、実際には配列のクエリおよび抽出関数であり、使用される主なメソッドは、slice() メソッドです
。
pop()、push()、shift()、および unshift() の操作メソッドの詳細については、ここをクリックしてください。concat()、slice() および splice() メソッドの関連する紹介については、ここをクリックしてください。
ここではエディターがJavaScriptの学習メモとして配列の追加、削除、変更、検索について紹介していきますので、お役に立てれば幸いです。 JavaScript についてさらに詳しく知りたい場合は、スクリプト ハウスの公式 Web サイトをご覧ください。

ホットAIツール

Undresser.AI Undress
リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover
写真から衣服を削除するオンライン AI ツール。

Undress AI Tool
脱衣画像を無料で

Clothoff.io
AI衣類リムーバー

Video Face Swap
完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

人気の記事

ホットツール

メモ帳++7.3.1
使いやすく無料のコードエディター

SublimeText3 中国語版
中国語版、とても使いやすい

ゼンドスタジオ 13.0.1
強力な PHP 統合開発環境

ドリームウィーバー CS6
ビジュアル Web 開発ツール

SublimeText3 Mac版
神レベルのコード編集ソフト(SublimeText3)

ホットトピック











フロントエンドのサーマルペーパーチケット印刷のためのよくある質問とソリューションフロントエンド開発におけるチケット印刷は、一般的な要件です。しかし、多くの開発者が実装しています...

スキルや業界のニーズに応じて、PythonおよびJavaScript開発者には絶対的な給与はありません。 1. Pythonは、データサイエンスと機械学習でさらに支払われる場合があります。 2。JavaScriptは、フロントエンドとフルスタックの開発に大きな需要があり、その給与もかなりです。 3。影響要因には、経験、地理的位置、会社の規模、特定のスキルが含まれます。

JavaScriptは現代のWeb開発の基礎であり、その主な機能には、イベント駆動型のプログラミング、動的コンテンツ生成、非同期プログラミングが含まれます。 1)イベント駆動型プログラミングにより、Webページはユーザー操作に応じて動的に変更できます。 2)動的コンテンツ生成により、条件に応じてページコンテンツを調整できます。 3)非同期プログラミングにより、ユーザーインターフェイスがブロックされないようにします。 JavaScriptは、Webインタラクション、シングルページアプリケーション、サーバー側の開発で広く使用されており、ユーザーエクスペリエンスとクロスプラットフォーム開発の柔軟性を大幅に改善しています。

同じIDを持つ配列要素をJavaScriptの1つのオブジェクトにマージする方法は?データを処理するとき、私たちはしばしば同じIDを持つ必要性に遭遇します...

JavaScriptを学ぶことは難しくありませんが、挑戦的です。 1)変数、データ型、関数などの基本概念を理解します。2)非同期プログラミングをマスターし、イベントループを通じて実装します。 3)DOM操作を使用し、非同期リクエストを処理することを約束します。 4)一般的な間違いを避け、デバッグテクニックを使用します。 5)パフォーマンスを最適化し、ベストプラクティスに従ってください。

この記事の視差スクロールと要素のアニメーション効果の実現に関する議論では、Shiseidoの公式ウェブサイト(https://www.shisido.co.co.jp/sb/wonderland/)と同様の達成方法について説明します。

フロントエンドのVSCodeと同様に、パネルドラッグアンドドロップ調整機能の実装を調べます。フロントエンド開発では、VSCODEと同様のVSCODEを実装する方法...

Console.log出力の違いの根本原因に関する詳細な議論。この記事では、Console.log関数の出力結果の違いをコードの一部で分析し、その背後にある理由を説明します。 �...
