ホームページ > 記事 > ウェブフロントエンド > JavaScript の配列オブジェクトについての簡単な説明_基礎知識
JavaScript の配列オブジェクトについての簡単な説明_基礎知識
- WBOYオリジナル
- 2016-05-16 16:23:51942ブラウズ
配列 配列
1. はじめに
配列は、順序付けられた値のコレクションです。各値は要素と呼ばれ、各要素には配列内の位置があり、インデックスと呼ばれる数値で表されます。 JavaScript 配列には型がありません。配列要素は任意の型にすることができ、同じ配列内の異なる要素は異なる型を持つ可能性があります。 --「JavaScript の決定版ガイド (第 6 版)」
2. 定義
var names = new Array("Zhang San", "Li Si", "Wang Wu");
// または
var names = ["Zhang San", "Li Si", "Wang Wu"];
3. 属性
length: 配列内の要素の長さを示します。
4. インスタンスメソッド
一般的な方法:
1) unshift(): 配列の先頭に要素を挿入します
2)shift(): 配列の最初の要素を削除して返します
3) Push(): 配列の末尾に要素を挿入します
4) Pop(): 配列の最後の要素を削除して返します
4.1 concat(): 要素を配列に接続します。元の配列は変更されず、新しい配列が返されます
パラメータ:
①value1,value2....valueN: 任意の数の値
戻り値:
{Array} 元の配列と新しく追加された要素を含む新しい配列。
例:
var デモ配列 = ['a', 'b', 'c'];
varデモArray2 =デモArray.concat('e');
console.log(demoArray); // =>demoArray:['a','b','c'] 元の配列は変更されません
console.log(demoArray2); // => ['a','b','c','e']
4.2 Every(): 要素を順番に走査し、各要素が true かどうかを判断します
パラメータ:
①function(value,index,self){}: 各要素はこの関数を使用して true かどうかを判断し、いずれかが false であると判断された場合、トラバースは直ちに終了します。
値: 配列トラバーサルの要素
インデックス: 要素番号
自己: 配列自体
戻り値:
{Boolean}: すべての要素が true の場合にのみ true を返し、1 つの要素が false である限り false を返します。
例:
var デモ配列 = [1, 2, 3];
var rs =デモArray.every(関数(値, インデックス, 自己) {
戻り値 > 0;
});
console.log(rs); // =>
パラメータ:
値: 配列トラバーサルの要素
インデックス: 要素番号
自己: 配列自体
戻り値:
{Array} 条件を満たす要素を含む新しい配列
例:
var rs =デモArray.filter(関数(値, インデックス, 自己) {
戻り値 > 0;
});
console.log(rs); // => [1, 2, 3]
パラメータ:
値: 配列トラバーサルの要素
インデックス: 要素番号
自己: 配列自体
戻り値: なし
例:
demoArray.forEach(関数 (値, インデックス, 自己) {
Console.log(value); // => 順番に出力: 1 2 3
});
4.5 IndexOf(): 配列内の一致する要素を検索します。一致する要素がない場合は、-1 が返されます。検索時には「===」演算子を使用するため、1 と '1' を区別する必要があります
パラメータ:
①value: 配列内で検索される値。
②start: 検索を開始する連番位置。省略した場合は0となります。
戻り値:
{Int}: 配列内で最初に一致した値のシリアル番号を返します。存在しない場合は、-1
を返します。例:
['a', 'b', 'c'].indexOf('a') // =>0
; ['a', 'b', 'c'].indexOf('a', 1) // =>-1
; ['a', 'b', 'c'].indexOf('d') // =>-1
; [1, 2, 3].indexOf('1'); // => -1: '===' 一致メソッドが使用されました
4.6 join(): セパレータを使用して、配列内のすべての要素を文字列に結合します。
パラメータ:
①sparator {String}: 各要素間の区切り文字。省略した場合、デフォルトでは英語のカンマ「,」で区切られます。
戻り値:
{String}: 各要素は、区切り文字としてスパレータを使用して文字列に結合されます。
例:
['a', 'b', 'c'].join(); // => 'a,b,c'
['a', 'b', 'c'].join('-') // =>
パラメータ:
②start: 検索を開始する連番位置 省略した場合は最後の要素から検索を開始します。
戻り値:
{Int}: 配列内で最初に一致する値のシーケンス番号を右から左に探します。存在しない場合は、-1
を返します。
例:
['a', 'b', 'c'].lastIndexOf('a', 1); // => 0
['a', 'b', 'c'].lastIndexOf('d'); // => [1, 2, 3].lastIndexOf('1'); // => -1: '===' 一致メソッドが使用されました
①function(value,index,self){}: 各要素がこの関数を順番に呼び出し、計算された要素を返します
値: 配列トラバーサルの要素
インデックス: 要素番号
自己: 配列自体
戻り値:
{Array} 適切な要素を含む新しい配列
例:
}); // => [2, 4, 6]
戻り値:
{Object} 配列の最後の要素。配列が空の場合は、未定義
が返されます。例:
4.10 Push(): 配列の末尾に要素を追加します
パラメータ:
①value1,value2....valueN: 配列の末尾に任意の数の値を追加します
{int} の配列の新しい長さ
例:
コードをコピーします
4.11 reverse(): 配列要素の順序を逆にします。
パラメータ: なし
戻り値: なし (元の配列の要素の順序を逆にします)。
例:
var DemonArray = ['a', 'b', 'c', 'd', 'e'];
デモArray.reverse();
console.log(demoArray); // => ["e", "d", "c", "b", "a"]
4.12 SHIFT(): 配列の最初の要素を削除して返します
パラメータ: なし
戻り値:
{Object} 配列の最初の要素。配列が空の場合は、未定義が返されます。
例:
var デモ配列 = ['a', 'b', 'c'];
demoArray.shift(); // => デモ配列.shift(); // => デモ配列.shift(); // => demoArray.shift(); // =>
4.13 slide(startIndex,endIndex): 配列の一部を返します。
パラメータ:
②endIndex: 最後の要素の後の通し番号 指定しない場合は終了となります。インターセプトされた要素には、ここでのシリアル番号を持つ要素は含まれておらず、ここでのシリアル番号より前の要素で終了します。
戻り値:
{Array} startIndex から endIndex の前の要素までのすべての要素を含む新しい配列。
例:
コードをコピーします
4.14 sort(opt_orderFunc): 特定のルールに従って並べ替えます
パラメータ:
v1: トラバース時の前の要素。
並べ替え:
v1 と v2 を比較し、v1 と v2 の並べ替えルールを表す数値を返します:
0 未満: v1 は v2 より小さく、v1 は v2 の前にランクされます。
0 に等しい: v1 は v2 と等しく、v1 は v2 の前にランクされます。
0 より大きい: v1 は v2 より大きく、v1 は v2 よりも下にランクされます。
戻り値: なし (元の配列でのソート操作)。
例:
コードをコピーします
Return -(v1 - v2) //否定すればFrom big to small
に変換可能 }); // => [22, 11, 5, 4, 3, 2, 1]
4.15 splice(): 配列要素の挿入と削除
パラメータ:
②deleteCount {int}: 先頭から数えた削除する要素の数。
戻り値:
{Array} 削除された要素を含む新しい配列を返します。 ②パラメータが0の場合、要素は削除されず、空の配列が返されることを意味します。
例:
コードをコピー
// 1.
を削除します var DemonArray = ['a', 'b', 'c', 'd', 'e'];
var DemonArray2 = demoArray.splice(0, 2); // 0 から始まる 2 つの要素を削除し、削除された要素を含む配列を返します: ['a', 'b']
console.log(demoArray2); // => ['a', 'b']
console.log(demoArray); // => ['c', 'd', 'e']
// 2.
を挿入します var DemonArray = ['a', 'b', 'c', 'd', 'e'];
var DemonArray2 = demoArray.splice(0, 0, '1', '2', '3'); // ②パラメータが0で空の配列が返される
console.log(demoArray2); // => console.log(demoArray); // => ['1', '2', '3', 'c', 'd', 'e']
// 3. まず削除してから
を挿入します var DemonArray = ['a', 'b', 'c', 'd', 'e'];
// ②パラメータが0以外の場合、まず削除操作(0から4つの要素を削除し、削除した要素を含む配列を返す)を行ってから、挿入操作を実行します
varデモArray2 =デモArray.splice(0, 4, '1', '2', '3');
console.log(demoArray2); // => ['a', 'b', 'c', 'd']
console.log(demoArray); // => ['1', '2', '3', 'c', 'd', 'e']
パラメータ: なし
{String} 配列内のすべての要素が英語のカンマ「,」で文字列に連結されて返されます。パラメータを指定せずに join() メソッドを呼び出すのと同じです。
例:
['a', 'b', 'c', 'd', 'e'].toString() // => 'a,b,c,d,e'
パラメータ:
戻り値:
{int} の配列の新しい長さ
例:
デモ配列.unshift('a'); // => デモ配列:['a']
demoArray.unshift('b'); // => デモ配列:['b', 'a']
demoArray.unshift('c'); // => デモ配列:['c', 'b', 'a']
demoArray.unshift('d'); // => デモ配列:['d', 'c', 'b', 'a']
デモ配列.unshift('e'); // => デモ配列:['e', 'd', 'c', 'b', 'a']
5. 静的メソッド
5.1 Array.isArray(): オブジェクトが配列かどうかを判断します
パラメータ:
戻り値:
{Boolean} 判定結果を返します。 true の場合はオブジェクトが配列であることを意味し、false の場合はオブジェクトが配列ではないことを意味します
例:
6. 実際の操作
説明: 各要素には、配列内の位置があり、インデックスと呼ばれる数値で表されます。インデックスは 0 から始まります。つまり、最初の要素のインデックスは 0、2 番目の要素のインデックスは 1 などです。 配列内に存在しないインデックスを取得した場合はunknownを返します。
例:
を返します。
6.2 for ステートメント
注: for ステートメント
を使用して配列を 1 つずつ走査できます。
6.3 浅いコピー
注: 配列型は参照型です。配列 a が配列 b にコピーされると、配列 b の要素が変更されると、配列 a も変更されます。
例:
var DemonArrayA = ['a', 'b', 'c', 'd', 'e'];
var DemonArrayB = DemonArrayA // 配列 A を配列 B
に代入します。 demoArrayB[0] = 1; // 配列 B
の要素を変更します。 console.log(demoArrayA); // => [1, 'b', 'c', 'd', 'e']: 配列 A の要素も変更されました
6.4 ディープコピー
説明: concat() メソッドを使用して新しい配列を返します。浅いコピーを防止するには、配列 b の要素を変更します。配列 a は変更されません。
例:
var DemonArrayA = ['a', 'b', 'c', 'd', 'e'];
var DemonArrayB = demoArrayA.concat(); // concat() メソッドを使用して新しい配列を返します
demoArrayB[0] = 1; // 配列 B
の要素を変更します。 console.log(demoArrayA); // => ['a', 'b', 'c', 'd', 'e']: 配列 A の要素は変更されていません
console.log(demoArrayB); // => [ 1, 'b', 'c', 'd', 'e']: 配列 B の要素が変更されました