配列の代入

変数と同じような書き方で準備が可能。 中身を入れるときの書き方が変わってくるので、確認しておこう。

宣言は変数と同じ

宣言の書き方は変数と全く同じ。

var let const が利用できるけど、今回は letconst で進めて行こう。

代入の仕方

配列の代入の基本は [] を利用する方法。

const example = [ 10, 20 , 30 ];

この様にすると 3 つの値が配列として代入される。 配列として代入する物が文字列の場合には ''で文字列を囲んであげよう。

const example = [ '10', '20', '30' ];

配列の中身を使うときは何番目かを [] で示してあげる。

const example = [ 10, 20, 30 ];
console.log( example[2] );
// 出力内容: 30

配列に追加する

配列に値を追加したいときには、 push を利用する。

const example = [ 10, 20, 30 ];
example.push(40); // 40が末尾に追加される。
console.log( example[3] );
// 出力内容: 40

追加したい配列名.push(追加したい値) の形で利用するっていうこと。そんなに難しくないでしょ?

配列を結合する

二つの配列をつないで一つにしたいという事もあったりする。 そんな時は concat を利用する事になる。

const example1 = [ 10, 20, 30 ];
const example2 = [ 40, 50, 60 ];
const example = example1.concat(example2); // example1 の後ろに example2 がくっついて exampleになる
// このときのexampleは [ 10, 20, 30, 40, 50, 60 ]

consolo.log( example[5] );
// 出力内容: 60

Excel を使ったことがある人なら concatenate という関数を見たことがあるかもしれないけれども、それの略。 蛇足だけど、Shell 言語の catconcatenate の真ん中を抜いた物なんだってさ。意味わからない省略形。

配列同士じゃなくて、値を追加することも可能。

const example1 = [ 10, 20, 30 ];
const example = example1.concat( 40 ); // example1 の後ろに 40 という値がくっついて exampleになる
// このときのexampleは [ 10, 20, 30, 40 ]

console.log( example[3] );
// 出力内容: 40

配列から要素を削除する

配列の中身を「要素」と呼ぶ。 何か一つを消そうと思ったらどうするか。

splice を利用すると消すことができる。 このときに必要なのは 何番目の要素から 何個消したいか という事。

const example = [ 10, 20, 30, 40 ];

example.splice( 2, 1 ); // 2番目の要素から1つ消す
console.log( example[2] );
// 出力内容: 40

配列の要素の数を知る

処理を進めると配列の中身が何個有るのかを知りたいという事がある。 そんな時に登場するのは length

const example = [ 10, 20, 30, 40 ];

console.log( example.length ); // exampleの要素数を出力する
// 出力内容: 4

これはあくまでも個数なので、ゼロオリジンの考え方は関係ない。中身の個数で知ることができる。

なので、一番最後の要素を使いたいと思ったら...

const example = [ 10, 20, 30, 40 ];

console.log( example[ example.length - 1 ] ); // 個数から1を引けば最後の要素のインデックスになる
// 出力内容: 40

1 を引くのがポイントだね。

配列の要素から、インデックスを調べる

個人的にはあまり使わないけど、知っておくと便利なのは『この中身がドコにあるのか』を調べる方法。 indexOf で調べることができる。

const example = [ 10, 20, 30, 40 ];

const index = example.indexOf( 20 ); // 20という値が何番目にあるのか探して、何番目かをindexに入れる
console.log( example[index] );
// 出力内容: 20

知っておけば使える便利ワザなので、頭の片隅に置いておこう。

これ以外にもたくさん

配列の処理はこれ以外にもたくさんある。 でも、初心者から次のステップに行くにはこれくらいわかっていれば大丈夫かなと思うよ。

Last updated