JavaScript配列の簡単な紹介

JavaScript配列の簡単な紹介

配列の紹介

配列- Arrayもオブジェクトです

これは通常のオブジェクト関数に似ており、いくつかの値を格納するためにも使用されます。

違いは、通常のオブジェクトは属性値として文字列を使用するのに対し、配列はインデックス操作要素として数値を使用することです。

インデックス: 0から始まる整数

配列の保存パフォーマンスは通常のオブジェクトよりも優れています。開発では、データ保存に配列がよく使用されます。

配列を作成します。

var arr = new Array();
typeof を使用して配列をチェックすると、オブジェクトが返されます。

ここに画像の説明を挿入

配列に要素を追加する

構文: 配列[インデックス] = 値

配列から要素を読み取る

構文: 配列[インデックス]

存在しないインデックスを読み込んだ場合、エラーは報告されず、undefinedが返されます。

配列の長さを取得する

配列の長さ(要素数)を取得するには、 lengthプロパティを使用します。

構文:數組.length

連続配列の場合、 lengthを使用して配列の長さ(要素数)を取得します。

連続していない配列の場合、 length使用すると配列の最大インデックス+1が取得されます。

連続していない配列を作成しないようにしてください。

長さを変更

変更後の長さが元の長さより短い場合、余分な部分は空白のままになります。

変更された長さが元の長さより短い場合、余分な要素は削除されます。

配列の最後の位置に要素を追加する

構文:數組[數組.length] = 值

arr[arr.length] = 70;
arr[arr.length] = 80;
arr[arr.length] = 90;

配列リテラル

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

文法: []

var arr = [] ;

リテラルを使用して配列を作成する場合、配列の作成時に配列内の要素を指定できます。

var arr = [1,2,3,4,5];

コンストラクタを使用して配列を作成する場合、要素を同時に追加することもできます。追加する要素をコンストラクタのパラメータとして渡し、要素を

var arr = 新しい配列(1,2,3,4,5);

知らせ:

[]を使用して要素10の配列を作成します。

var arr = [10];

ここに画像の説明を挿入

コンストラクターを使用して 1 つのパラメーターを持つ配列を作成すると、長さ 10 の空の配列が作成されます。

var arr = 新しい配列(10);
コンソールにログ出力します。
console.log("arr.length="+arr.length);

ここに画像の説明を挿入

配列には任意のデータ型を含めることができます。

var arr = ["孫悟空", 1, true, null, undefined];
コンソールにログ出力します。

ここに画像の説明を挿入

オブジェクトになることができる

var arr = [{name:"孫悟空"}, {name:"朱八戒"}, {name:"沙悟浄"}];
コンソールにログ出力します。

ここに画像の説明を挿入

関数になることができる

var arr = [
    関数(){アラート(1)}、
    関数(){アラート(2)}];

arr[0]()経由で関数を呼び出す

ここに画像の説明を挿入

2次元配列

作成する:

使用[]

var arr = [[1,2,3],[4,5,6],[7,8,9]]; 
//2次元配列の3行3列

new Arrayの使用

  var a = 新しい配列(
			新しい配列(10,20,30)
			新しい配列(11,22,33)
			新しい配列(45,56,67)
		)

要素アクセス配列名 [行添字] [列添字]

(1)二次元配列の転置:

var a = [
    ['a','b','c'],
    ['d','e','f'],
    ['g','h','i'],
    ['i','k','I']
]
var str = ''
for(var i=0;i<a.length;i++){
    (var j=0;j<a[i].length;j++){
        str += a[i][j]+'\t';
    }
    str + = '\n';
}
console.log("転置前:\n",str);
var 変数 = []
(var i=0;i<a[0].length;i++){
    res[i] = []
    (var j=0;j<a.length;j++){
        res[i][j] = a[j][i];
    }
}
console.log("転置後:",res);

ここに画像の説明を挿入

(2)2次元配列を定義し、配列の各行の最大値を出力する

