Javascriptでは、グローバル変数の値をイベントコンテキスト内から変更できますか？

Question

多分それは愚かな質問ですが、と：

var a = { 
    scrolled: false 
}; 

var handler = function() { 
    a.scrolled = true; 
    console.log(a.scrolled); // always "true" 
}; 

window.addEventListener('scroll', handler); 
console.log(a.scrolled); // always "false" 

「外」のコンテキストにイベント内からa.scrolledの値を変えるチャンスがありませんか？

おかげで....

Answer 1

あなたのハンドラは、スクロールにトリガ、あなたがスクロールするまでa.scrolledはfalseです。ただし、11行目のconsole.log(a.scrolled)は、スクロールした後ではなく、JSが読み込まれたときに実行されるので、スクリプトの開始時にfalseが印刷されます。

あなたがスクロールを開始すると、

でライン8回のキックであなたの他のconsole.log(a.scrolled)だから何があなたのコンソールに表示されますが、このようなものです：。

false 
true 
true 
true 
true 

最初false出力はラインからです図11に示すように、残りはライン8のハンドラの内側にある。

Answer 2

あなたのコードでは、値を変更し、そしてそれはとてもグローバル（あなたのコードはグローバルスコープであると仮定すると）ん。

console.log(a.scrolled); // always "false" 

あなたが値を変更するときあなたが値を変更するためです。

値を変更すると過去に移動してコンソールに印刷する前に変更する時間がかかりません。

過去に印刷した出力は変更されません。

Answer 3

すべての人に、特に@ patrick-robertsのおかげで、正しい例がわかりました。これは非同期コードリファレンスの問題ですが、私はこの質問/回答を例として考えています。

var a = { 
    scrolled: false 
}; 

var handler = function() { 
    a.scrolled = true; 
}; 

window.addEventListener('scroll', handler); 

setTimeout(function() { 
     console.log(a.scrolled)} 
     , 10000); 

// a.scrolled is kept "false" if, in 10 seconds, no scroll event happens...