繰り返し・反復処理
JavaScriptで繰り返し処理を行う場合の記述方法についての説明です。
for
forは3つの式を指定できるループの記述方法です。
for (初期処理; 反復前評価条件; ループ毎終了処理){
// ループする処理
}初期処理はループ開始に先立って1回だけ行われる処理です。 ここではカウンタ変数の初期化等がよく行われます。
反復前評価条件は、この条件がtrueまたは省略されている場合にループの処理が行われます。 カウンタ変数が指定した値であるか等のチェック条件を記載します。
ループ毎終了処理は、各ループが1回終わる毎に実行される処理です。 カウンタ変数の増加や減少を行います。
いずれも省略可能です。具体的には以下のように記載します。
for (let i = 0; i < 3; i++) {
console.log(i); // 0 , 1 ,2
}他によく使われるのは、配列全てについて処理を繰り返したい状況などです。
let array = [1,1,2,3,5];
for (let i = 0; i < array.length; i++) {
console.log(array[i]); // 1,1,2,3,5
}for in
特定のオブジェクトのプロパティについて処理を繰り返したい場合はfor inが使えます。
let array = { name : 'taro' , age : 100 , birthdate : new Date(1920,1,1) };
for (const p in array){
console.log(`${p} : ${array[p]}`);
// => "name : taro"
// => "age : 100"
// => "birthdate : Sun Feb 01 1920 00:00:00 GMT+0900 (日本標準時)"
}for of
配列やMap、Set等の反復可能なオブジェクトについて繰り替えし処理を行う場合はfor ofが使えます。
(便利だけどAirbnb
ではfor-inと共に使わないようにと勧められています。)
let array = [1,1,2,3,5];
for (const item of array){
console.log(`${item}`);
// => 1, 1, 2, 3, 5
}let s = new Set();
s.add(1);
s.add(2);
s.add(3);
for (const item of s){
console.log(`${item}`);
// => 1, 2, 3
}Mapについては以下のような操作が可能です。
let m = new Map()
m.set(1, 'one')
m.set(2, 'two')
for (let [k, v] of m) {
console.log(`${k} -> ${v}`);
// 1 -> one
// 2 -> two
}
for (let k of m.keys()) {
console.log(k);
// 1, 2
}
for (let v of m.values()) {
console.log(v);
// one, two
}
for (let [k, v] of m.entries()) {
console.log(`${k} -> ${v}`);
// 1 -> one
// 2 -> two
}文字列は1文字毎の操作となります。
const str = 'abc';
for (const s of str) {
console.log(s);
// a, b, c
}while
指定した条件がtrueの間だけ繰り替えし処理を行う場合whileが使用できます。
ループ開始前に毎回条件部がチェックされるため、以下の例でlet i = 5
で宣言されている場合ループは1回も繰り返されない事になります。
let i = 0;
while (i < 5) {
console.log(i); // 0, 1, 2, 3, 4
i += 1;
}do while
whileと同様ですが、条件はループの実行後に評価されます。
この場合、以下の例でlet i = 5ならループは1回処理されることになります。
let i = 0;
do{
console.log(i); // 0, 1, 2, 3, 4
i += 1;
} while (i < 5)break
キーワードbreakを使うと、ループの繰り返しを終了できます。
let array = [1,3,7,9,10];
for (let i = 0; i < array.length; i++) {
let value = array[i] ;
if (value === 9) {
break;
}
console.log(value); // 1, 3, 7
}ループが入れ子の場合、breakが記載されている1番内側のループを中断します。
for (let i = 0; i < 10; i++) {
if(i == 2){
break;
}
for (let j = 0; j < 10; j++){
if(j === 3){
break;
}
console.log(`i=${i} , j=${j}`);
//i=0 , j=0 i=0 , j=1 i=0 , j=2
//i=1 , j=0 i=1 , j=1 i=1 , j=2
}
}continue
continueはその回のループについてcontinue以降にかかれている部分の処理をスキップし、 次の回のループを先頭から行います。
let array = [1,3,7,9,10];
for (let i = 0; i < array.length; i++) {
let value = array[i] ;
if (value % 3 === 0) {
continue;
}
console.log(value); // 1, 7, 10
}