JavaScript配列についてさらに詳しく知るのに役立つ記事

JavaScript配列についてさらに詳しく知るのに役立つ記事

配列: 順序付けられたデータの集合

1. 配列の役割:

一度に複数のデータを保存できる

2. 配列の定義:

1. コンストラクタを通じて配列を作成する

文法:

var 配列名 = new Array();
var array = new Array(); // 配列を定義します

//コンストラクタを通じて配列を定義する var array = new Array(); //データのない空の配列

配列内のデータが直接出力される場合は、配列内のデータを直接表示できます。データがない場合、データは表示されません。

var 配列名 = new Array(長さ);

配列にデータがないが長さがある場合、配列内の各値は未定義になります。

コンストラクタを使用して配列を作成する場合、Array(数値)の場合→インデックス配列の長さ(つまり配列要素の数)を参照します。Array(複数の値)の場合→配列にデータがあることを意味し、配列の長さはそのデータの数になります。

2. リテラルを使用して配列を作成する

文法:

var array name = []; // 空の配列

var arr = [];
console.log(arr); //配列[0]

要約:

配列がコンストラクターまたはリテラルによって定義されているかどうかに関係なく、配列に長さがある場合は、デフォルトで undefined になります。

配列要素

配列に格納されている各データは、配列の要素と呼ぶことができます。

たとえば、配列に3つの配列が格納されている場合、この配列には3つの要素があります。

4. 配列の長さ

配列の長さは要素の数です

たとえば、要素が 3 つある場合、配列の長さは 3 になります。

var arr1 = new Array(); //コンストラクタを使用して空の配列を作成します var arrr2 = new Array(5); //コンストラクタを使用して長さ 5 の配列を作成します。この配列には 5 つの値があり、すべて未定義です
var arr3 = new Array(10,20,30,40,50); // コンストラクタは長さ5の配列を作成し、各値には意味があります

5. 配列インデックス(添え字)

配列のインデックス、または配列の添え字。これは、0から始まり長さ-1で終わる配列内のデータを保存またはアクセスするために使用されます。

配列内の位置の値を設定する方法:

配列名[添え字]=値;

例えば:arr[3]=100;

配列内の特定の位置にある値を取得する方法:

var result=配列名[添え字];

console.log(結果);

//配列の4番目の値を取得します。var arr =new Array(10,20,30,40,100);
コンソール.log(arr[4]); //100
// 添え字3の値を1000に変更します
ar[3] = 1000;
//リテラル​​値を使用して配列の長さを取得します。var arr1=[10,20,30,40,50,12];
console.log(arr.length); //6

配列の長さとインデックスの関係:

長さ - 1 = インデックス

6. 配列を使用する際に注意すべき点

1. 配列に格納されるデータは異なる可能性がある

arr=[10,"哈哈",true,null,undefined,new Object()];

2. 配列の長さは変更可能

var arr = [];
    // 配列内の要素の値をインデックスで設定します arr[0] = 10;
    ar[1] = 20;
    console.log(arr.length); //2
    // インデックスで要素の値を取得する console.log(arr[2]); //undefined

3. まとめ

var arr1 = new Array(); // 空の配列 var arr2 = new Array(5); // 長さ 5 の配列、各配列の値は未定義
var arr3 = new Array(1, 2, 3, 4, 5); //長さ 5 の配列、各値に意味があります var arr4 = []; //空の配列 var arr5 = [1, 2, 3]; //長さ 3 の配列 var arr6 = ["red", "blue", 1, true]; //長さ 4 の配列、要素のデータ型が異なります var arr7 = [];
//空の配列を宣言し、配列に値を追加します。arr7[0] = 10;
ar7[1] = 30;

7. 配列の走査

1. 正の順序の走査

var arr=[10,20,30,40,50,60,70,80,90,100];
// i は配列の添え字を表します // 最後の数字の添え字は配列の長さから 1 を引いた値に等しくなります for(var i=0;i<arr.length;i++){
    コンソールにログ出力します。
}

2. 逆順トラバーサル

var arr = [10, 20, 30, 40, 100];
// i は最後の数字を出力し始め、0 に達するとループを終了します for (var i = arr.length - 1; i >= 0; i--) {
    コンソールにログ出力します。
}

8. 配列の一般的なケース

1. 配列内のすべての要素の合計を求める

var arr = [10, 20, 30, 40, 100];
// 加算後の合計を格納するために使用されます var sum = 0;
 (var i = 0; i < arr.length; i++) の場合 {
     合計 += arr[i];
 }
 コンソール.log(合計); //200

2. 配列の平均を求める

var arr = [10, 20, 30, 40, 100];
// 加算後の合計を格納するために使用されます var sum = 0;
(var i = 0; i < arr.length; i++) の場合 {
    合計 += arr[i];
}
console.log(合計 / arr.length); //40

