配列について(Array)
Array クラスとは?
■Array クラスについて
Array クラスは、配列用のクラスです。
Array クラスには、以下の特長があります。
■どんな番地にもアクセス可能
通常は、0 番地から順番にデータを格納します。
マイナスの番地や、配列のサイズより大きい番地へも格納することが可能です。
特殊な使い方をしない限り、マイナスの番地にはデータを格納しない方がいいでしょう。
■配列の挿入や除去などの操作が可能
Array クラスのメソッドを使用すると、配列を割り込み挿入したり、部分切除することができます。
データを格納してから、挿入や切除などの操作を行うと、番地が変動する事があります。
2 番地に格納したからといって、常に 2 番地に存在し続けるとは限りません。
■どんな型のデータでも格納可能
格納するデータの型に決まりはありません。どんな型のデータでも格納する事ができます。
配列を作成する
■配列を作成する
new 演算子を使って、Array クラスをインスタンス化します。
new Array ( 初期の配列のサイズ ) :Array
第01引数(略可) | Number | 初期の配列のサイズを指定。デフォルトは 0 |
戻り値 | Array | Array オブジェクト |
■第01引数 (配列の初期サイズ)
初期サイズは、仮想的な値です。
実際に内部で領域が確保される事はありません。
■作成例
Array オブジェクトを作成する
// Array オブジェクトを作成する
var array = new Array();
初期サイズを指定して、Array オブジェクトを作成する
// 初期サイズを指定して、Array オブジェクトを作成する
var array = new Array(1024);
■初期データを格納しつつ Array オブジェクトを作成する
■配列リテラルを使用する
角括弧 [ ] の中に、カンマ , で区切って、データを順番に指定します。
この書式を、配列リテラルといいます。
初期データを格納しつつ Array オブジェクトを作成する
// 初期データを格納しつつ Array オブジェクトを作成する
var array = ["A" , "B" , "C" , 123 , 456 , true , false];
空の配列を作成する
// 空の配列を作成する
var array = [ ];
■Array クラスを使用する(非推奨)
new 演算子を使って、Array クラスをインスタンス化します。
可変引数となっているので、格納したいデータを順番に指定します。
第01引数に数値だけ指定した場合、配列の初期サイズの設定となるので注意します。
この仕様はバグを誘発しやすいため、配列リテラルを使用した方がいいでしょう。
new Array ( 格納したいデータ , ... ) :Array
第01引数 | * | 0 番地に格納したいデータを指定。(第01引数に数値だけ指定すると配列の初期サイズの設定となる) |
可変引数(略可) | * | 1 番地から格納したいデータを順番に指定。 |
戻り値 | Array | Array オブジェクト |
初期データを格納しつつ Array オブジェクトを作成する
// 初期データを格納しつつ Array オブジェクトを作成する
var array = new Array("A","B","C","D","E");
第01引数に数値だけ指定した場合は、動作が異なるので注意
// ------------------------------------------------------------
// ○ 初期データを格納しつつ Array オブジェクトを作成する
// ------------------------------------------------------------
var array = new Array(5,6,7);
// 出力テスト
console.log(array); // 5,6,7
// ------------------------------------------------------------
// × 初期サイズを指定して、Array オブジェクトを作成する
// ------------------------------------------------------------
var array = new Array(5);
// 出力テスト
console.log(array); // undefined,undefined,undefined,undefined,undefined
■配列の任意の番地にアクセスする
配列アクセス演算子を使用します。
角括弧 [ ] の中に、アクセスしたい番地を数値で指定します。
データの存在しない番地にアクセスする事は、違反行為ではありません。
指定した番地にデータが存在しなかった場合は、undefined 値が得られます。
配列の任意の番地にアクセスする
// ------------------------------------------------------------
// 配列を作成する
// ------------------------------------------------------------
var array = ["A","B","C","D","E","F"];
// ------------------------------------------------------------
// 配列の任意の番地に、読み取りアクセスする
// ------------------------------------------------------------
// 0 番地に格納されたデータを取得
var v0 = array[0];
// 2 番地に格納されたデータを取得
var v1 = array[2];
// 出力テスト
console.log(v0); // "A"
console.log(v1); // "C"
// ------------------------------------------------------------
// 配列の任意の番地に、書き込みアクセスする
// ------------------------------------------------------------
// 2 番地にデータを格納する
array[2] = "G";
// 5 番地にデータを格納する
array[5] = "H";
// 出力テスト
console.log(array); // "A", "B", "G", "D", "E", "H"
■配列のすべての番地に順番にアクセスする
■ 0 から順番にアクセスする
配列のサイズを取得するには、length プロパティを使用します。
for 文を使って、0 から順番にアクセスします。
0 から順番に、すべての番地のデータにアクセスする
// ------------------------------------------------------------
// 配列を作成する
// ------------------------------------------------------------
var array = ["A","B","C","D","E","F"];
// ------------------------------------------------------------
// 0 から順番に、すべての番地のデータにアクセスする
// ------------------------------------------------------------
var i;
var num = array.length;
for(i=0;i < num;i++){
console.log("---");
console.log("index:" + i);
console.log("data:" + array[i]);
}
■ for..in 文を使用する
for..in 文を使って、アクセスする例です。
プロパティ名を取得できるので、配列アクセス演算子を使ってデータにアクセスします。
for..in 文を使用して、すべての番地のデータにアクセスする
// ------------------------------------------------------------
// 配列を作成する
// ------------------------------------------------------------
var array = ["A","B","C","D","E","F"];
// ------------------------------------------------------------
// for..in 文を使用して、すべての番地のデータにアクセスする
// ------------------------------------------------------------
var key;
for (key in array){
console.log("---");
console.log("index:" + key);
console.log("data:" + array[key]);
}
Array オブジェクトを、連想配列として取り扱っている場合は、for..in 文を使用します。
得られる番地の順序は、昇順とは限りません。
実際に得られる番地の順序は、ブラウザごとに異なります。
for..in 文を使用して、すべての番地のデータにアクセスする
// ------------------------------------------------------------
// 配列を作成する
// ------------------------------------------------------------
var array = new Array();
// ------------------------------------------------------------
// 数値を使ってアクセスする連想配列として取り扱う
// ------------------------------------------------------------
array[-12] = "A";
array[123] = "B";
array[456] = "C";
array[987] = "D";
// ------------------------------------------------------------
// for..in 文を使用して、すべての番地のデータにアクセスする
// ------------------------------------------------------------
var key;
for (key in array){
console.log("---");
console.log("index:" + key);
console.log("data:" + array[key]);
}
■配列の任意の番地を削除する
delete 文を使用します。
Array オブジェクトを、連想配列として取り扱っている場合に使用するといいでしょう。
配列の任意の番地を削除する
// ------------------------------------------------------------
// 配列を作成する
// ------------------------------------------------------------
var array = ["A","B","C","D","E","F"];
// ------------------------------------------------------------
// 配列の任意の番地を削除する
// ------------------------------------------------------------
// 1 番地を削除する
delete array[1];
// 3 番地を削除する
delete array[3];
// ------------------------------------------------------------
// 残っている番地をすべて出力する
// ------------------------------------------------------------
var key;
for (key in array){
console.log("---");
console.log("index:" + key);
console.log("data:" + array[key]);
}
多次元配列を作成する
■多次元配列を作成する
■多次元配列を作成するには?
Array クラスは、1次元用の配列です。
Array オブジェクト1つだけで、多次元配列を実現することはできません。
1次元配列の各番地に、必要な数だけ Array オブジェクトを作成して格納します。
例えば、「3行×無限列」となる、2次元配列を作成する例です。
2次元配列化するには、1次元配列の各番地に Array オブジェクトを作成して格納する
// 1次元配列を作成する
var array = new Array();
// 1次元配列の各番地に、配列を作成して格納する
array[0] = new Array();
array[1] = new Array();
array[2] = new Array();
■多次元配列を初期化する
「10行×無限列」の二次元配列を作成して、「10行×20列」の空間を中身を 0 で埋める例です。
10行×無限列」の二次元配列を作成して、「10行×20列」の空間を中身を 0 で埋める
var i;
var j;
// 1次元配列を作成する
var array = new Array();
for(i=0;i < 10;i++){
// 1次元配列の各番地に、配列を作成して格納する
array[i] = new Array();
for(j=0;j < 20;j++){
// 0 で埋める
array[i][j] = 0;
}
}
多次元配列の初期化は、配列リテラルで記述すると、視覚的に見やすくなります。
配列リテラルを使って二次元配列を作成する
var array = [
[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0]
];
配列リテラルを使って複雑な多次元配列を作成する
var array = [
[
["A","B","C"],
["D","E","F"],
["G","H","I"]
],[
["J","K","L","M"],
["N","O","P","Q","R"]
],[
[
["S","T","U"],
["V","W"]
],[
["X"],
["Y"],
["Z"]
]
]
];
■多次元配列の任意の番地にアクセスする
配列アクセス演算子を使用します。
角括弧 [ ] の中に、アクセスしたい番地を数値で指定します。
「3行×無限列」の2次元配列にアクセスする
// ------------------------------------------------------------
// 「3行×無限列」の2次元配列を作成する
// ------------------------------------------------------------
// 1次元配列を作成する
var array = new Array();
// 1次元配列の各番地に、配列を作成して格納する
array[0] = new Array();
array[1] = new Array();
array[2] = new Array();
// ------------------------------------------------------------
// 配列の任意の番地に、書き込みアクセスする
// ------------------------------------------------------------
// 0 行 5 列番地にデータを格納する
array[0][5] = "A";
// 2 行 3 列番地にデータを格納する
array[2][3] = "B";
// ------------------------------------------------------------
// 配列の任意の番地に、読み取りアクセスする
// ------------------------------------------------------------
// 0 行 5 列番地に格納されたデータを取得
var v = array[0][5];
// 出力テスト
console.log(v); // "A"
// 2 行 3 列番地に格納されたデータを取得
var v = array[2][3];
// 出力テスト
console.log(v); // "B"
// ------------------------------------------------------------
// アクセス範囲テスト
// ------------------------------------------------------------
// × 3 行 0 列番地にデータを格納する (幹の番地は用意した範囲までしかアクセスできない)
//array[3][0] = "C";
// ○ 0 行 99999 列番地にデータを格納する (末端の番地は無制限にアクセスできる)
//array[0][99999] = "D";
Array クラスのプロパティについて
■ Array クラスのプロパティ一覧
Array クラスには、以下のプロパティがあります。
プロパティ | 型 | 説明 |
length | Number | 配列のサイズ |
■配列のサイズを取得する
length プロパティを使用します。
配列のサイズを調べる
// Array オブジェクトを作成する
var array = [0,1,2,3,4];
// 配列のサイズを取得
var num = array.length;
// 出力テスト
console.log(num);
length プロパティは、格納したデータの総数ではありません。
データが格納されている番地の中で、最も大きい値が得られます。
Array オブジェクトを、連想配列として取り扱っている場合は注意します。
Array オブジェクトを、連想配列として取り扱っている場合は注意
// 配列を作成する
var array = new Array();
// Object 型のプロパティのように、好きな番地にアクセスする
array[-12] = "A";
array[123] = "B";
array[456] = "C";
array[987] = "D";
// 出力テスト (結果:988)
console.log("length:" + array.length);
Array クラスのメソッドについて
■ Array クラスのメソッド一覧
■主要ブラウザで利用可能
メソッド | 説明 |
concat() | 2つ以上の配列を繋げて、新しい配列を取得する。 |
unshift() | 配列の最先頭に複数のデータを追加して、新しいサイズを取得する。 |
push() | 配列の最後尾に複数のデータを追加して、新しいサイズを取得する。 |
shift() | 配列の最先頭を削除して、格納されていたデータを取得する。 |
pop() | 配列の最後尾を削除して、格納されていたデータを取得する。 |
slice() | 配列の X 番目から Y 番目までを、新しい配列として取得する。 |
splice() | 配列の X 番目から L 個分を削除して、新しい配列として取得する。 配列の X 番目から複数のデータを追加する。 |
sort() | 配列をソートする。 |
reverse() | 配列の順番を反転する。 |
join() | 配列の各データの間に任意の文字列を挟み、すべて繋げたストリングを取得する。 |
■新世代のメソッド(一部のブラウザのみ利用可能)
メソッド | 説明 | ES |
copyWithin() | 配列の X 番目から Y 番目までを、自身の配列内に上書きコピーする | 6 |
fill() | 配列の X 番目から Y 番目までを、指定値で上書きする | 6 |
includes() | 配列内を昇順に検索し、指定値が含まれるか調べる | 6 |
indexOf() | 配列内を昇順に検索し、指定値とマッチする番地を取得する | 5 |
lastIndexOf() | 配列内を降順に検索し、指定値とマッチする番地を取得する | 5 |
forEach() | 関数を使用して、データを順番に調べる(すべての番地のデータにアクセスする) | 5 |
find() | 関数を使用して、データを順番に検索する(1つのデータを取得) | 6 |
findIndex() | 関数を使用して、データを順番に検索する(1つの番地を取得) | 6 |
every() | 関数を使用して、データを順番に検証する(すべてのデータが真である) | 5 |
some() | 関数を使用して、データを順番に検証する(1つでも真となるデータが存在する) | 5 |
filter() | 関数を使用して、新しい配列を取得する(データの抽出用) | 5 |
map() | 関数を使用して、新しい配列を取得する(データの変換用) | 5 |
reduce() | 関数を使用して、データを昇順に計算する | 5 |
reduceRight() | 関数を使用して、データを降順に計算する | 5 |
メソッド | 説明 | ES |
entries() | Iterator オブジェクトを取得する(番地と値の列挙) | 6 |
keys() | Iterator オブジェクトを取得する(番地の列挙) | 6 |
values() | Iterator オブジェクトを取得する(値の列挙) | 6 |
■2つ以上の配列を繋げて、新しい配列を取得する
concat() メソッドを使用します。
Array.concat( Array ... ) :Array
可変引数 | Array | 連結したい配列を指定。引数の最先頭から最後尾の順番で結合される。 |
戻り値 | Array | 新しい配列 |
■2つの配列を連結する例
2つの配列を連結して、新しい配列を取得する。
// 配列を作成する
var a = ["A","B","C"];
var b = ["D","E","F"];
// 2つの配列を連結して新しい配列を取得する
var c = a.concat(b);
■4つの配列を連結する例
4つの配列を連結して、新しい配列を取得する。
// 配列を作成する
var a = ["A","B"];
var b = ["C","D"];
var c = ["E","F","G"];
var d = ["H"];
// 複数の配列を連結して新しい配列を取得する
var e = a.concat(b,c,d);
■「配列の最先頭に複数のデータを追加する」+「新しいサイズを取得する」
unshift() メソッドを使用します。
Array.unshift( * ... ) :Number
可変引数 | * | 追加したいデータを指定。引数の最先頭から最後尾の順番で追加される。 |
戻り値 | Number | データ追加後のサイズ |
■配列の最先頭に1つのデータを追加する例
配列の先頭に "D" を追加して、新しいサイズを取得する
// 配列を作成する
var a = ["A","B","C"];
// 配列の先頭にデータを追加して、新しいサイズを取得する
var num = a.unshift("D");
■配列の最先頭に複数のデータを追加する例
配列の先頭に "D","E","F" を追加して、新しいサイズを取得する
// 配列を作成する
var a = ["A","B","C"];
// 配列の先頭に複数のデータを追加して、新しいサイズを取得する
var num = a.unshift("D" ,"E" ,"F");
■「配列の最後尾に複数のデータを追加する」+「新しいサイズを取得する」
push() メソッドを使用します。
Array.push( * ... ) :Number
可変引数 | * | 追加したいデータを指定。引数の最先頭から最後尾の順番で追加される。 |
戻り値 | Number | データ追加後のサイズ |
■配列の最後尾に1つのデータを追加する例
配列の最後尾に "D" を追加して、新しいサイズを取得する。
// 配列を作成する
var a = ["A","B","C"];
// 配列の最後尾にデータを追加して、新しいサイズを取得する
var num = a.push("D");
■配列の最後尾に複数のデータを追加する例
配列の最後尾に "D","E","F" を追加して、新しいサイズを取得する。
// 配列を作成する
var a = ["A","B","C"];
// 配列の最後尾に複数のデータを追加して、新しいサイズを取得する
var num = a.push("D" ,"E" ,"F");
■配列の最先頭を削除して、格納されていたデータを取得する
shift() メソッドを使用します。
Array.shift() :*
引数 | Void | なし |
戻り値 | * | 配列の先頭に格納されていたデータ |
■使用例
配列の先頭を削除して、格納されていたデータを取得する。
// 配列を作成する
var a = ["A","B","C","D","E"];
// 配列の最先頭を削除して、格納されていたデータを取得する
var b = a.shift();
■配列の最後尾を削除して、格納されていたデータを取得する
pop() メソッドを使用します。
Array.pop() :*
引数 | Void | なし |
戻り値 | * | 配列の最後尾に格納されていたデータ |
■使用例
配列の最後尾を削除して、格納されていたデータを取得する。
// 配列を作成する
var a = ["A","B","C","D"];
// 配列の最後尾を削除して、格納されていたデータを取得する
var b = a.pop();
■配列の開始位置と終了位置を指定して、新しい配列を取得する
slice() メソッドを使用します。
第02引数で指定する終了位置は、取得対象に含まれません。
引数を省略した場合、配列全体の複製となります。
Array.slice( 開始位置 , 終了位置 ) :Array
第01引数(略可) | Number | 開始位置を指定。(0 から始まる番号)デフォルトは 0 |
第02引数(略可) | Number | 終了位置を指定。(0 から始まる番号)デフォルトはすべての要素 マイナス値を指定すると「length + 第02引数」 の位置。(-1で最後尾は含まれない) |
戻り値 | Array | 新しい配列が得られる |
■配列をスライスして、新しい配列を取得する例
配列の 1 番目から 4 番目までをスライスし、新しい配列として取得する
// 配列を作成する
var a = ["A","B","C","D","E","F"];
// 開始位置と終了位置を指定して、新しい配列を取得する
var b = a.slice(1, 5);
■配列を複製する例
配列を複製する
// 配列を作成する
var a = ["A","B","C"];
// 配列を複製する
var b = a.slice();
■指定した位置から、配列の削除と追加を行う
splice() メソッドを使用します。
Array.splice( 開始位置 , 削除する個数 , * ... ) :Array
第01引数(略可) | Number | 開始位置を指定。(0 から始まる番号)デフォルトは 0 |
第02引数(略可) | Number | 削除する個数を指定。デフォルトはすべての要素 |
可変引数(略可) | * | 追加したいデータを指定。第03引数から最後尾の順番で追加される。 |
戻り値 | Array | 削除した範囲が、新しい配列として得られる |
■配列からデータを削除する場合
開始位置と個数を指定して、配列を削除する事ができます。
削除した範囲は、新しい配列として取得することができます。
特に削除しない場合は、第02引数に 0 を指定します。
配列の 3 番目から 2 個分を削除して、新しい配列として取得する。
// 配列を作成する
var a = ["A","B","C","D","E","F"];
// 開始位置と個数を指定して配列を削除し、削除した範囲は新しい配列として取得する
var b = a.splice(3,2);
■配列にデータを追加する場合
開始位置から、新しいデータを追加することができます。
特にデータを追加しない場合は、第03引数以降を省略します。
配列の 1 番目に、"G" を追加する。
// 配列を作成する
var a = ["A","B","C","D","E","F"];
// 開始位置を指定し、データを追加する(第02引数に 0 を指定)
var b = a.splice(1,0,"G");
■複数のデータの追加と削除を同時に行う例
1 番目から 4 個分を削除する。1 番目から "G","H","I" を追加する。
// 配列を作成する
var a = ["A","B","C","D","E","F"];
// 指定した位置から、配列の削除と追加を行う
var b = a.splice(1,4,"G","H","I");
■配列の途中に別の配列を挿入したい場合
配列の途中に別の配列を挿入する
// ------------------------------------------------------------
// 配列を作成する
// ------------------------------------------------------------
var a = ["A","B","C" , "G","H","I"];
var b = ["D","E","F"];
// ------------------------------------------------------------
// 配列を2つに分割する
// ------------------------------------------------------------
var p = a.slice(0,3);
var n = a.slice(3,a.length);
// ------------------------------------------------------------
// 配列を連結する
// ------------------------------------------------------------
var c = p.concat(b,n);
■配列をソートする
sort() メソッドを使用します。
Array.sort( コールバック関数 ) :Array
第01引数(略可) | Function | コールバック関数を指定。 |
戻り値 | Array | 配列の参照。 |
■第01引数 (コールバック関数)
引数にコールバック関数を指定します。
第01引数を省略した場合、文字列としてデータが比較され、昇順でソートされます。
■コールバック関数の仕様について
第01引数と第02引数から、任意の番地に格納されているデータが取得できます。
昇順にソートしたい場合は、
(第01引数 < 第02引数) となる場合、負の数 を返します。
(第01引数 == 第02引数) となる場合、0 を返します。
(第01引数 > 第02引数) となる場合、正の数 を返します。
降順にソートしたい場合は、
(第01引数 > 第02引数) となる場合、負の数 を返します。
(第01引数 == 第02引数) となる場合、0 を返します。
(第01引数 < 第02引数) となる場合、正の数 を返します。
■使用例(文字列として比較)
配列をソートする。(文字列として比較)(大文字と小文字を区別する)
// 配列を作成する
var a = ["b","c","C","B","A","a"];
// 配列をソートする(文字列として比較)(大文字と小文字を区別する)
a.sort();
■使用例(数値として比較)
数値として比較し配列をソートする。
// ------------------------------------------------------------
// ソート用コールバック関数(数値として比較)
// ------------------------------------------------------------
function ArraySortNumeric(prev,next){
return (prev - next);
}
// ------------------------------------------------------------
// 配列をソートする
// ------------------------------------------------------------
// 配列を作成する
var a = [2,4,1,3,0];
// 配列をソートする(数値として比較)
a.sort(ArraySortNumeric);
■使用例(文字列として比較)
文字列として比較し配列をソートする。
// ------------------------------------------------------------
// ソート用コールバック関数(文字列として比較)
// ------------------------------------------------------------
function ArraySortString(prev,next){
var i = 0;
while(true){
var p = prev.charCodeAt(i) || 0;
var n = next.charCodeAt(i) || 0;
var s = p - n;
if(s) return s;
if(!p) break;
i++;
}
return 0;
}
// ------------------------------------------------------------
// 配列をソートする
// ------------------------------------------------------------
// 配列を作成する
var a = ["C","E","B","D","A"];
// 配列をソートする(文字列として比較)
a.sort(ArraySortString);
■使用例(連番文字列として比較)
連番文字列として比較し配列をソートする。
// ------------------------------------------------------------
// ソート用コールバック関数(連番付き文字列として比較)
// ------------------------------------------------------------
function ArraySortSerialNumberString(prev,next){
var re = new RegExp("^(.*?)([0-9]+)$","i");
var p = prev.match(re);
var n = next.match(re);
if(p && n && (p[1] === n[1])){
return parseInt(p[2]) - parseInt(n[2]);
}
return prev.localeCompare(next);
}
// ------------------------------------------------------------
// 配列をソートする
// ------------------------------------------------------------
// 配列を作成する
var a = ["Ba","A64","B10","B2","A123","A0","A"];
// 配列をソートする(連番付き文字列として比較)
a.sort(ArraySortSerialNumberString);
■配列の順序を反転する
reverse() メソッドを使用します。
Array.reverse( ) :Array
引数 | Void | なし |
戻り値 | Array | 配列の参照。 |
■使用例
配列の順番を反転する。
// 配列を作成する
var a = ["A","B","C","D","E"];
// 配列を反転する
a.reverse();
■配列の各データの間に任意の文字列を挟み、すべて繋げたストリングを取得する
join() メソッドを使用します。
Array.join( 任意の文字列 ) :String
第01引数 | String | 配列の各データの間に挟む文字列を指定。デフォルトは "," |
戻り値 | String | 配列の各データの間に、第01引数で指定した文字列を挟み、すべて繋げたストリング。 |
■使用例
配列の各データの間に任意の文字列を挟み、すべて繋げたストリングを取得する
// 配列を作成する
var a = [0,1,2,3,4];
// 各データの間に任意の文字列を挟み、すべて繋げたストリングを取得する
var str = a.join("-");
■ toString() メソッドの場合
配列の各データの間に、カンマ『 , 』を挟んだ結果と同等です。
配列の各データの間にカンマを挟み、すべて繋げたストリングを取得する
// 配列を作成する
var a = ["A","B","C","D","E"];
// 各データの間にカンマを挟み、すべて繋げたストリングを取得する
var str = a.toString();
■指定区間内のデータを、自身の配列内に上書きコピーする
copyWithin() メソッドを使用します。
ECMAScript 6 世代の機能です。
Array.copyWithin( 書込開始 , 読取開始 , 読取終了 ) :Array
第01引数 | Number | 書き込み開始位置を指定。 |
第02引数 | Number | (読み取り区間)開始位置を指定。 |
第03引数(略可) | Number | (読み取り区間)終了位置を指定。デフォルトは最後尾まで |
戻り値 | Array | 呼び出した自身の配列が得られる。 |
■第01引数 (書き込み開始位置)
負の値を指定した場合、(length + 第01引数)と同等です。
実際に書き込まれる個数は、(第03引数 - 第02引数)で決まります。
配列のサイズが増えるような書き込みが行われると、その時点で終了します。
■第02~03引数 (読み取り区間)
スライスの指定と同等です。
■使用例
指定区間内のデータを、自身の配列内に上書きコピーする
// ------------------------------------------------------------
// 配列を作成する
// ------------------------------------------------------------
var a = ["a" , "b" , "c" , "-" , "-" , "-" , "-" , "-" , "-" , "-"];
// ------------------------------------------------------------
// 0 ~ 2 番目のデータを、6 番目から順番にコピーする
// ------------------------------------------------------------
a.copyWithin(6 , 0 , 3);
// ------------------------------------------------------------
// 出力テスト
// ------------------------------------------------------------
console.log(a); // ["a" , "b" , "c" , "-" , "-" , "-" , "a" , "b" , "c", "-"]
■指定区間内を、指定値で上書きする(塗りつぶす)
fill() メソッドを使用します。
ECMAScript 6 世代の機能です。
Array.fill( 指定値 , 開始位置 , 終了位置 ) :Array
第01引数 | * | セットする値を指定。 |
第02引数(略可) | Number | (指定区間)開始位置を指定。デフォルトは 0 |
第03引数(略可) | Number | (指定区間)終了位置を指定。デフォルトは最後尾まで |
戻り値 | Array | 呼び出した自身の配列が得られる。 |
■第02~03引数 (指定区間)
スライスの指定と同等です。
■使用例
指定区間内を、指定値で上書きする
// ------------------------------------------------------------
// 配列を作成する
// ------------------------------------------------------------
var a = ["-" , "-" , "-" , "-" , "-"];
// ------------------------------------------------------------
// 0 ~ 2 番目を、指定値で上書きする
// ------------------------------------------------------------
a.fill("xxx" , 0 , 3);
// ------------------------------------------------------------
// 出力テスト
// ------------------------------------------------------------
console.log(a); // ["xxx" , "xxx" , "xxx" , "-" , "-"]
■配列内を昇順に検索し、指定値が含まれるか調べる
includes() メソッドを使用します。
ECMAScript 6 世代の機能です。
最先頭から最後尾に向かって、昇順に検索します。
位置を指定して、途中から検索する事もできます。
厳密に一致するか、比較されます。
Array.includes( 検索値 , 検索開始位置 ) :Boolean
第01引数 | * | 検索したい値を指定。 |
第02引数(略可) | Number | 検索の開始位置を指定。 |
戻り値 | Boolean | 配列内に、第01引数と厳密に一致するデータが存在する場合は true。 |
■使用例
配列内に指定したデータが含まれるか調べる
// ------------------------------------------------------------
// 配列を作成する
// ------------------------------------------------------------
var a = ["aaa" , "bbb" , "ccc" , "ddd" , "eee"];
// ------------------------------------------------------------
// 配列内に指定したデータが含まれるか調べる
// ------------------------------------------------------------
var result = a.includes( "bbb" );
// ------------------------------------------------------------
// 出力テスト
// ------------------------------------------------------------
console.log(result); // true
■配列内を昇順に検索し、指定値とマッチする番地を取得する
indexOf() メソッドを使用します。
ECMAScript 5 世代の機能です。
最先頭から最後尾に向かって、昇順に検索します。
位置を指定して、途中から検索する事もできます。
厳密に一致するか、比較されます。
Array.indexOf( 検索値 , 検索開始位置 ) :Number
第01引数 | * | 検索したい値を指定。 |
第02引数(略可) | Number | 検索の開始位置を指定。 |
戻り値 | Number | 配列内に厳密一致する値が見つかった場合は、その番地が得られる。存在しない場合は -1 |
■使用例
配列内を昇順に検索し、指定値とマッチする番地を取得する
// ------------------------------------------------------------
// 配列を作成する
// ------------------------------------------------------------
var a = ["aaa" , "bbb" , "ccc" , "ddd" , "eee"];
// ------------------------------------------------------------
// 配列内を昇順に検索しマッチした番地を取得する
// ------------------------------------------------------------
var index = a.indexOf( "ddd" );
// ------------------------------------------------------------
// 出力テスト
// ------------------------------------------------------------
console.log(index); // 3
■配列内を降順に検索し、指定値とマッチする番地を取得する
lastIndexOf() メソッドを使用します。
ECMAScript 5 世代の機能です。
最後尾から最先頭に向かって、降順に検索します。
位置を指定して、途中から検索する事もできます。
厳密に一致するか、比較されます。
Array.lastIndexOf( 検索値 , 検索開始位置 ) :Number
第01引数 | * | 検索したい値を指定。 |
第02引数(略可) | Number | 検索の開始位置を指定。 |
戻り値 | Number | 配列内に厳密一致する値が見つかった場合は、その番地が得られる。存在しない場合は -1 |
■使用例
配列内を降順に検索し、指定値とマッチする番地を取得する
// ------------------------------------------------------------
// 配列を作成する
// ------------------------------------------------------------
var a = ["aaa" , "bbb" , "ccc" , "ddd" , "eee"];
// ------------------------------------------------------------
// 配列内を降順に検索しマッチした番地を取得する
// ------------------------------------------------------------
var index = a.lastIndexOf( "bbb" );
// ------------------------------------------------------------
// 出力テスト
// ------------------------------------------------------------
console.log(index); // 1
■関数を使用して、データを順番に調べる(すべての番地のデータにアクセスする)
forEach() メソッドを使用します。
ECMAScript 5 世代の機能です。
0 番地から最後尾までに、実在する要素のみが検出されます。
マイナス番地は検出できません。
Array.forEach( callback , thisObj ) :Void
第01引数 | Function | コールバック関数を指定 |
第02引数(略可) | * | コールバック関数内で this のアクセス先となるオブジェクトを指定。 |
戻り値 | Void | なし |
■第01引数 (コールバック関数)
第01引数から、現在の値情報が得られます。
第02引数から、現在の番地が得られます。
第03引数から、自身の Array オブジェクトが得られます。
戻り値は対応していません。
forEach() メソッドを中断する方法はありません。
■使用例
関数を使用して、データを順番に調べる
// ------------------------------------------------------------
// 配列を作成する
// ------------------------------------------------------------
var a = ["aaa" , "bbb" , "ccc" , "ddd" , "eee"];
// ------------------------------------------------------------
// コールバック関数を用意
// ------------------------------------------------------------
function callback( value , index , array ){
// 出力テスト
console.log("---");
console.log(index);
console.log(value);
}
// ------------------------------------------------------------
// 関数を使用して、データを順番に調べる(すべての番地のデータにアクセスする)
// ------------------------------------------------------------
a.forEach( callback );
関数を使用して、データを順番に調べる
// ------------------------------------------------------------
// 配列を作成する
// ------------------------------------------------------------
var a = ["aaa" , "bbb" , "ccc" , "ddd" , "eee"];
// ------------------------------------------------------------
// 関数を使用して、データを順番に調べる(すべての番地のデータにアクセスする)
// ------------------------------------------------------------
a.forEach( function ( value , index , array ){
console.log(arguments);
});
■関数を使用して、データを順番に検索する(1つのデータを取得)
find() メソッドを使用します。
ECMAScript 6 世代の機能です。
0 番地から最後尾までに、実在する要素のみが検出されます。
マイナス番地は検出できません。
Array.find( callback , thisObj ) :*
第01引数 | Function | コールバック関数を指定 |
第02引数(略可) | * | コールバック関数内で this のアクセス先となるオブジェクトを指定。 |
戻り値 | * | 見つかった番地の値情報が得られる。見つからなかった場合は、undefined |
■第01引数 (コールバック関数)
第01引数から、現在の値情報が得られます。
第02引数から、現在の番地が得られます。
第03引数から、自身の Array オブジェクトが得られます。
目的のデータが見つかった場合、true 値を返します。
この場合、find() メソッドは、その時点で終了します。
次のデータを、継続して調べたい場合は、false 値を返します。
最終的に見つからなかった場合、結果は undefined 値となります。
■使用例
関数を使用して、データを順番に検索する(1つのデータを取得)
// ------------------------------------------------------------
// 配列を作成する
// ------------------------------------------------------------
var a = ["aaa" , "bbb" , "ccc" , "ddd" , "eee"];
// ------------------------------------------------------------
// コールバック関数を用意
// ------------------------------------------------------------
function callback( value , index , array ){
// 出力テスト
console.log("---");
console.log(index);
console.log(value);
if(0){
// 目的のデータが見つかった場合は true を返す
return true;
}
// 検索処理を継続する場合は false を返す
return false;
}
// ------------------------------------------------------------
// 関数を使用して、データを順番に検索する(1つのデータを取得)
// ------------------------------------------------------------
var value = a.find( callback );
// 出力テスト
console.log(value);
負数であるデータを検索する
// ------------------------------------------------------------
// 配列を作成する
// ------------------------------------------------------------
var a = [ 111 , 222 , -333 , 444 , -555];
// ------------------------------------------------------------
// 負数であるデータを検索する
// ------------------------------------------------------------
var value = a.find( function ( value ){
// 負数であるか
var result = Boolean(value < 0);
return result;
});
// 出力テスト
console.log(value); // -333
■関数を使用して、データを順番に検索する(1つの番地を取得)
findIndex() メソッドを使用します。
ECMAScript 6 世代の機能です。
0 番地から最後尾まで、漏れ無く順番に列挙されます。
配列を連想配列として取り扱っている場合、機能しません。
Array.findIndex( callback , thisObj ) :Number
第01引数 | Function | コールバック関数を指定 |
第02引数(略可) | * | コールバック関数内で this のアクセス先となるオブジェクトを指定。 |
戻り値 | Number | 見つかった番地が得られる。見つからなかった場合は、-1 |
■第01引数 (コールバック関数)
第01引数から、現在の値情報が得られます。
第02引数から、現在の番地が得られます。
第03引数から、自身の Array オブジェクトが得られます。
目的のデータが見つかった場合、true 値を返します。
この場合、findIndex() メソッドは、その時点で終了します。
次のデータを、継続して調べたい場合は、false 値を返します。
最終的に見つからなかった場合、結果は -1 となります。
■使用例
関数を使用して、データを順番に検索する(1つの番地を取得)
// ------------------------------------------------------------
// 配列を作成する
// ------------------------------------------------------------
var a = ["aaa" , "bbb" , "ccc" , "ddd" , "eee"];
// ------------------------------------------------------------
// コールバック関数を用意
// ------------------------------------------------------------
function callback( value , index , array ){
// 出力テスト
console.log("---");
console.log(index);
console.log(value);
if(0){
// 目的のデータが見つかった場合は true を返す
return true;
}
// 検索処理を継続する場合は false を返す
return false;
}
// ------------------------------------------------------------
// 関数を使用して、データを順番に検索する(1つの番地を取得)
// ------------------------------------------------------------
var index = a.findIndex( callback );
// 出力テスト
console.log(index);
負数であるデータの番地を検索する
// ------------------------------------------------------------
// 配列を作成する
// ------------------------------------------------------------
var a = [ 111 , 222 , -333 , 444 , -555];
// ------------------------------------------------------------
// 負数であるデータの番地を検索する
// ------------------------------------------------------------
var index = a.findIndex( function ( value ){
// 負数であるか
var result = Boolean(value < 0);
return result;
});
// 出力テスト
console.log(index); // 2
■関数を使用して、データを順番に検証する(すべてのデータが真である)
every() メソッドを使用します。
ECMAScript 5 世代の機能です。
0 番地から最後尾までに、実在する要素のみが検出されます。
マイナス番地は検出できません。
Array.every( callback , thisObj ) :Boolean
第01引数 | Function | コールバック関数を指定 |
第02引数(略可) | * | コールバック関数内で this のアクセス先となるオブジェクトを指定。 |
戻り値 | Boolean | すべてのデータが真であるなら true 1つでも偽となるデータが存在するなら false |
■第01引数 (コールバック関数)
第01引数から、現在の値情報が得られます。
第02引数から、現在の番地が得られます。
第03引数から、自身の Array オブジェクトが得られます。
データを検証した結果が偽だった場合は、false 値を返します。
この場合、every() メソッドは、その時点で終了します。
次のデータを、継続して検証したい場合は、true 値を返します。
■使用例
すべてのデータが真であるか検証する
// ------------------------------------------------------------
// 配列を作成する
// ------------------------------------------------------------
var a = ["aaa" , "bbb" , "ccc" , "ddd" , "eee"];
// ------------------------------------------------------------
// コールバック関数を用意
// ------------------------------------------------------------
function callback( value , index , array ){
// 出力テスト
console.log("---");
console.log(index);
console.log(value);
if(0){
// データの検証結果が偽だった場合は false を返す
return false;
}
// 検証処理を継続する場合は true を返す
return true;
}
// ------------------------------------------------------------
// すべてのデータが真であるか検証する
// ------------------------------------------------------------
var result = a.every( callback );
// 出力テスト
console.log(result);
すべてのデータが正数であるか検証する
// ------------------------------------------------------------
// 配列を作成する
// ------------------------------------------------------------
var a = [ 111 , 222 , -333 , 444 , -555];
// ------------------------------------------------------------
// すべてのデータが正数であるか検証する
// ------------------------------------------------------------
var result = a.every( function ( value ){
// 正数であるか
return (value > 0);
});
// 出力テスト
console.log(result); // false
■関数を使用して、データを順番に検証する(1つでも真となるデータが存在する)
some() メソッドを使用します。
ECMAScript 5 世代の機能です。
0 番地から最後尾までに、実在する要素のみが検出されます。
マイナス番地は検出できません。
Array.some( callback , thisObj ) :Boolean
第01引数 | Function | コールバック関数を指定 |
第02引数(略可) | * | コールバック関数内で this のアクセス先となるオブジェクトを指定。 |
戻り値 | Boolean | 1つでも真となるデータが存在するなら true すべてのデータが偽であるなら false |
■第01引数 (コールバック関数)
第01引数から、現在の値情報が得られます。
第02引数から、現在の番地が得られます。
第03引数から、自身の Array オブジェクトが得られます。
データを検証した結果が真だった場合は、true 値を返します。
この場合、some() メソッドは、その時点で終了します。
次のデータを、継続して検証したい場合は、false 値を返します。
■使用例
1つでも真となるデータが存在するか検証する
// ------------------------------------------------------------
// 配列を作成する
// ------------------------------------------------------------
var a = ["aaa" , "bbb" , "ccc" , "ddd" , "eee"];
// ------------------------------------------------------------
// コールバック関数を用意
// ------------------------------------------------------------
function callback( value , index , array ){
// 出力テスト
console.log("---");
console.log(index);
console.log(value);
if(0){
// データの検証結果が真だった場合は true を返す
return true;
}
// 検証処理を継続する場合は false を返す
return false;
}
// ------------------------------------------------------------
// 1つでも真となるデータが存在するか検証する
// ------------------------------------------------------------
var result = a.some( callback );
// 出力テスト
console.log(result);
1つでも正数となるデータが存在するか検証する
// ------------------------------------------------------------
// 配列を作成する
// ------------------------------------------------------------
var a = [ -111 , -222 , -333 , 444 , -555];
// ------------------------------------------------------------
// 1つでも正数となるデータが存在するか検証する
// ------------------------------------------------------------
var result = a.some( function ( value ){
// 正数であるか
return (value > 0);
});
// 出力テスト
console.log(result); // true
■関数を使用して、新しい配列を取得する(データの抽出用)
filter() メソッドを使用します。
ECMAScript 5 世代の機能です。
0 番地から最後尾までに、実在する要素のみが検出されます。
マイナス番地は検出できません。
Array.filter( callback , thisObj ) :Array
第01引数 | Function | コールバック関数を指定 |
第02引数(略可) | * | コールバック関数内で this のアクセス先となるオブジェクトを指定。 |
戻り値 | Array | コールバック関数で抽出した結果が、新しい配列として得られる |
■第01引数 (コールバック関数)
第01引数から、現在の値情報が得られます。
第02引数から、現在の番地が得られます。
第03引数から、自身の Array オブジェクトが得られます。
現在の要素を、結果に含めたい場合は、true 値を返します。
現在の要素を、結果に含めたくない場合は、false 値を返します。
filter() メソッドを中断する方法はありません。
■使用例
データを抽出して、新しい配列を作成する
// ------------------------------------------------------------
// 配列を作成する
// ------------------------------------------------------------
var a = ["aaa" , "bbb" , "ccc" , "ddd" , "eee"];
// ------------------------------------------------------------
// コールバック関数を用意
// ------------------------------------------------------------
function callback( value , index , array ){
// 出力テスト
console.log("---");
console.log(index);
console.log(value);
if(0){
// 現在の要素を結果に含めるなら true を返す
return true;
}
// 現在の要素を結果に含めないなら false を返す
return false;
}
// ------------------------------------------------------------
// データを抽出して、新しい配列を作成する
// ------------------------------------------------------------
var b = a.filter( callback );
// 出力テスト
console.log(b);
正数となるデータのみを抽出して、新しい配列を得る
// ------------------------------------------------------------
// 配列を作成する
// ------------------------------------------------------------
var a = [ 111 , 222 , -333 , 444 , -555];
// ------------------------------------------------------------
// 正数となるデータのみを抽出して、新しい配列を得る
// ------------------------------------------------------------
var b = a.filter( function ( value ){
// 正数であるか
return (value > 0);
});
// ------------------------------------------------------------
// 出力テスト
// ------------------------------------------------------------
console.log(b); // [ 111 , 222 , 444 ]
■関数を使用して、新しい配列を取得する(データの変換用)
map() メソッドを使用します。
ECMAScript 5 世代の機能です。
0 番地から最後尾までに、実在する要素のみが検出されます。
マイナス番地は検出できません。
Array.map( callback , thisObj ) :Array
第01引数 | Function | コールバック関数を指定 |
第02引数(略可) | * | コールバック関数内で this のアクセス先となるオブジェクトを指定。 |
戻り値 | Array | コールバック関数で変換した結果が、新しい配列として得られる |
■第01引数 (コールバック関数)
第01引数から、現在の値情報が得られます。
第02引数から、現在の番地が得られます。
第03引数から、自身の Array オブジェクトが得られます。
戻り値は、省略できません。
データを変換し、戻り値から返します。
map() メソッドを中断する方法はありません。
■使用例
データを変換して、新しい配列を作成する
// ------------------------------------------------------------
// 配列を作成する
// ------------------------------------------------------------
var a = ["aaa" , "bbb" , "ccc" , "ddd" , "eee"];
// ------------------------------------------------------------
// コールバック関数を用意
// ------------------------------------------------------------
function callback( value , index , array ){
// 出力テスト
console.log("---");
console.log(index);
console.log(value);
// 現在のデータを変換して返す(ここでは元の値をそのまま返している)
return value;
}
// ------------------------------------------------------------
// データを変換して、新しい配列を作成する
// ------------------------------------------------------------
var b = a.map( callback );
// 出力テスト
console.log(b);
ミリ秒から Date オブジェクトに変換して、新しい配列を得る
// ------------------------------------------------------------
// 配列を作成する
// ------------------------------------------------------------
var a = [ 0 , 946598400000 , 946684800000 ];
// ------------------------------------------------------------
// ミリ秒から Date オブジェクトに変換して、新しい配列を得る
// ------------------------------------------------------------
var b = a.map( function ( value ){
// Date オブジェクトを作成
var date = new Date(value);
// 変換後のデータを返す
return date;
});
// 出力テスト
console.log(b); // [ 1970/01/01 , 1999/12/31 , 2000/01/01 ]
■関数を使用して、データを昇順に計算する
reduce() メソッドを使用します。
ECMAScript 5 世代の機能です。
0 番地から最後尾までに、実在する要素のみが検出されます。
マイナス番地は検出できません。
Array.reduce( callback , initialValue ) :*
第01引数 | Function | コールバック関数を指定 |
第02引数(略可) | * | 初回の結果値を指定します。省略した場合は、先頭の要素の値が採用されます。 |
戻り値 | * | コールバック関数にて最後に計算した結果値が、最終的な結果として得られます。 |
■第01引数 (コールバック関数)
第01引数から、前回までの結果値が得られます。
第02引数から、現在の値情報が得られます。
第03引数から、現在の番地が得られます。
第04引数から、自身の Array オブジェクトが得られます。
戻り値から、今回計算した、新しい結果値を返します。
最後に計算した結果値が、最終的な結果となります。
reduce() メソッドを中断する方法はありません。
■使用例
関数を使用して、データを昇順に計算する
// ------------------------------------------------------------
// 配列を作成する
// ------------------------------------------------------------
var a = ["aaa" , "bbb" , "ccc" , "ddd" , "eee"];
// ------------------------------------------------------------
// コールバック関数を用意
// ------------------------------------------------------------
function callback( previous , value , index , array ){
// 出力テスト
console.log("---");
console.log(index);
console.log(value);
// 前回までの結果値
console.log(previous);
// 今回の結果値を計算する
var current = (index + ":" + value);
// 今回の結果値を返す
return current;
}
// ------------------------------------------------------------
// 関数を使用して、データを昇順に計算する
// ------------------------------------------------------------
var result = a.reduce( callback , "init" );
// 出力テスト
console.log(result);
配列内の数値をすべて合計した結果を取得する
// ------------------------------------------------------------
// 配列を作成する
// ------------------------------------------------------------
var a = [ 111 , 222 , 333 , -444 , 555 ];
// ------------------------------------------------------------
// 配列内の数値を昇順に合計した結果を取得する
// ------------------------------------------------------------
var b = a.reduce( function ( previous , value ){
// 前回までの結果値
console.log(previous);
// 今回の結果値を計算する
var current = previous + value;
// 今回の結果値を返す
return current;
} , 0 );
// 出力テスト
console.log(b); // 777
■関数を使用して、データを降順に計算する
reduceRight() メソッドを使用します。
ECMAScript 5 世代の機能です。
最後尾から 0 番地までに、実在する要素のみが検出されます。
マイナス番地は検出できません。
Array.reduceRight( callback , initialValue ) :*
第01引数 | Function | コールバック関数を指定 |
第02引数(略可) | * | 初回の結果値を指定します。省略した場合は、先頭の要素の値が採用されます。 |
戻り値 | * | コールバック関数にて最後に計算した結果値が、最終的な結果として得られます。 |
■第01引数 (コールバック関数)
第01引数から、前回までの結果値が得られます。
第02引数から、現在の値情報が得られます。
第03引数から、現在の番地が得られます。
第04引数から、自身の Array オブジェクトが得られます。
戻り値から、今回計算した、新しい結果値を返します。
最後に計算した結果値が、最終的な結果となります。
reduceRight() メソッドを中断する方法はありません。
■使用例
関数を使用して、データを降順に計算する
// ------------------------------------------------------------
// 配列を作成する
// ------------------------------------------------------------
var a = ["aaa" , "bbb" , "ccc" , "ddd" , "eee"];
// ------------------------------------------------------------
// コールバック関数を用意
// ------------------------------------------------------------
function callback( previous , value , index , array ){
// 出力テスト
console.log("---");
console.log(index);
console.log(value);
// 前回までの結果値
console.log(previous);
// 今回の結果値を計算する
var current = (index + ":" + value);
// 今回の結果値を返す
return current;
}
// ------------------------------------------------------------
// 関数を使用して、データを降順に計算する
// ------------------------------------------------------------
var result = a.reduceRight( callback , "init" );
// 出力テスト
console.log(result);
配列内の数値をすべて合計した結果を取得する
// ------------------------------------------------------------
// 配列を作成する
// ------------------------------------------------------------
var a = [ 111 , 222 , 333 , -444 , 555 ];
// ------------------------------------------------------------
// 配列内の数値を降順に合計した結果を取得する
// ------------------------------------------------------------
var b = a.reduceRight( function ( previous , value ){
// 前回までの結果値
console.log(previous);
// 今回の結果値を計算する
var current = previous + value;
// 今回の結果値を返す
return current;
} , 0 );
// 出力テスト
console.log(b); // 777
■ Iterator オブジェクトを取得する(番地と値の列挙)
entries() メソッドを使用します。
ECMAScript 6 世代の機能です。
0 番地から最後尾まで、漏れ無く順番に列挙されます。
配列を連想配列として取り扱っている場合、機能しません。
Array.entries( ) :ArrayIterator
第01引数 | Void | なし |
戻り値 | ArrayIterator | 新しい Iterator オブジェクトが得られる(番地と値の列挙) |
■使用例
Iterator オブジェクトを取得(番地と値の列挙)
// ------------------------------------------------------------
// 配列を作成する
// ------------------------------------------------------------
var a = ["aaa" , "bbb" , "ccc" , "ddd" , "eee"];
// ------------------------------------------------------------
// Iterator オブジェクトを取得(番地と値の列挙)
// ------------------------------------------------------------
var iterator = a.entries();
// ------------------------------------------------------------
// 出力テスト
// ------------------------------------------------------------
console.log( iterator.next() ); // { done:false , value:[0,"aaa"] }
console.log( iterator.next() ); // { done:false , value:[1,"bbb"] }
console.log( iterator.next() ); // { done:false , value:[2,"ccc"] }
console.log( iterator.next() ); // { done:false , value:[3,"ddd"] }
console.log( iterator.next() ); // { done:false , value:[4,"eee"] }
console.log( iterator.next() ); // { done:true , value:undefined }
console.log( iterator.next() ); // { done:true , value:undefined }
console.log( iterator.next() ); // { done:true , value:undefined }
■ Iterator オブジェクトを取得する(番地の列挙)
keys() メソッドを使用します。
ECMAScript 6 世代の機能です。
0 番地から最後尾まで、漏れ無く順番に列挙されます。
配列を連想配列として取り扱っている場合、機能しません。
Array.keys( ) :ArrayIterator
第01引数 | Void | なし |
戻り値 | ArrayIterator | 新しい Iterator オブジェクトが得られる(番地の列挙) |
■使用例
Iterator オブジェクトを取得(番地の列挙)
// ------------------------------------------------------------
// 配列を作成する
// ------------------------------------------------------------
var a = ["aaa" , "bbb" , "ccc" , "ddd" , "eee"];
// ------------------------------------------------------------
// Iterator オブジェクトを取得(番地の列挙)
// ------------------------------------------------------------
var iterator = a.keys();
// ------------------------------------------------------------
// 出力テスト
// ------------------------------------------------------------
console.log( iterator.next() ); // { done:false , value:0 }
console.log( iterator.next() ); // { done:false , value:1 }
console.log( iterator.next() ); // { done:false , value:2 }
console.log( iterator.next() ); // { done:false , value:3 }
console.log( iterator.next() ); // { done:false , value:4 }
console.log( iterator.next() ); // { done:true , value:undefined }
console.log( iterator.next() ); // { done:true , value:undefined }
console.log( iterator.next() ); // { done:true , value:undefined }
■ Iterator オブジェクトを取得する(値の列挙)
values() メソッドを使用します。
ECMAScript 6 世代の機能です。
0 番地から最後尾まで、漏れ無く順番に列挙されます。
配列を連想配列として取り扱っている場合、機能しません。
Array.values( ) :ArrayIterator
第01引数 | Void | なし |
戻り値 | ArrayIterator | 新しい Iterator オブジェクトが得られる(値の列挙) |
■使用例
Iterator オブジェクトを取得(値の列挙)
// ------------------------------------------------------------
// 配列を作成する
// ------------------------------------------------------------
var a = ["aaa" , "bbb" , "ccc" , "ddd" , "eee"];
// ------------------------------------------------------------
// Iterator オブジェクトを取得(値の列挙)
// ------------------------------------------------------------
var iterator = a.values();
// ------------------------------------------------------------
// 出力テスト
// ------------------------------------------------------------
console.log( iterator.next() ); // { done:false , value:"aaa" }
console.log( iterator.next() ); // { done:false , value:"bbb" }
console.log( iterator.next() ); // { done:false , value:"ccc" }
console.log( iterator.next() ); // { done:false , value:"ddd" }
console.log( iterator.next() ); // { done:false , value:"eee" }
console.log( iterator.next() ); // { done:true , value:undefined }
console.log( iterator.next() ); // { done:true , value:undefined }
console.log( iterator.next() ); // { done:true , value:undefined }
Array クラスのデータ管理について
■Array オブジェクトを連想配列として使用する
Array クラスは、配列用のクラスですが、以下の特長があります。
初期サイズを指定して Array オブジェクト作成しても、実際にメモリ領域が確保されることはありません。
現在のサイズを無視して、マイナスの番地や、大きい番地へも格納することが可能です。
これらの特長から、Array オブジェクトの実態は、数値を使ってアクセスできる連想配列と言えます。
ユニーク(唯一)な数値をキーにして、データを管理する事ができます。
■連想配列として使用する場合の注意点
Array オブジェクトを連想配列として取り扱う場合、メソッドが利用できないので注意して下さい。
length プロパティも機能しません。
要素の総数を管理したい場合は、自前で要素数をカウントする必要があります。
■Array オブジェクトを辞書として使用する
Array オブジェクトの実態は、数値を使ってアクセスできる連想配列です。
よって Array オブジェクトは、数値をキーとした辞書として取り扱う事ができます。
■辞書として取り扱う理由
Array オブジェクトは、内部でハッシュテーブルを使った高速化が実現されています。
数値をキーとして指定することで、該当するデータを高速で検索する事ができます。
また、すべてのデータの中から該当するデータが存在しない事を、高速で判別する事もできます。
データの総数が、100 万以上ある場合でも、瞬時に検索できます。
■辞書として管理するためには?
データごとに、ユニーク(唯一)な数値が、存在している必要があります。
例えば、以下の様なユーザー情報は、辞書として管理することができます。
辞書として管理するためには、データごとにユニークな識別値が必要
var user_a = { id:1000000, name:"太郎", age:18 };
var user_b = { id:1000001, name:"花子", age:16 };
var user_c = { id:1000002, name:"圭佑", age:32 };
var user_x = { id:9999997, name:"××", age:99 };
var user_y = { id:9999998, name:"××", age:99 };
var user_z = { id:9999999, name:"××", age:99 };
■辞書を作成する
辞書として取り扱うための、Array オブジェクトを 1 つ作成します。
辞書用 Array オブジェクトを作成する
// 辞書を作成
var dictionary = new Array();
■辞書に既にデータが存在するか調べる
指定した番地に、すでにデータが存在するか調べます。
配列アクセス演算子を使って、調べたい番地にアクセスします。
結果が、真であればデータが存在します。偽であればデータは存在しません。
辞書に既にデータが存在するか調べる
// 辞書を作成
var dictionary = new Array();
// 検索したい ID 情報
var id = 1000001;
// 辞書に既にデータが存在するか調べる
if(dictionary[id]){
console.log("データは存在する");
}else{
console.log("データは存在しない");
}
■辞書にデータを登録する
任意の番地に、データを登録します。
配列アクセス演算子を使って、任意の番地にデータを格納します。
辞書にデータを登録する
// 辞書を作成
var dictionary = new Array();
// 管理したいデータ
var user_b = { id:1000001, name:"花子", age:16 };
// 辞書にデータが存在しないか調べる
if(!dictionary[user_b.id]){
// 辞書に新しいデータを登録する
dictionary[user_b.id] = user_b;
}
■辞書からデータを取得する
任意の番地から、データを取得します。
配列アクセス演算子を使って、任意の番地からデータを取得します。
undefined 値が得られる場合、データは存在しません。
辞書からデータを取得する
// 辞書を作成
var dictionary = new Array();
// 管理したいデータ
var user_a = { id:1000000, name:"太郎", age:18 };
var user_b = { id:1000001, name:"花子", age:16 };
var user_c = { id:1000002, name:"圭佑", age:32 };
// 辞書にデータを登録する
dictionary[user_a.id] = user_a;
dictionary[user_b.id] = user_b;
dictionary[user_c.id] = user_c;
// 検索したい ID 情報
var id = 1000000;
// 辞書からデータを取得する
var user = dictionary[id];
■辞書に登録したデータを削除する
任意の番地から、データを削除します。
delete 文を使って、任意の番地を削除します。
辞書に登録したデータを削除する
// 辞書を作成
var dictionary = new Array();
// 管理したいデータ
var user_a = { id:1000000, name:"太郎", age:18 };
var user_b = { id:1000001, name:"花子", age:16 };
var user_c = { id:1000002, name:"圭佑", age:32 };
// 辞書にデータを登録する
dictionary[user_a.id] = user_a;
dictionary[user_b.id] = user_b;
dictionary[user_c.id] = user_c;
// 検索したい ID 情報
var id = 1000000;
// 辞書からデータを取得する
var user = dictionary[id];
if(user){
// 辞書に登録したデータを削除する
delete dictionary[user.id];
}
■Array オブジェクトをスタックとして使用する
■スタックとは?
スタックは、複数のデータを格納する為のデータ構造の1つです。
後に格納した物ほど、先に取り出すことができます。(後入れ先出し、先入れ後出し)
このアルゴリズムは、本やCDの平積みと同等です。
データを追加したい場合は、一番上にさらに積む事で実現できます。
データを取り出したい場合は、一番上に積まれた物を取る事で実現できます。
■スタックを実現するためには?
スタックを実現するためには、push()、pop() メソッドを使用します。
shift()、unshift() メソッドでも実現できますが、使用すべきではありません。
shift()、unshift() メソッドは、配列の最先頭を変更します。
メソッドを実行するたびに、配列のすべての要素に対して、番地の割振り直しが発生します。
要素数が多ければ多いほど、処理量が増えていくので注意して下さい。
■スタックを作成する
スタックとして取り扱うための、Array オブジェクトを 1 つ作成します。
スタック用 Array オブジェクトを作成する
// スタックを作成
var stack = new Array();
■スタックにデータを追加する
スタックにデータを追加するには、push() メソッドを使用します。
スタックにデータを追加する
// スタックを作成
var stack = new Array();
// スタックにデータを追加する
stack.push( {message:"テスト1"} );
stack.push( {message:"テスト2"} );
stack.push( {message:"テスト3"} );
■スタックからデータを取り出す
スタックからデータを取り出すには、pop() メソッドを使用します。
スタックからデータを取り出す
// スタックを作成
var stack = new Array();
// スタックにデータを追加する
stack.push( {message:"テスト1"} );
stack.push( {message:"テスト2"} );
stack.push( {message:"テスト3"} );
// スタックからデータを取り出す
var a = stack.pop();
var b = stack.pop();
var c = stack.pop();
// 出力テスト
console.log(a.message);
console.log(b.message);
console.log(c.message);
■Array オブジェクトをキューとして使用する
■キューとは?
キューは、複数のデータを格納する為のデータ構造の1つです。
先に格納した物ほど、先に取り出すことができます。(先入れ先出し、後入れ後出し)
このアルゴリズムは、待ち行列と同等です。
データを追加したい場合は、行列の最後尾に並ぶ事で実現できます。
データを取り出したい場合は、行列の先頭にいる人から消化される事で実現できます。
■キューを実現するためには?
「push()、shift() メソッド」、もしくは「unshift()、pop() メソッド」を組み合わせで実現できます。
shift()、unshift() メソッドは、配列の最先頭を変更します。
メソッドを実行するたびに、配列のすべての要素に対して、番地の割振り直しが発生します。
要素数が多ければ多いほど、処理量が増えていくので注意して下さい。
データの総数が多い場合は、自前で単方向や双方向リストを実装したほうが高速に動作します。
push() shift() メソッドを使って、キューを実現する(要素数が少ない場合)
// キューを作成
var queue = new Array();
// キューにデータを追加する
queue.push( {message:"テスト1"} );
queue.push( {message:"テスト2"} );
queue.push( {message:"テスト3"} );
// キューからデータを取り出す
var a = queue.shift();
var b = queue.shift();
var c = queue.shift();
// 出力テスト
console.log(a.message);
console.log(b.message);
console.log(c.message);
■双方向リストを使って、キューを実装する
双方向リストを使って、キューを実現する
// ------------------------------------------------------------
// キュー用コンストラクタ関数
// ------------------------------------------------------------
function Queue(){
// ------------------------------------------------------------
// プライベートな変数
// ------------------------------------------------------------
var _queue = null;
// ------------------------------------------------------------
// キューにデータを追加する
// ------------------------------------------------------------
this.push = function (data){
var prev = _queue;
var next = prev.next;
var list = {data:data,prev:prev,next:next};
prev.next = list;
next.prev = list;
};
// ------------------------------------------------------------
// キューからデータを取り出す
// ------------------------------------------------------------
this.pop = function (){
var list = _queue.prev;
var prev = list.prev;
var next = list.next;
prev.next = next;
next.prev = prev;
return list.data;
};
// ------------------------------------------------------------
// 初期化
// ------------------------------------------------------------
(function (){
_queue = new Object();
_queue.prev = _queue;
_queue.next = _queue;
_queue.data = undefined;
})();
}
// ------------------------------------------------------------
// Queue オブジェクトを作成
// ------------------------------------------------------------
var queue = new Queue();
// ------------------------------------------------------------
// キューにデータを追加する
// ------------------------------------------------------------
queue.push( {message:"テスト1"} );
queue.push( {message:"テスト2"} );
queue.push( {message:"テスト3"} );
// ------------------------------------------------------------
// キューからデータを取り出す
// ------------------------------------------------------------
var a = queue.pop();
var b = queue.pop();
var c = queue.pop();
// 出力テスト
console.log(a.message);
console.log(b.message);
console.log(c.message);