苦学楽学塾

　苦学楽学塾　ホームページ

最終更新日：2025年1月5日

　配列を作るには、var array = [];とする方法と、Arrayクラスのconstructorを使って、var array = new Array;とする方法があります。後者では、var array = new Array(10);として配列の要素数を指定することができます(配列要素はundefinedになります)。文字列と同様に、配列にもlengthプロパティがあり、配列の要素数が入っています。現状の要素数よりも小さな数を設定すると、その数を添字とする以降の要素は削除されてしまうので注意してください。配列のテスト・プログラムはこちら。

　JavaScriptの配列では、変数名を並べた配列に配列データを代入し、

var [s1, s2, s3] = ["abc", "defg", "hij"];

とすると、s1に"abc"が入り、s2に"defg"が入り、s3に"hij"が入ります(分割代入と言います)。

　配列には注意点があります。配列の複製を作るつもりで、

としてしまうと、複製したつもりなのに、ar1[1] = 3;とすると、ar2[1]も3になってしまいます。配列同士の代入は単に配列名を代入しているだけで配列そのものは1つです。そこで、要素が同じ配列をもう一つ作るのには、スプレッド構文と言いますが、'...'を用いて、

とします。ar1[1] = 3;としても、ar2[1]は2のままです。

　配列オブジェクトのメソッドには以下のようなものがあります。

　引数の配列を連結した配列を返します。

var ar1 = [ 'grape', 'melon' ];

var ar2 = [ 'orange', 'apple', 'banana' ];

var ar3 = ar1.concat(ar2);

alert(ar3.toString());

連結された配列がar3に入り、grape,melon,orange,apple,bananaと表示されます。

　配列の要素を1つずつ取り出しながら、引数に指定するコールバック関数にその要素を渡して、条件に適合するかどうか判断を仰ぎます。コールバック関数は、true，falseで適合するかどうかを返し、everyメソッドは配列の全要素についてtrueであればtrueを返します。以下では、生徒の点数を配列ar6に入れて、everyメソッドからfunc6を起動し、66点以上を合格と判断して全員合格かどうかを判定します。

var ar6 = [ 69, 77, 88 ];

if (ar6.every(func6)) alert("全員合格！");

function func6(value) { return value > 65; }

全員が66点以上なので、全員合格！と表示します。

　配列の第2引数番めから第3引数番めの前までを第1引数で指定するものに置き換えます。第3引数を省略すると、末尾までが置き換えられます。

var ar1 = [ 'grape', 'melon' ];

var ar2 = [ 'orange', 'apple', 'banana' ];

var ar3 = ar1.concat(ar2);

ar3.fill('peach', 1, 3);

alert(ar3.toString());

第2引数番めのmelonから第3引数番めappleの前のorangeまでをpeachで置き換えるので、grape,peach,peach,apple,bananaと表示されます。

　配列の要素を1つずつ取り出しながら、引数に指定するコールバック関数にその要素を渡して、条件に適合するかどうか判断を仰ぎます。コールバック関数は、true，falseで適合するかどうかを返し、trueとなった配列要素のみを要素とする配列を返します。以下では、6種類のfruitインスタンスを配列fruitsに入れて、fruitsのfilterメソッドからfunc3を呼び出してpriceが600円未満のfruitを選び出し、600円未満のfruitを集めた配列をbuyableに入れます。さらに、buyableのforEachメソッドからfunc4を呼び出して、結果を表示させます。

