どんなデータでも配列に入れることができます。
var arr = [ {a: 1}, [1, 2, 3],
function() {return true;}
];
arr[0] // Object {a: 1}
arr[1] // [1, 2, 3]
arr[2] // function (){return true;}
// 多次元配列
var a = [[1, 2], [3, 4]];
配列の性質
typeof演算子は配列の型をオブジェクトとして返します。
typeof [1, 2, 3] // "object"
数値キー名は自動的に文字に変換されます。
var arr = ['a', 'b', 'c'];
arr['0'] // 'a'
arr[0] // 'a'
var a = [];
a[1.00] = 6;
a[1] // 6
length
配列である限り、length属性を持たなければなりません。
JavaScriptでは、配列の要素数を格納するために32ビットの整数を使用します。つまり、配列のメンバの最大数は 4294967295 であり、length 属性の最大値は 4294967295 ということになります。
lengthはキー名の最大の整数に1を足した動的な値で、``length属性は書き込み可能です。
var arr = ['a', 'b'];
arr.length // 2
arr = 'e';
arr.length // 1001
//length属性は次のように書くことができる。
var arr = [ 'a', 'b', 'c' ];
arr.length // 3
arr.length = 2;
arr // ["a", "b"]
//lengthプロパティを0に設定する var arr= [ 'a', 'b', 'c' ];
arr.length = 0;
arr // []
// 負の値や文字列、2の32乗以上の値を設定するとエラーになる。
[].length = -1
// RangeError: Invalid array length
配列は基本的にオブジェクトなので、配列にプロパティを追加することは可能ですが、これはlengthプロパティの値には影響しません。
var a = [];
a['p'] = 'abc';
a.length // 0
a[2.1] = 'abc';
a.length // 0
配列のキー名が範囲外の値として追加された場合、キー名は自動的に文字列に変換されます。
var arr = [];
arr[-1] = 'a';
arr[Math.pow(2, 32)] = 'b';
arr.length // 0
arr[-1] // "a"
arr // "b"
arr // [-1: "a", 4294967296: "b"]
arr.join(",") // ""
in
キー名が存在するかどうかをチェックする in 演算子は、配列だけでなくオブジェクトにも適用されます。
var arr = [ 'a', 'b', 'c' ];
2 in arr // true
'2' in arr // true
4 in arr // false
arr = 'a';
100 in arr // true
60 in arr // false
配列の繰り返し処理
for....inは、配列のすべての数値キーだけでなく、非数値キーも繰り返し処理します。したがって、for.....inを使用して配列を走査することはお勧めしません。
var a = [1, 2, 3];
a.foo = true;
for (var key in a) {
console.log(key);
}
// 0
// 1
// 2
// foo
for**ループや**while**ループの使用を検討してください。
var a = [1, 2, 3];
// for
for(var i = 0; i < a.length; i++) {
console.log(a[i]);
}
// while
var i = 0;
while (i < a.length) {
console.log(a[i]);
i++;
}
var l = a.length;
while (l--) {
console.log(a[l]);
}
配列内の空白
最後の要素の後にカンマがある場合、空白は生じません。つまり、このコンマがあってもなくても結果は同じです。
var a = [1, 2, 3,];
a.length // 3
a // [1, 2, 3]
deleteコマンドで配列メンバを削除すると、空の領域が作成され、length属性には影響しません。
var a = [1, 2, 3];
delete a[1];
a[1] // undefined
a.length // 3
ポジションが空であることと、ポジションが未定義であることは同じではありません。
ヌル・ビットの場合、forEach、for.....構造体、およびObject.keysのトラバーサルでは、ヌル・ビットはスキップされます。
var a = [, , ,];
a.forEach(function (x, i) {
console.log(i + '. ' + x);
})
// 出力を生成しない
for (var i in a) {
console.log(i);
}
// 出力を生成しない
Object.keys(a)
// []
位置が未定義の場合、トラバース時にスキップされません。
一方 undefined は、配列に要素があり、その値が未定義であることを意味します。
var a = [undefined, undefined, undefined];
a.forEach(function (x, i) {
console.log(i + '. ' + x);
});
// 0\. undefined
// 1\. undefined
// 2\. undefined
for (var i in a) {
console.log(i);
}
// 0
// 1
// 2
Object.keys(a)
// ['0', '1', '2']
配列ライクなオブジェクト
オブジェクトのキー名がすべて正の整数または0であり、length属性を持つ場合、そのオブジェクトは配列によく似ており、構文上 "array-like object "と呼ばれます。
var obj = {
0: 'a',
1: 'b',
2: 'c',
length: 3
};
obj[0] // 'a'
obj[1] // 'b'
obj.length // 3
obj.push('d') // TypeError: obj.push is not a function オブジェクトにはpushメソッドがない
長さ属性は動的な値ではないので、メンバが変わっても変化しません。
var obj = {
length: 0
};
obj[3] = 'd';
obj.length // 0
典型的な "配列のようなオブジェクト "は、関数の引数オブジェクトや、ほとんどのDOM要素の集合、文字列などです。
// arguments
function args() { return arguments }
var arrayLike = args('a', 'b');
arrayLike[0] // 'a'
arrayLike.length // 2
arrayLike instanceof Array // false
arrayLike instanceof Object //true
// DOM
var elts = document.getElementsByTagName('h3');
elts.length // 3
elts instanceof Array // false
//
'abc'[1] // 'b'
'abc'.length // 3
'abc' instanceof Array // false
配列のスライス・メソッドは、「配列のようなオブジェクト」を本当の配列に変えます。
var arr = Array.prototype.slice.call(arrayLike);
"配列のようなオブジェクト" 配列のメソッドを使うもう一つの方法があります。それは、call()によって配列のメソッドをオブジェクトの上に置くことです。=
// forEach
function logArgs() {
Array.prototype.forEach.call(arguments, function (elem, i) {
console.log(i + '. ' + elem);
});
}
// forループに相当する
function logArgs() {
for (var i = 0; i < arguments.length; i++) {
console.log(i + '. ' + arguments[i]);
}
}
//文字列も配列のようなオブジェクトである
Array.prototype.forEach.call('abc', function (chr) {
console.log(chr);
});
この方法は、配列のネイティブなforEachを直接使うよりも遅いので、まず「配列のようなオブジェクト」を本当の配列に変換してから、配列のforEachメソッドを直接呼び出す方がよいでしょう。
var arr = Array.prototype.slice.call('abc');
arr.forEach(function (chr) {
console.log(chr);
});
