この記事で理解したように、変数に格納できる値は 1 つだけです。 どれだけ努力しても 変数に複数の値を書き込むことはありません.

特定の変数 z を宣言し、それに値 8 を割り当てるとします。コードの下位のどこかで、同じ変数に別の値、たとえば 3 を割り当てると、古い値は消え、その場所に新しい値が書き込まれます。 。

また、変数に複数の値を書き込めるようにするには、配列などのデータ型を使用する必要があります。

配列任意の型の値を無制限に変数に一度に書き込むことができます。

以前の JavaScript では、配列は次のように宣言されていました。

Var arr = 新しい配列 (7, 8, "k", "v", 3.2, 4);

時代は変わり、 現在、配列は別の方法で宣言されています、さらに短縮されます。 要素もカンマで区切ってリストされますが、単純な角括弧の中に入れられます。

変数 arr = [ 7, 8, "k", "v", 3.2, 4 ];

これで、arr 変数には次の内容が含まれます 1次元データ配列、さまざまな種類があります。

配列の各要素には独自のインデックスがあります。 ご了承ください。 インデックスはゼロから始まります。 配列内の要素の位置を示すために使用されます。

配列構造次のようになります:

配列の要素にアクセスするには、配列の名前を記述する必要があります。また、角括弧内に取得する要素のインデックスを示します。

たとえば、インデックスが 2、つまり文字「k」の要素を表示してみましょう。

Document.write("

インデックスが 2 の配列要素 arr を表示します: " + arr + "

); //k

もしそうしたい場合はどうしますか すべての配列要素を表示。 そこに要素がほとんどない場合は、例のように、arr、arr、arr のように、それぞれに個別にアクセスできます。

ただし、配列に 100 個の要素が含まれている場合、このオプションは機能しません。 ここではすでに を使用する必要があります。

配列の反復処理に進む前に、プロパティについて紹介します。 長さ。 これは普遍的なプロパティであり、 配列の長さを調べます、つまり配列内の要素の総数です。 文字列の長さを調べるためにも使用できます。

楽しみのために、arr 配列の長さを調べてみましょう。

Document.write("

配列の要素数 arr = " + arr.length + "

); // 結果: 6

ここで、すべての要素を一度に表示するには、 ループを使用して配列全体を反復する必要があります.

