var array = ["apple", "orange", "melon"];
このように変数に配列として値を入れると、用意した変数は配列(Array)オブジェクトとして解釈されます。Arrayオブジェクトにも他のオブジェクト同様、関数(メソッド)が用意されており、変数に格納されている配列の値を操作することができます。
変数の中に入れた配列の値に新しい値を追加したい場合は
push()を利用します。
var array = ["apple", "orange", "melon"];
array.push("peach");
// ["apple", "orange", "melon", "peach"]と表示される
console.log(array);
※console.log()はエラー内容の確認の際に開いたJavaScriptコンソールで値を表示するためのコードです。変数の中に入れた値が表示されます。(document.writeでは配列やオブジェクトが入った変数の中身を表示することができないので、console.log()を使います)
二つの配列を一つにまとめる時は
concat()を利用します。
(実際は、二つ目の配列を一つ目の配列の末尾に加えて、新しい配列を作成します)
var array = ["apple", "orange", "melon"];
var array2 = ["tomato", "carrot"];
//arrayの配列の末尾にarray2の配列を加えて新しい配列を作成する
var newArray = array.concat(array2);
//["apple", "orange", "melon", "tomato", "carrot"]と表示される
console.log(newArray);
shift()という関数を利用すると、配列の最初の値を取り出して、元の配列から取り出した値を削除することが出来ます。
var array = ["apple", "orange", "melon"];
//配列から最初の値を取り出す
var val = array.shift();
//appleと表示される
console.log(val);
//["orange", "melon"]と表示される
console.log(array);
shift()とは逆で
pop()を利用すると配列の一番最後の値を取り出して、元の配列から取り出した値を削除します。
var array = ["apple", "orange", "melon"];
//配列の最後の値を取り出す
var val = array.pop();
//melonと表示される
console.log(val);
//["apple", "orange"]と表示される
console.log(array);
reverse()という関数を利用すると配列の値の並び方が逆になります。
var array = ["apple", "orange", "melon"];
array.reverse();
//["melon", "orange", "apple"];
console.log(array);
配列を指定の箇所で切り取るには
slice()を利用します。
var array = ["apple", "orange", "melon", "tomato", "carrot"];
//0から数えて2にあたるmelonから4のcarrotよりも小さい範囲で値を取得
//取得した値から新しい配列を作って、用意した変数に入れる
var newArray = array.slice(2, 4);
//["melon", "tomato"]と表示されます
console.log(newArray);
配列の値をつなげて一つの文字列にしたい場合は、
join()を利用します。joinの引数(カッコの中)には配列内の各要素をつなげる時の値を指定します。
var array = ["apple", "orange", "melon"];
//各値の間にカンマを入れて、一つの文字列にする
var str = array.join(",");
//apple,orange,melonと表示される
document.write(str);
逆に
split()を使うことで、文字列を配列にすることができます。
var str = "apple,orange,melon";
//文字列の中にあるカンマで区切って、配列を生成する
var array = str.split(",");
//["apple", "orange", "melon"]
console.log(array);
配列の中に入っている値(要素)の数を調べるために
lengthプロパティを利用します。
var array = ["apple", "orange", "melon"];
//3と表示される
console.log(array.length);
Arrayオブジェクトについての詳しい説明(MDN)
Array | Mozilla Developer Network