ねっとぱんだ-プログラミング勉強ブログ-

Webデザイン、プログラミングの勉強ブログ。

【javascript】switch構文~setTimeout等


swich構文の復習

var x = 1;
switch(x){
        case 1:
            console.log('1です。') ;
        break;//必須
        case 2:
            console.log('2です。');
        break;
        default:
            console.log('1と2以外の値です。');
        break;
}

caseは並べてかける。

switch(x){
        case 1:
            console.log('1です。') ;
        break;//必須
        case 2:
            console.log('2です。');
        break;
        case 3:
        case 4:
            console.log('3か4です。');
        break;
        default:
            console.log('1と2以外の値です。');
        break;
}

while構文の復習

iが0以下の間コンソールに表示

var i = 0;
while (i <= 10){
    console.log(i);
    i++;
} 

do while構文

var i = 100; 
do {
    console.log(i);
    i++;
} while (i <= 10);

iが条件を満たしていなくても、条件式が判断される前に一回だけdo内の処理が実行される。

breakとcontinue

break…ループを抜ける。

for(var i = 0;i < 10; i++){
    if (i === 5){
        //iが5になったときループを抜ける
        break;
    }
    console.log(i)
}

continue…その時だけスキップして処理を続ける。

for(var i = 0;i < 10; i++){
    if (i > 3 && i < 5){
        //iが3を超過し且つ5未満の時の処理をスキップする。
        continue;
    }
    console.log(i)
}

returnの復習(関数に値を返す。)

function hello(name){
    //関数に以下の式の結果を返す
    return "hello," + name;
}
//aに関数内の処理の結果が代入される
//returnを書いていない場合はundefinedになる
var a = hello('takeshi');
console.log(a);

関数の書き方の復習

関数に名前を指定せず、functionの後に引数をつけることもできる。
これを無名関数という。

var a = function(name){
    var a = "hello," + name;
    return a;
};
console.log(a('takeshi'));

即時関数

定義してすぐに呼び出すことができる。

(function(name){
    console.log('hello'+name);
})('takeshi');
//最後のカッコに引数を入れる。

複雑なコードを書くようになったら即時関数を使うことで変数をローカル変数として使うことができる。(他のコードに影響を与えない。)

setIntervalとsetTimeout

setIntervalで指定した時間で処理を繰り返すことができる。

//1秒ごとにshow関数を実行
var i = 0;
function show(){
console.log(i++)
}
setInterval(function(){
    show();
},1000);

1秒後に一回だけshow関数が表示される。

var i = 0;
function show(){
console.log(i++)
}
setTimeout(function(){
    show();
},1000);

setIntervalは前の処理の読み込みが終わっていなくても動作してしまう。
setTimeoutは前の処理が終わったかを考慮する。

setTimeoutでのループ

以下の式はループするがそのままずっと続いてしまう。

var i = 0;
//1秒に一回、show関数を呼び出す
function show(){
    console.log(i++)
    setTimeout(function(){
    show();
    },1000);
}
//以下で呼び出した後、関数によって呼び出され続ける。
show();

setTimeoutのループを止めるときの記述

var i = 0;
function show(){
        console.log(i++);
        //setTimeout自体を変数に格納
        var a = setTimeout(function(){
        show();
    },1000);
    //止めるタイミングでclearTimeoutを指定
    if(i > 2){
        clearTimeout(a);
    }
}
show();