For(var i = 0; i< arr.length; i++){ document.write("

配列要素 arr、インデックス付き 「+i+」は次と同じです: " + arr[i] + "

"); }

ブラウザでこのページを開くと、次の画像が表示されます。

練習するには、残りのループ、while および do-while を使用して、「arr」配列を反復処理してみてください。

別の単純で短いバージョンの検索もあります 小さな配列。 これは、alert メソッドを使用して配列の各要素を表示できるという事実にあります。 まず、配列自体の名前を記述します。または、角括弧内の要素のリストをすぐに指定することもできます。 次に、forEach 関数を記述し、かっこなしでアラート メソッドをパラメーターとして記述します。

Arr.forEach(アラート);

ここでブラウザでページを開くと、配列の各要素が 1 つずつ表示されます。

ループを使用して配列を埋める

たとえば、ある配列に九九の結果を1から10まで書き込んでみましょう。

まず、空の配列を宣言する必要があります。これに値を入力します。 次に、変数を宣言し、すぐに値 0 を割り当てる必要があります。この変数は、宣言された配列のインデックスとして機能します。 次のステップでは、ループ内のループなどの手法を使用して配列自体を埋めます。

//空の配列を宣言 var new_arr = ; // 配列のインデックスとしての変数 new_arr var k = 0; for(var i = 1; i

このページをブラウザで開くと、次の結果が表示されます。

最初、変数 i は 1 に等しくなります。 そして、これに変数 j のすべての値を乗算します。 2 番目のループを 10 回実行した後、最初のループに戻り、変数 i を 1 ずつインクリメントします。 これで、私は 2 に等しくなります。 再び 2 番目のループに進み、値 2 に変数 j のすべての値 (1 から 10) を乗算します。 結果は 2 行目です: 2 4 6 8 ... 20。これは変数 i が 11 に等しくなるまで続きます。この値になるとすぐにループを終了します。

配列のすべての要素の合計を計算してみましょう

100 個の数値 (九九全体) を格納する配列 new_arr があります。 次に、これらすべての要素の合計を計算してみましょう。

//合計の変数を作成します var summ = 0; for(var i = 0; i< new_arr.length; i++){ summ += new_arr[i]; } document.write("

new_arr 配列の要素の合計は、「 + summ + 」と等しくなります。

"); //結果 3025

この記事で伝えたかったのはこれだけです。 今ならわかります 配列を作成する方法、配列を埋める方法そしてそれをどのように扱うか。

実際には、配列はプログラミングにおいて非常に重要であるため、非常に一般的です。 彼らをよく知っています.

この記事では、数値インデックスを持つ標準的な JavaScript 配列について説明します。 配列は角括弧を使用して宣言されます。

var フルーツ = ["リンゴ", "オレンジ", "ロバ"]

要素を取得するには、そのインデックスを次の場所に置きます。 角括弧。 最初のインデックス 0 :

var フルーツ = ["リンゴ", "オレンジ", "ロバ"] アラート(フルーツ) アラート(フルーツ) アラート(フルーツ)

JavaScript 配列の長さを取得することもできます。

var Fruits = ["リンゴ", "オレンジ", "ロバ"]alert(fruits.length)

おっと！ 2 つの果物と 1 頭のロバを含む配列を作成しました。 次に、ロバを取り除く必要があります。

ポップメソッドとプッシュメソッド

JavaScript の Pop メソッドは、配列から要素を削除してそれを返します。

次の例は、配列から「Donkey」を取得する方法を示しています。

var Fruit = ["Apple", "Orange", "Donkey"] alter("I'm Remove "+fruits.pop()) // これで、["Apple","Orange"] のみになりました。alert("Now配列のサイズ : "+fruits.length) // ロバが削除されました

Pop は配列自体を変更することに注意してください。

Pop に相当するのは、要素を配列に追加する Push メソッドです。 たとえば、桃を追加するのを忘れていました。

var フルーツ = ["リンゴ", "オレンジ"] フルーツ.push("桃"); // これで ["Apple", "Orange", "Peach"] ができました。alert("Last element:"+fruits)

1. 要素を含むスタイルの配列を作成します。 ジャズ”, “ブルース”;
2. 値を追加します。 ロックンロール«;
3. 末尾から 2 番目の値を値「」に置き換えます。 クラシック」。 最終的には次のような配列になるはずです。 ジャズ”, ”クラシック”, ”ロックンロール」 このコードは、任意の配列長に対して機能するはずです。
4. 配列から最後の値を取得し、alert を介して表示します。

解決

// 1 varstyles = ["Jazz", "Bluez"] // 2styles.push("Rock"n"Roll") // または:styles = "Rock"n"Roll" // 3styles = "Classic " // 4 アラート(styles.pop())

シフト/シフト解除メソッド

シフト/シフト解除メソッドは配列の末尾で動作しますが、シフトを使用して要素を上にシフトすることもできます ( 要素をシフトすることで配列の最初の値が削除されます）。 unshift メソッドを使用すると、JavaScript で配列の末尾から要素を追加できます。

var Fruits = ["Apple", "Orange"] var apple = Fruits.shift() // 現在は ["Orange"] のみです Fruits.unshift("Lemon") // 現在は ["Lemon", "オレンジ"]alert(fruits.length) // 2

シフトとシフト解除は両方とも、複数の要素を同時に操作できます。

var Fruit = ["Apple"] Fruits.push("Orange","Peach") Fruits.unshift("Pineapple","Lemon") // 配列は次のようになります: ["Pineapple", "Lemon", 「リンゴ」「オレンジ」「ピーチ」】

自己管理タスク

アラートを介して arr 配列からランダムな値を表示するコードを作成します。

var arr = ["プラム","オレンジ","ロバ","ニンジン","JavaScript"]

注: 最小値から最大値まで (両端を含む) の乱数を取得するコードは次のとおりです。

var rand = min + Math.floor(Math.random()*(max+1-min))

解決

抽出する必要があります 乱数 0 ～ arr.length-1 (両端を含む):

var arr = ["プラム","オレンジ","ロバ","ニンジン","JavaScript"] var rand = Math.floor(Math.random()*arr.length)alert(arr)

配列の反復処理

JavaScript では、配列の反復処理は for ループを使用して行われます。

var フルーツ = ["パイナップル", "レモン", "リンゴ", "オレンジ", "ピーチ"] for(var i=0; i

自己管理タスク

指定された配列内の値を検索し、そのインデックスを返す関数 find(arr,value) を作成します。値が見つからない場合は -1 を返します。

例えば：

arr = [ "test", 2, 1.5, false ] find(arr, "test") // 0 find(arr, 2) // 1 find(arr, 1.5) // 2 find(arr, 0) // -1

解決

考えられる解決策は次のようになります。

関数 find(配列, 値) (for(var i=0; i

しかし、 == は 0 と false の違いを定義していないため、これは正しくありません。

JavaScript で配列を操作する場合は、=== を使用する方が正確です。 さらに、最新の ES5 標準には Array#indexOf 関数が含まれています。 これを使用すると、次のような関数を定義できます。

function find(array, value) (if (array.indexOf) return array.indexOf(value) for(var i=0; i

さらに賢いのは、indexOf メソッドが存在するかどうかを確認する条件を指定して find を定義することです。

自己管理タスク

配列を受け取り、 arr からの数値のみを含む新しい配列を返す関数 filterNumeric(arr) を作成します。

これがどのように機能するかの例:

arr = ["a", 1, "b", 2]; arr = フィルター数値(arr); // これでarr =

解決

解決策は、配列を反復処理し、値が数値の場合は新しい配列に値を追加することです。

結合して分割する

JavaScript 配列を文字列に変換する簡単な方法が必要な場合があります。 これが join メソッドの目的です。

指定された区切り文字を使用して、配列を文字列に連結します。

var フルーツ = ["レモン","リンゴ","オレンジ","ピーチ"]; var str = Fruit.join(", "); アラート(文字列);

逆変換は、split メソッドを使用して簡単に実行できます。

var フルーツ = "リンゴ、オレンジ、ピーチ"; var arr = フルーツ.split(","); // arr には ["Apple", "Orange", "Peach"] が含まれるようになりました

自己管理タスク

オブジェクトには className プロパティが含まれており、これにはスペースで区切られたクラス名が含まれます。

クラス cls を追加する関数 addClass(obj, cls) を作成しますが、クラスが存在しない場合に限ります。

ddClass(obj, "new") // obj.className="open menu new" addClass(obj, "open") // 変更なし (クラスはすでに存在します) addClass(obj, "me") // obj.className= 「新しいメニューを開く」alert(obj.className) //

解決

className とループを複数の部分に分割する必要があります。 クラスが見つからない場合は追加されます。

ループはパフォーマンスを向上させるためにわずかに最適化されています。

function addClass(elem, cls) (for(var c = elem.className.split(" "), i=c.length-1; i>=0; i--) (if (c[i] == cls) ) return ) elem.className += " "+cls ) var obj = ( className: "メニューを開く" ) addClass(obj, "new") addClass(obj, "open") alter(obj.className) // メニューを開く新しい

上の例では、変数 c がループの先頭で定義され、その最後のインデックスが i に設定されます。

ループ自体は逆方向に処理され、条件 i>=0 で終了します。 i>=0 は i よりも検査が速いためです。 JavaScript では、配列内の検索を高速化します。

長さを使用して配列をトリミングする

length プロパティを使用すると、次のように配列を切り詰めることができます。

長さを指定すると、ブラウザによって配列が切り捨てられます。

配列はオブジェクトですが、これは何を意味するのでしょうか?

実際、JavaScript では、配列は自動長さ設定と特別なメソッドを備えたオブジェクトです。

これは、配列がメモリの連続したセグメントを表す他の言語の概念とは異なります。 これは、リンク リストに基づくキューやスタックとも異なります。

数値以外の配列キー

キーは数字ですが、任意の名前を付けることができます。

arr = arr = 5 arr.prop = 10 // これは行わないでください

JavaScript では、配列はハッシュ テーブルであり、パフォーマンス上の利点もありますが、いくつかの欠点もあります。

たとえば、プッシュ/ポップは配列の最も外側の要素に対してのみ機能するため、信じられないほど高速です。

プッシュは末尾でのみ機能します。

var arr = ["My", "array"] arr.push("something") alter(arr) // string "array"

シフト/シフト解除メソッドは、配列全体の番号を付け直す必要があるため、時間がかかります。 スプライス方法によっても番号付けが変更される場合があります。

したがって、shift/unshift は Push/pop よりも遅くなります。 配列が大きくなるほど、JavaScript が配列を並べ替えるのにかかる時間が長くなります。

自己管理タスク

結果はどうなるでしょうか？ なぜ？

arr = ["a", "b"] arr.push(function() (alert(this) )) arr() // ?

解決

配列はオブジェクトなので、arr ..実際には、obj などのオブジェクトに対するメソッド呼び出しです。 方法:

arr() // arr() と同じ // これは構文的には間違っていますが、概念的には同じです: arr.2() // obj.method() と同じスタイルで書き直されました この場合、 this = arr が関数なので、arr の内容が出力されます。 arr = ["a", "b"] arr.push(function() (alert(this) )) arr() // "a","b",function

スパース配列、長さの説明

length プロパティを使用すると、JavaScript の配列のサイズではなく、最後のインデックス + 1 を取得できます。 これは、インデックスに「ギャップ」がある疎な配列について話しているときに重要です。

次の例では、空の Fruit に 2 つの要素を追加しますが、長さの値は 100 のままです。

var フルーツ = // 空の配列 フルーツ = "桃" フルーツ = "リンゴ"alert(fruits.length) // 100 (ただし、配列には 2 つの要素しかありません)

スパース配列を出力しようとすると、ブラウザは欠落しているインデックス値を空の要素として返します。

var Fruits = // 空の配列 Fruits = "Peach" Fruits = "Apple"alert(fruits) // ,Peach,Apple (またはそのようなもの)

ただし、配列は 2 つのキーを持つオブジェクトです。 欠損値はスペースを取りません。

スパース配列は、配列メソッドが適用されると奇妙な動作をします。 彼らはインデックスが欠落していることを知りません。

var Fruits = Fruits = "Peach" Fruits = "Apple" alter(fruits.pop()) // "Apple" をポップします (インデックス 9 に) alter(fruits.pop()) // 指定されていない要素をポップします (インデックス 8 に) )

スパース配列は避けるようにしてください。 いずれにせよ、彼らの手法は正常に機能しません。 代わりにオブジェクトを使用してください。

配列からの削除

ご存知のとおり、配列はオブジェクトなので、値を削除するには delete を使用できます。

var arr = ["Go", "to", "home"] delete arr // 今、 arr = ["Go", unknown, "home"] alter(arr) // 定義されていません

値が削除されたことがわかりますが、配列には指定されていない要素が含まれているため、期待どおりには削除されません。

delete 演算子はキーと値のペアを削除するだけです。 当然のことながら、配列は単なるハッシュであるため、削除された要素の位置は不定になります。

ほとんどの場合、インデックス間に「穴」を残さずに要素を削除する必要があります。 これに役立つ別の方法があります。

スプライス方法

splice メソッドは要素を削除し、JavaScript で置き換えることができます。 多次元配列。 その構文は次のとおりです。

arr.splice(インデックス, deleteCount[, elem1, ..., elemN])

インデックスから始まる deleteCount 要素を削除し、その場所に elem1、...、elemN を挿入します。

いくつかの例を見てみましょう。

var arr = ["Go", "to", "home"] arr.splice(1, 1) // インデックス 1 から始まる 1 つの要素を削除します alter(arr.join(",")) // ["Go " 、「ホーム」] (1 つの要素が削除されました)

したがって、splice を使用して配列から 1 つの要素を削除できます。 配列要素番号はスペースを埋めるためにシフトされます。

var arr = ["Go", "to", "home"] arr.splice(0, 1) // インデックス 0 から開始して 1 つの要素を削除しますalert(arr) // "to" が最初の要素になりました

次の例は、要素を置換する方法を示しています。

splice メソッドは、削除された要素の配列を返します。

var arr = [「行く」、「行く」、「家」、「今」]; // 最初の 2 つの要素を削除します var selected = arr.splice(0, 2) alter(removed) // "Go", "to"<-- массив удаленных элементов splice может вставлять элементы, задайте 0 для deleteCount. var arr = ["Go", "to", "home"]; // со второй позиции // удаляем 0 // и вставляем "my", "sweet" arr.splice(2, 0, "my", "sweet") alert(arr) // "Go", "to", "my", "sweet", "home"

このメソッドでは、配列の末尾から数えられる負のインデックスも使用できます。

var arr = // 要素 -1 (最後から 2 番目) の場合 // 0 個の要素を削除し、 // 3 と 4 を挿入します arr.splice(-1, 0, 3, 4) alter(arr) // 1,2,3, 4.5

自己管理タスク

オブジェクトには className プロパティが含まれており、これにはスペースで区切られたクラス名が含まれます。

var obj = (クラス名: "メニューを開く")

クラス cls が指定されている場合はそれを削除する関数 RemoveClass(obj, cls) を作成します。

RemoveClass(obj, "open") // obj.className="menu" RemoveClass(obj, "blabla") // 変更なし (削除するクラスはありません)

解決

className を複数の部分に分割し、これらの部分をループする必要があります。 一致するものが見つかった場合は、オブジェクトの JavaScript 配列から削除され、最後に再度追加されます。

これを少し最適化してみましょう。

function RemoveClass(elem, cls) (for(var c = elem.className.split(" "), i=c.length-1; i>=0; i--) (if (c[i] == cls) ) c.splice(i,1) ) elem.className = c.join(" ") ) var obj = ( className: "メニューを開く" ) RemoveClass(obj, "open") RemoveClass(obj, "blabla") アラート(obj.className) // メニュー

上の例では、変数 c がループの先頭に設定され、i がその最後のインデックスに設定されます。

ループ自体は逆方向に実行され、条件 i>=0 で終了します。 これは、 i>=0 が i よりも速くチェックされるために行われます。 これにより、 c でのプロパティの検索が高速化されます。

スライス法

配列の一部を抽出するには、slice(begin[, end]) メソッドを使用します。 var arr = ["Why", "learn", "JavaScript"]; var arr2 = arr.slice(0,2) // 0 から始まる 2 つの要素を受け取りますalert(arr2.join(", ")) // 「学習してください」

このメソッドは JavaScript の配列の要素数を変更するのではなく、その一部をコピーすることに注意してください。

2 番目の引数を省略すると、特定のインデックスで始まるすべての要素を取得できます。

var arr = [「なぜ」、「学ぶ」、「JavaScript」]; var arr2 = arr.slice(1) // 1 から始まるすべての要素を取得しますalert(arr2.join(", ")) // "JavaScript を学びましょう"

このメソッドは、 String#slice と同様に、負のインデックスをサポートします。

逆の方法

別の 便利な方法-逆行する。 「」のようなドメインの最後の部分を取得したいとします。 コム" から " my.site.com」 その方法は次のとおりです。

var ドメイン = "my.site.com" var last = ドメイン.split(".").reverse() アラート(最後)

JavaScript 配列は、メソッドを呼び出して結果の配列から要素を取得するための複雑な構文 (reverse()) をサポートしていることに注意してください。

reverse() のような長い呼び出しを作成できます 0] arr.sort() アラート(arr) // 1, 15, 2

上記のコードを実行します。 1、15、2の順になります。 これは、このメソッドがすべてを文字列に変換し、デフォルトで辞書順を使用するためです。

最終更新日: 2018 年 3 月 26 日

Array オブジェクトは配列を表し、配列を操作できる多数のプロパティとメソッドを提供します。

配列の初期化

角かっこまたは Array コンストラクターを使用して空の配列を作成できます。

var users = new Array(); var 人 = ; console.log(ユーザー); // 配列 console.log(people); // 配列

特定の数の要素を含む配列をすぐに初期化できます。

Var users = new Array("トム", "ビル", "アリス"); var people = ["サム", "ジョン", "ケイト"]; console.log(ユーザー); // ["トム", "ビル", "アリス"] console.log(people); // [「サム」、「ジョン」、「ケイト」]

配列を定義し、そこに新しい要素を追加できます。

var users = new Array(); ユーザー = "トム"; ユーザー = "ケイト"; console.log(ユーザー); // "トム" console.log(users); // 未定義

デフォルトでは配列が長さ 0 で作成されることは問題ではありません。 インデックスを使用すると、配列内の特定のインデックスにある特定の要素を置き換えることができます。

長さ

配列の長さを調べるには、length プロパティを使用します。

var フルーツ = 新しい Array(); 果物 = 「リンゴ」; 果物 = 「梨」; 果物 = 「プラム」; document.write("配列内に Fruit " + Fruit.length + " 要素:
"); for(var i=0; i< fruit.length; i++) document.write(fruit[i] + "
");

実際、配列の長さは最後の要素のインデックスに 1 を加えたものになります。 例えば：

var users = new Array(); // 配列内の要素は 0 です users = "Tom"; ユーザー = "ケイト"; ユーザー = "サム"; for(var i=0; i

ブラウザ出力:

トム・ケイト 未定義 未定義 サム

インデックス 2 と 3 の要素を追加しなかったにもかかわらず、この場合の配列の長さは数値 5 になります。インデックス 2 と 3 を持つ要素の値が unknown になるだけです。

配列をコピーしています。 スライス（）

配列のコピーには、浅いコピー (浅いコピー) と深いコピー (深いコピー) があります。

浅いコピーの場合は、配列を格納する別の変数の値を変数に割り当てるだけで十分です。

Var users = ["トム", "サム", "ビル"]; console.log(ユーザー); // ["トム", "サム", "ビル"] var people = users; // 人々を浅くコピー = "Mike"; // 2 番目の要素を変更します console.log(users); // [「トム」、「マイク」、「ビル」]

この場合、コピー後の people 変数は、users 変数と同じ配列を指します。 したがって、実際には同じ配列であるため、people の要素を変更すると、users の要素も変更されます。

この動作は必ずしも望ましいとは限りません。 たとえば、コピー後に変数が別の配列を指すようにしたいとします。 この場合、slice() メソッドを使用してディープ コピーを使用できます。

Var users = ["トム", "サム", "ビル"]; console.log(ユーザー); // ["トム", "サム", "ビル"] var people = users.slice(); // ディープコピー people = "Mike"; // 2 番目の要素を変更します console.log(users); // ["トム", "サム", "ビル"] console.log(people); // [「トム」、「マイク」、「ビル」]

この場合、コピー後、変数は異なる配列を指すことになり、それらを個別に変更できます。

また、slice() メソッドを使用すると、配列の一部をコピーすることもできます。

Var users = ["トム"、"サム"、"ビル"、"アリス"、"ケイト"]; var people = users.slice(1, 4); コンソール.ログ(人); // [「サム」、「ビル」、「アリス」]

lice() メソッドには、配列から値を取得するために使用される開始インデックスと終了インデックスが渡されます。 つまり、この場合、新しい配列への選択は、インデックス 1 からインデックス 4 まで (含まれません) になります。 また、配列のインデックス付けは 0 から始まるため、新しい配列には 2 番目、3 番目、4 番目の要素が含まれます。

押す（）

Push() メソッドは、配列の末尾に要素を追加します。

ヴァールフルーツ = ; フルーツ.push("リンゴ"); フルーツ.push("梨"); フルーツ.push("プラム"); フルーツ.push("チェリー","アプリコット
"); document.write(fruit); // リンゴ、ナシ、プラム、サクランボ、アプリコット

ポップ（）

Pop() メソッドは、配列から最後の要素を削除します。

Var Fruit = ["リンゴ"、"ナシ"、"プラム"]; var lastFruit = フルーツ.ポップ(); // 配列から最後の要素を抽出します document.write(lastFruit + "
"); document.write("配列 Fruit " + Fruit.length + " 要素内:
"); for(var i=0; i ");

ブラウザ出力:

プラム フルーツ配列には 2 つの要素があります: リンゴ、梨

シフト（）

SHIFT() メソッドは、配列から最初の要素を取得して削除します。

Var Fruit = ["リンゴ"、"ナシ"、"プラム"]; var firstFruit = フルーツ.shift(); document.write(firstFruit + "
"); document.write("配列 Fruit " + Fruit.length + " 要素内:
"); for(var i=0; i ");

ブラウザ出力:

リンゴ フルーツ配列には 2 つの要素があります: 梨、プラム

シフト解除()

unshift() メソッドは、配列の先頭に新しい要素を追加します。

Var Fruit = ["リンゴ"、"ナシ"、"プラム"]; フルーツ.unshift("アプリコット"); document.write(フルーツ);

ブラウザ出力:

アプリコット、リンゴ、梨、プラム

インデックスによる要素の削除。 スプライス（）

splice() メソッドは、特定のインデックスにある要素を削除します。 たとえば、3 番目のインデックスから要素を削除します。

Var users = ["トム"、"サム"、"ビル"、"アリス"、"ケイト"]; var 削除 = users.splice(3); console.log(削除済み); // [ "アリス", "ケイト" ] console.log(users); // [ "トム"、"サム"、"ビル" ]

スライス メソッドは、削除された要素を返します。

この場合、削除は配列の先頭から行われます。 負のインデックスを渡すと、配列の末尾から削除が実行されます。 たとえば、最後の要素を削除してみましょう。

Var users = ["トム"、"サム"、"ビル"、"アリス"、"ケイト"]; var 削除 = users.splice(-1); console.log(削除済み); // [ "ケイト" ] console.log(users); // [ "トム"、"サム"、"ビル"、"アリス" ]

このメソッドの追加バージョンでは、削除の終了インデックスを指定できます。 たとえば、最初から 3 番目のインデックスを削除してみましょう。

Var users = ["トム"、"サム"、"ビル"、"アリス"、"ケイト"]; var 削除 = users.splice(1,3); console.log(削除済み); // [ "サム", "ビル", "アリス" ] console.log(users); // [ "トム"、"ケイト" ]

splice メソッドの別のバージョンを使用すると、削除された要素の代わりに新しい要素を挿入できます。

Var users = ["トム"、"サム"、"ビル"、"アリス"、"ケイト"]; var delete = users.splice(1,3, "アン", "ボブ"); console.log(削除済み); // [ "サム", "ビル", "アリス" ] console.log(users); // [ "トム"、"アン"、"ボブ"、"ケイト" ]

この場合、1 番目から 3 番目のインデックスから 3 つの要素を削除し、代わりに 2 つの要素を挿入します。

concat()

concat() メソッドは配列を結合するために使用されます。

Var Fruit = ["リンゴ"、"ナシ"、"プラム"]; var 野菜 = ["トマト", "キュウリ", "ジャガイモ"]; var products = フルーツ.concat(野菜); for(var i=0; i< products.length; i++) document.write(products[i] + "
");

この場合、同じ型の配列のみを組み合わせる必要はありません。 さまざまなタイプが考えられます。

Var Fruit = ["リンゴ"、"ナシ"、"プラム"]; 変数価格 = ; var products = Fruit.concat(prices);

参加する（）

join() メソッドは、配列のすべての要素を 1 つの文字列に結合します。

Var Fruit = ["リンゴ"、"ナシ"、"プラム"、"アプリコット"、"モモ"]; var FruitString = Fruit.join(", "); document.write(fruitString);

join() メソッドには、配列要素間のセパレータが渡されます。 この場合、区切り文字としてカンマとスペース (", ") が使用されます。

選別（）

sort() メソッドは配列を昇順に並べ替えます。

Var Fruit = ["リンゴ"、"ナシ"、"プラム"、"アプリコット"、"モモ"]; フルーツ.ソート(); for(var i=0; i< fruit.length; i++) document.write(fruit[i] + "
");

ブラウザ出力:

アプリコット 梨 桃 プラム リンゴ

逆行する（）

reverse() メソッドは配列を逆方向に反転します。

Var Fruit = ["リンゴ"、"ナシ"、"プラム"、"アプリコット"、"モモ"]; フルーツ.リバース(); for(var i=0; i< fruit.length; i++) document.write(fruit[i] + "
");

ブラウザ出力:

桃、アプリコット、プラム、梨、リンゴ

sort() メソッドと組み合わせて、配列を降順に並べ替えることができます。

Var Fruit = ["リンゴ"、"ナシ"、"プラム"、"アプリコット"、"モモ"]; フルーツ.sort().reverse(); for(var i=0; i< fruit.length; i++) document.write(fruit[i] + "
");

ブラウザ出力:

リンゴ、プラム、桃、梨、アンズ

要素のインデックスを見つける

IndexOf() メソッドと lastIndexOf() メソッドは、配列内の最初と最後に含まれる要素のインデックスを返します。 例えば：

Var Fruit = ["リンゴ"、"ナシ"、"プラム"、"リンゴ"、"ナシ"]; var firstIndex = Fruit.indexOf("リンゴ"); var lastIndex = Fruit.lastIndexOf("リンゴ"); var otherIndex = Fruit.indexOf("さくらんぼ"); document.write(firstIndex); // 0 document.write(lastIndex); // 3 document.write(otherIndex); // -1

配列内の「apples」行の最初の行はインデックス 0 にあり、最後はインデックス 3 にあるため、firstIndex の値は 0 になります。

要素が配列内にない場合、この場合、indexOf() メソッドと lastIndexOf() メソッドは値 -1 を返します。

毎（）

Every() メソッドは、すべての要素が特定の条件に一致するかどうかをチェックします。

変数番号 = [ 1, -12, 8, -4, 25, 42 ]; 関数条件(値, インデックス, 配列) ( var result = false; if (value > 0) ( result = true; ) return result; ); 渡された変数 = 数値.every(条件); document.write(渡された); // 間違い

Every() メソッドには、条件を表す関数がパラメーターとして渡されます。 この関数は 3 つのパラメータを取ります。

関数の条件(値、インデックス、配列) ( )

value パラメーターは反復される現在の配列要素を表し、index パラメーターはその要素のインデックスを表し、array パラメーターは配列への参照を渡します。

この関数では、渡された要素の値が何らかの条件に準拠しているかどうかをチェックできます。 たとえば、この例では、配列の各要素をチェックして、それがゼロより大きいかどうかを確認します。 それが大きい場合は、値 true を返します。つまり、要素は条件を満たします。 それより小さい場合は false を返します - 要素は条件を満たしていません。

その結果、numbers.every(condition) メソッドが呼び出されると、numbers 配列のすべての要素が反復処理され、それらが 1 つずつ条件関数に渡されます。 この関数がすべての要素に対して true を返す場合、every() メソッドは true を返します。 少なくとも 1 つの要素が条件に一致しない場合、every() メソッドは false を返します。

いくつかの（）

some() メソッドは、every() メソッドと似ていますが、少なくとも 1 つの要素が条件に一致するかどうかをチェックする点が異なります。 この場合、 some() メソッドは true を返します。 配列内に条件に一致する要素がない場合は、 false が返されます。

変数番号 = [ 1, -12, 8, -4, 25, 42 ]; 関数条件(値, インデックス, 配列) ( var result = false; if (value === 8) ( result = true; ) return result; ); 渡された変数 = 数値.some(条件); // 真実

フィルター（）

filter() メソッドは、 some() や Every() と同様、条件関数を受け入れます。 ただし、同時に、この条件を満たす要素の配列を返します。

変数番号 = [ 1, -12, 8, -4, 25, 42 ]; 関数条件(値, インデックス, 配列) ( var result = false; if (value > 0) ( result = true; ) return result; ); var filteredNumbers = 数値.フィルター(条件); for(var i=0; i< filteredNumbers.length; i++) document.write(filteredNumbers[i] + "
");

ブラウザ出力:

1 8 25 42

forEach() と map()

forEach() メソッドと map() メソッドは要素を反復処理し、要素に対して特定の操作を実行します。 たとえば、配列内の数値の 2 乗を計算するには、次のコードを使用できます。

変数番号 = [1、2、3、4、5、6]; for(var i = 0; i "); }

ただし、 forEach() メソッドを使用すると、この構造を簡素化できます。

変数番号 = [1、2、3、4、5、6]; function square(value, Index, array) ( var result = value * value; document.write("数値「 + 値 + 」の 2 乗は「 + 結果 + 」です
"); );numbers.forEach(square);

forEach() メソッドは同じ関数をパラメータとして受け取り、要素を反復処理するときに、反復処理中の現在の要素が渡され、その要素に対して操作が実行されます。

map() メソッドは forEach メソッドと似ており、配列の要素に対して演算を実行する関数もパラメータとして受け取りますが、map() メソッドは配列要素に対する演算の結果を含む新しい配列を返します。

たとえば、map メソッドを使用して、配列内の数値の 2 乗を計算してみましょう。

変数番号 = [1、2、3、4、5、6]; function square(値, インデックス, 配列) (戻り値 = 値 * 値; ); var squareArray = 数値.map(square); document.write(squareArray);

map() メソッドに渡される関数は、反復処理中の現在の要素を受け取り、その要素に対して操作を実行して、何らかの値を返します。 この値は、結果として得られる squareArray に入力されます。

2017/06/21 12:17

JavaScript でオブジェクトの配列のサイズを計算するには、配列の長さプロパティを使用します。

Var arr = ["最初", "2番目"]; console.log(arr.length); // 2

JavaScript の配列にはインデックスが欠落している場合があります。 例えば

変数 arr = ; arr = "最初"; arr = "秒";

length プロパティは、配列の最大インデックス + 1 を返します。 この例では、長さ = 5 です。

JavaScriptで配列の要素数を計算する

Array.prototype.count = function())( var result = 0; for(var i = 0; i< this.length; i++) if (this[i] != undefined) result++; return result; }

使用例

変数 arr = ; arr = "最初"; arr = "秒"; console.log(arr.count()); //2

長さプロパティに値を割り当てることもできます。 これにより、既存の配列の長さを短縮できます。

Var arr = [「最初」、「2 番目」、「3 番目」]; arr.length = 2; コンソール.ログ(arr); // [「最初」、「2 番目」]

JavaScriptで配列のサイズをバイト単位で計算する

配列は通常のオブジェクトであるため、配列のサイズをバイト単位で計算することは、他のオブジェクトのサイズを計算することと何ら変わりません。 残念ながら、JavaScript にはサイズを計算するための API が提供されていないため、自分で計算する必要があります。 これは次のように行われます。オブジェクトのすべてのプロパティを調べます。プロパティがプリミティブ型の場合は、そのプロパティにオブジェクトが含まれている場合は、その型のインスタンスのサイズを全体の結果に追加します。そのサイズ。

関数 sizeOf(obj) ( var bytes = 0; if(obj !== null && obj !== unknown) ( switch(typeof obj) ( case "number": バイト += 8; Break; case "string": バイト+= obj.length * 2; ケース "ブール": バイト += 4; ケース "オブジェクト": (bytes += sizeOf(obj); )

この方法は正確ではなく、無限ループに陥る可能性があるなど、多くの問題を抱えています。

この記事を共有します: