概要
JavaScriptを学習、理解を深めるため「JavaScript Primer 迷わないための入門書」を読み、
理解した内容等を記載していく。
「【JavaScript】JavaScript入門一覧」に他の記事をまとめています。
この記事で理解できること
- 配列とは
- 配列の要素の取得
- 配列の分割代入
配列
- 値に
順序をつけて格納できるオブジェクト。 - 配列に格納した値を
要素、位置をインデックスと呼ぶ。 -
配列[インデックス]と指定することで要素を参照できる。 - インデックスは
1ではなく0から始まるということがポイント。
// 配列リテラルで名簿のような配列を作成(変数:nameListに代入)
const nameList = ["Taro", "Hanako", "Mike"]; // インデックス:要素 = 0:Taro、1:Hanako、2:Mike
// nameListの要素「Taro」を出力(配列のインデックスは0から..)
console.log(nameList[0]); // => Taro
// 存在しないインデックスを指定すると「undefined」が返される
console.log(nameList[3]); // => undefined
// 配列の配列(多次元配列)も作成できる
const arrayOnArray = ["A", "B", "C", [1, 2, 3]];
// インデックス3(=[1, 2, 3]の配列)、その配列内のインデックス0(=1)を指定
console.log(arrayOnArray[3][0]); // => 1
要素数の取得
- 配列には要素数を取得できる
lengthプロパティが存在する。
// 配列リテラルで名簿(変数:nameListに代入)
const nameList = ["Taro", "Hanako", "Mike"];
// lengthプロパティを出力
console.log(nameList.length); // => 3
オブジェクトが配列かどうかを判定する
- あるオブジェクトが配列かどうかを判定するには
isArrayメソッドを利用する。 - 配列の場合は、
trueが返される。
const nameList = ["Taro", "Hanako", "Mike"];
const obj = {};
console.log(Array.isArray(nameList)); // => true
console.log(Array.isArray(obj)); // => false
// typeofでは判定できない(配列もオブジェクトのため)
console.log(typeof array); // => object
配列と分割代入(ES2015〜)
- 配列の指定したインデックスの値を変数に再定義する方法に、
分割代入が存在する。 - 左辺に
配列リテラルに指定したい変数名を、右辺の配列を定義する。 -
右辺から左辺へ、それぞれのインデックスに該当する位置に要素の代入が行われる。
const array = ["one", "two", "three"];
// 左辺:配列リテラル 右辺:配列で分割代入
const [One, Two, Three] = array;
console.log(One); // => one
console.log(Two); // => two
console.log(Three); // => three