var str = ''
for(var i=0;i<a.length;i++){ //外側のループ: a.length は 2 次元配列の行数を表します for(var j=0;j<a[i].length;j++){ //内側のループ: a[i].length は i 行目の要素 (列) 数を表します
        str += a[i][j]+'\t'
    }
    str += '\n'; //各行の末尾に改行文字を追加します}
コンソールログ(str);
for(var i=0;i<a.length;i++){
    var 最大値 = a[i][0]
    (var j=1;j<a[i].length;j++){
        最大a[i][j]の場合{
            最大値 = a[i][j];
        }
    }
    console.log("行 "+(i+1)+" の最大値は "+max" です)
}

ここに画像の説明を挿入

要約する

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

以下もご興味があるかもしれません:
  • JavaScript で for ループを使用して配列を走査する
  • JavaScript の for ループで配列要素を削除する際の問題
  • JavaScript の for ループと二重 for ループの詳細な説明
  • JavaScript for ループのパフォーマンス テストの例
  • JavaScript の for ループの詳細な理解
  • よく使われるJavaScript配列メソッド
  • JavaScript の基本: ループと配列

<<:  CSS で雨滴アニメーション効果を実装するサンプルコード

>>:  Doubanウェブサイトのウェブサイトコンテンツに小さな変更を加える方法

推薦する

WeChatミニプログラムQRコード生成ツール weapp-qrcode 詳細説明

WeChat ミニプログラム - QR コード ジェネレーターダウンロード: weapp-qrcod...

HTML ページはダーク モードの実装をサポートします

2019年から、AndroidとiOSの両方のプラットフォームでダークモードが使用され始めました。も...

mysql5.7.19 解凍版の詳細なインストール チュートリアル (純粋なクラックされた中国語版 SQLYog を使用)

Mysql5.7.19バージョンは今年リリースされた新しいバージョンです。最近のMySQLのバージ...

HTML 特殊文字エンコーディング CSS3 コンテンツに関する簡単な説明:「私は特別なシンボルです」

プロジェクトで使用されている特殊文字とアイコンHTMLコードXML/HTML コードコンテンツをクリ...

CSS3で実装された炎のアニメーション

成果を達成する実装コードhtml <div class="コンテナ">...

Linux環境でのshadowsocks+polipoグローバルプロキシの設定

1. シャドウソックスをインストールするsudo apt-get install python-pi...

MySQL エラー「すべての派生テーブルには独自のエイリアスが必要です」の解決方法

MySQL は、マルチテーブルクエリを実行するときにエラーを報告します。 [SQL] SELECT ...

Alibaba Cloud Centos6.X でメールを送信する際に発生するさまざまな問題

序文: Webサービスを提供するために、Alibabaクラウドホストを新しくインストールしました。す...

よく使われる3つのMySQLデータ型

MySQL のデータ フィールドのタイプを定義することは、データベースを最適化するために非常に重要で...

JS 正規マッチングの落とし穴の記録

最近、JS の正規表現マッチングの落とし穴を発見したのですが、その時はあまりにも奇妙だったので、何か...

Tomcat サーバーが tomcat7w.exe を開けない場合の解決策

今日、Tomcat サーバーの設定時にちょっとした問題が発生したので、参考までにいくつかご説明したい...

TomcatとJDKのバージョンの対応と各Tomcatバージョンの機能

Apache Tomcat は、Java Servlet および Java Server Pages...

Dockerコンテナのネットワーク管理とネットワーク分離の実装

1. Dockerネットワーク管理1. Dockerコンテナ方式1) Dockerが外部ネットワーク...

NexusはHTTPSプロトコルをサポートするためにnginxプロキシを使用します

背景すべての会社の Web サイトは HTTPS プロトコルをサポートする必要があります。Aliba...

Javascript のスコープとクロージャの詳細

目次1. 範囲2. スコープチェーン3. 語彙の範囲5. 閉鎖の適用6. クロージャの欠陥7. 閉会...