3.配列の最大値と最小値を見つける

var arr = [10, 20, 30, 40, 100];
// 配列の最初の数値が最大であると仮定し、それを変数に割り当てます var max = arr[0];
// 配列の最初の数値が最小であると仮定し、それを変数に割り当てます var min = arr[0];
(var i = 0; i < arr.length; i++) の場合 {
    //配列の値をmaxと比較します。maxより大きい場合は、その数値をmaxに代入します。
    (最大値<arr[i])の場合{
        最大値 = arr[i];
    }
    //配列内の値を min と比較します。min より小さい場合は、その数値を min に割り当てます。
    もし(最小値>arr[i])であれば
        最小値 = arr[i];
    }
}
コンソール.log(最大); //100
コンソール.log(分); //10

4. バブルソート

var arr = [10, 30, 20, 65, 40, 8, 100];
//小さいものから大きいものへ並べ替える for (var i = 0; i < arr.length; i++) {
    (var j = 0; j < arr.length - i; j++) の場合 {
        もし(arr[j] > arr[j + 1]) {
            var temp = arr[j];
            arr[j] = arr[j + 1];
            arr[j + 1] = 温度;
        }
    }
}
コンソールにログ出力します。
//大きいものから小さいものへ並べ替える for (var i = 0; i < arr.length; i++) {
    (var j = 0; j < arr.length - i; j++) の場合 {
        もし(arr[j] < arr[j + 1]) {
            var temp = arr[j];
            arr[j] = arr[j + 1];
            arr[j + 1] = 温度;
        }
    }
}
コンソールにログ出力します。

バブルソート

要約する

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

以下もご興味があるかもしれません:
  • JS配列の一般的な方法とテクニックを学び、マスターになりましょう
  • JavaScript 配列重複排除問題の詳細な研究
  • Javascript配列の重複排除のいくつかの方法の詳細な説明
  • JavaScript配列重複排除の詳細な説明
  • JavaScript配列の一般的なメソッドの例のまとめ
  • JavaScript 配列と非配列オブジェクトのディープ クローンとシャロー クローンの原則の詳細な説明

<<:  DCL を使用して MySQL でユーザーを管理し、権限を制御する方法

>>:  docker ベースの mariadb のインストール構成プロセスの分析

推薦する

MySQL スケジュールされたデータベース バックアップ操作の例

この記事では、MySQL のスケジュールされたデータベース バックアップ操作の例について説明します。...

CSS メニューボタンアニメーション

ドロップダウンメニューを書くには、ボタンをクリックします。メニューの入り口はアイコンボタンをクリック...

Mac での MySql の詳細なインストールと構成

1.ダウンロードしてインストールする公式ウェブサイトからコミュニティ エディションの dmg インス...

jQueryは要素を追加した後に元のイベントが実行されない問題を解決します

まずエラーコードを見てみましょう。 html: <テーブルボーダー="1"...

均一なアニメーション効果を実現するJavaScript

この記事の例では、JavaScriptで等速アニメーションを実装するための具体的なコードを参考までに...

MySQL が大規模トランザクションを避けるべき理由とその解決方法

何が大問題ですか?長時間実行され、長時間コミットされないトランザクションは、大規模トランザクションと...

Harborを使用してプライベートDockerリポジトリを構築する方法

目次1. オープンソースの倉庫管理ツール Harbor 2 インストール2.1 DockerとDoc...

HTML テーブル マークアップ チュートリアル (2): テーブル境界属性 BORDER

デフォルトでは、テーブルの境界線は 0 ですが、テーブルの境界線を設定できます。基本的な構文<...

Ubuntu で nvidia グラフィック ドライバーをインストールする (簡単なインストール方法)

Ubuntu で nvidia グラフィック カード ドライバーをインストールします。同じ方法で ...

HTML テーブル タグ チュートリアル (36): テーブル ヘッダーの背景色属性 BGCOLOR

<TH> タグは、テーブル内のヘッダーのプロパティを設定するために使用されます。以下の...

MySQLトランザクションとMySQLログの詳細な説明

取引特性1. アトミック性: トランザクションの開始後、すべての操作が完了するか、まったく実行されな...

ElementUIはカスケードセレクタを実装します

この記事の例では、カスケードセレクターを実装するためのelementUIの具体的なコードを参考までに...

docker-compose を使用して mongodb と mysql を構築する詳細なプロセス

docker-compose で mongodb と mysql を構築する詳細な方法を見てみましょ...

vue-router のハッシュモードと履歴モードの違い

vue-routerには2つのモードがありますハッシュモード履歴モード1. シングルページアプリケー...

コードを通じてHTMLエスケープ文字を識別する方法について説明します

データ内に次のような特徴を持つ「 ' 」などの文字が含まれることがあります。 &# ...