Javascript本地存储范围

我第一次使用localstorage，遇到了一些范围问题

当我尝试

console.log（test）

时，我在第二条

if

语句中得到

undefined

。我做错了什么

我的代码如下

$("document").ready(function(){

    var is_stopped = false;

    source.onmessage = function(event) {

        if (is_stopped) {
            localStorage.setItem('offline', event.data);
            var test = localStorage.getItem('offline');
            console.log(test); // works here
        }       

        if (!is_stopped) {
            document.getElementById("result").innerHTML += "Data:" + event.data + "<br>";
            console.log(test); // undefined 
        }

        $("#start").click(function(){
            is_stopped = false;
        });

        $("#stop").click(function(){
            is_stopped = true;
        });

});

<div id="result"></div>
<button id="stop"> stop</button>
<button id="start"> start</button>

$（“文档”）.ready（函数（）{
var被停止=错误；
source.onmessage=函数（事件）{
如果（是否已停止）{
localStorage.setItem（'offline'，event.data）；
var test=localStorage.getItem（'offline'）；
console.log（test）；//在这里工作
}       
如果（！已停止）{
document.getElementById（“结果”）.innerHTML+=“数据：”+event.Data+“
”；
console.log（test）；//未定义
}
$（“#开始”）。单击（函数（）{
is_stopped=false；
});
$（“#停止”）。单击（函数（）{
is_stopped=true；
});
});
停止
开始
当
停止时，名为
test
的变量未定义，因为它未在
停止时
条件之外声明，因此为false

这将有助于：

var test = null; // declare outside conditional

if (is_stopped) {
    test = localStorage.getItem('test');
}       

if (!is_stopped) {
    console.log(test); // returns null
}

这可能是因为is_stopped为false，因此它不会输入第一个if，也不会检索该值。请注意，函数结束时会对函数内声明的变量进行垃圾收集

var test;//stays persistent
source.onmessage = function(event) {

    if (is_stopped) {
        localStorage.setItem('offline', event.data);
        test = localStorage.getItem('offline');
        console.log(test); // works here
    }       

    if (!is_stopped) {
        document.getElementById("result").innerHTML += "Data:" + event.data + "<br>";
        console.log(test);
    }
};

var test；//保持持久性
source.onmessage=函数（事件）{
如果（是否已停止）{
localStorage.setItem（'offline'，event.data）；
test=localStorage.getItem（'offline'）；
console.log（test）；//在这里工作
}       
如果（！已停止）{
document.getElementById（“结果”）.innerHTML+=“数据：”+event.Data+“
”；
控制台日志（测试）；
}
};

提示：将单击事件监听器移到其他监听器之外会使它们工作得更好…
当您运行应用程序时，
var\u stopped
将设置为false

在这种情况下，
if（！is_stopped）{..}
将执行。
if（is_stopped）{..}
将不执行

由于托管
var测试
将被提升到函数的顶部&该函数未定义

test
只有在执行了
if（is_stopped）{..}
时才会被赋值，当然它是未定义的。因为您没有定义它。您不能同时进入
if（is_stopped）
和
if（！is_stopped）
两个部分。因为它只在
if（is_stopped）中定义
块，它在其他任何地方都没有值，特别是在（！已停止）的
中
block。你的点击处理程序在哪里？你正在设置的点击被停止，但你没有要求任何进一步的操作。你需要一个处理程序来告诉浏览器在设置状态后你真正想要做什么。不，js有功能scoping@Jonasw是的……那么你的观点是什么呢？将这段代码放在
onmessage
处理程序中，它将如注释中所述的行为不正常。它是在条件之外声明的