constructor(name, price) {

fruits.push(new fruit('orange', 150));

fruits.push(new fruit('lemon', 350));

fruits.push(new fruit('cherry', 650));

fruits.push(new fruit('strawberry', 550));

fruits.push(new fruit('melon', 950));

fruits.push(new fruit('muscat', 750));

var buyable = fruits.filter(func3);

buyable.forEach(func4);

function func3(value) { return value.price < 600; }

function func4(value) { alert(value.name + ' is reachable.') }

6種類のfruitのうち、orange, lemon, strawberryが600円未満で適合し、

orange is reachable.

strawberry is reachable.

とダイアログに表示します。

　配列の要素を1つずつ取り出しながら、引数に指定するコールバック関数にその要素を渡して、条件に適合するかどうか判断を仰ぎます。コールバック関数は、true，falseで適合するかどうかを返し、はじめてtrueとなった配列要素を返します。以下では、filterメソッドの例で使った配列fruitsを使って、名前の中に'be'というところがあるものを探します。

alert('find: ' + fruits.find(func5).name);

function func5(value) { return value.name.search(reg5) > 0; }

straberryが適合するので、find: strawberryと表示されます。

　配列の要素を1つずつ取り出しながら、引数に指定するコールバック関数にその要素を渡して処理を繰り返します。以下は、ベクトルのスカラー積の計算に利用する例です。

var v1 = [ 1, 2, 3 ];

alert(v1.toString());

function func1(value) { v1[j1] = value * x1; j1++; }

ベクトルv1の各成分にx1=5がかけられて、v1の成分が、5,10,15と表示されます。

　引数に指定されたものが配列に含まれていればtrueを返します。

var ar1 = [ 'orange', 'apple', 'banana' ];

alert(ar1.includes('apple'));

alert(ar1.includes('peach'));

前者ではtrue，後者ではfalseが返ります。

　引数に指定されたものが配列に含まれていれば、最初の添字(番号)を返します。

var ar1 = [ 'orange', 'apple', 'banana' ];

alert(ar1.indexOf('apple'));

2番目にあるので1が返ります。

　配列の要素を指定した文字列で区切って連結させた文字列を作ります。

var ar1 = [ 'orange', 'apple', 'banana' ];

alert(ar1.join(', '));

とすると配列要素がカンマと空白の続きで区切られて、orange, apple, bananaと表示されます。

　配列の要素を1つずつ取り出しながら、引数に指定するコールバック関数にその要素を渡して処理を繰り返します。forEachとの違いは処理結果を配列の要素に返す点です。以下は、ベクトルの内積の計算に利用する例です。

var v1 = [ 1, 2, 3 ];

var v2 = [ 4 ,5, 7 ];

alert("v1・v2 = " + String(v3[0] + v3[1] + v3[2]));

function func2(value) { return value * v2[j1++]; }

ベクトルv1の各成分にv2の成分がかけられてv3の該当要素のところに結果が戻されます。上記では、v1・v2 = 35と表示されます。

　配列の末尾の要素を削除し、削除した要素を返します。要素数が1減ります。

var ar1 = [ 'orange', 'apple', 'banana' ];

alert(ar1.pop() + ' ' + ar1.toString());

bananaが返り、配列からはbananaが削除されて、banana orange,appleと表示されます。

　なお、配列の要素数lengthプロパティを減らすことによっても、配列の末尾の方から要素が削除されます。

　引数で指定したものを配列の末尾に付加します。要素数が1増え、増えた要素数を返します。

var ar1 = [ 'orange', 'apple', 'banana' ];

alert(ar1.push('peach') + ' ' + ar1.toString());

4 orange,apple,banana,peachと表示されます。

　配列の要素を逆順に並べ替えます。

var ar1 = [ 'grape', 'melon' ];

var ar2 = [ 'orange', 'apple', 'banana' ];

var ar3 = ar1.concat(ar2);

alert(ar3.toString());

並べ替えの結果、reverse: banana,apple,orange,melon,grapeと表示されます。

　配列の先頭の要素を削除し、削除した要素を返します。要素数が1減ります。

var ar1 = [ 'orange', 'apple', 'banana' ];

alert(ar1.shift() + ' ' + ar1.toString());

orangeが返り、配列からはorangeが削除されて、orange apple,bananaと表示されます。

　配列の第1引数番めから第2引数番めの前までを返します。元の配列には変わりはありません。第2引数を省略すると、末尾までが取り出されます。

var ar1 = [ 'grape', 'melon' ];

var ar2 = [ 'orange', 'apple', 'banana' ];

var ar3 = ar1.concat(ar2);

var ar4 = ar3.slice(1, 3);

alert('ar3:' + ar3.toString() + ' ar4:' + ar4.toString());

ar3の1番めmelonから3番めappleの手前のorangeまでを取り出してar4に入れるので、ar3:grape,melon,orange,apple,banana ar4:melon,orangeと表示されます。

　配列の要素を1つずつ取り出しながら、引数に指定するコールバック関数にその要素を渡して、条件に適合するかどうか判断を仰ぎます。コールバック関数は、true，falseで適合するかどうかを返し、配列の要素の中に1つでも適合するものがあればtrueを返します。以下では、生徒の課題の完了をチェックします。

var ar7 = [ 'done', 'done', done', 'notyet' ];

if (ar7.some(func7)) alert("連帯責任で全員教室の掃除！");

function func7(value) { return value !== 'done'; }

課題がまだ、と言う人がいるので、連帯責任で教室の掃除！と表示します。

配列の要素をソートして昇順に並べ替えます。

var ar1 = [ 'grape', 'melon' ];

var ar2 = [ 'orange', 'apple', 'banana' ];

var ar3 = ar1.concat(ar2);

alert('sort: ' + ar3.toString());

並べ替えの結果、sort: apple,banana,grape,melon,orangeと表示されます。

　配列の第1引数番めから第2引数個の要素を第3引数以降のもので置き換えます。第3引数以降を省略すると、配列から削除されます。第2引数を0にすると、置き換えではなく、第3引数以降が挿入されます。

var ar1 = [ 'grape', 'melon' ];