web-dev-qa-db-ja.com

javascript setInterval()と変数スコープ

OK、同じタイトルのいくつかの質問をここで読みましたが、それでも問題の解決策を見つけることができませんでした。私は基本的なJavaScriptカウントダウンタイマーに取り組んでおり、a変数の値を更新することに固執しています。

_a = 100;
var i = setInterval( function(){ timer( a ); }, 1000 );

function timer( a ){
    console.log( a );
    if( a < 1 ){     
        console.log( 'Reaching Stop' ); 
            clearInterval( i );
            return;         
    } 
    a -= 1;
}
_

aの値を-1ずつ減らしているので、console.log( a )は毎回1少なくなるはずです。

_100 99 98 ......
_

しかし、console.log( a )は常に_100_を与えています

ここでJavaScriptの初心者は優しくしてください。ありがとう。

12
Jaideep Singh

グローバル変数aにアクセスするために、timer関数のパラメーターにaを渡さないでください。 aがタイマー関数に渡されると、グローバル変数の値が使用されますが、タイマーでは、パラメーター変数はタイマー関数に対してローカルであり、その値を変更してもグローバル変数の値は変更されません。これは、コードにaという名前の2つの変数があり、1つはグローバルで、もう1つはタイマー関数に対してローカルであり、タイマーのローカル変数の値を変更していることを意味します。

a = 100;
var i = setInterval( timer, 1000 );

function timer() {
    console.log( a );
    if ( a < 1 ) {
        console.log( 'Reaching Stop' ); 
        clearInterval( i );
        return;         
    } 
    a -= 1;
}
11
Adil

変数をパラメーターとして関数に渡すと、クロージャーが作成され、変数の新しいスコープが作成されます。

変数はグローバルであるため、次のように渡す必要はありません。

http://jsfiddle.net/FBVTT/

var a = 100;
var i = setInterval(timer, 1000);

function timer() {
    console.log(a);
    if (a < 1) {
        console.log('Reaching Stop');
        clearInterval(i);
        return;
    }
    a -= 1;
}

これが クロージャに関するMDNページ です。

2
Jason P