Welcome toVigges Developer Community-Open, Learning,Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
520 views
in Technique[技术] by (71.8m points)

window.location.href是同步还是异步?

代码:

$("button").on("click",function() {
    //跳转的链接写为同源地址,方便查看localStorage来测试跳转后的代码是否执行
    window.location.href='http://127.0.0.1/index.html';
    setTimeout(function() {
        localStorage.setItem("aa","aaaa");
    },0);
})

此时,setTimeout中的代码即使跳转了,也依然会执行,是因为window.location.href是异步吗?
但如果把setTimeout的延迟时间改为1000,即:

$("button").on("click",function() {
    window.location.href='http://127.0.0.1/index.html';
    setTimeout(function() {
        localStorage.setItem("aa","aaaa");
    },1000);
})

修改后的代码执行结果是:页面跳转了,但没有执行setTimeout中的语句。
有能帮忙解答下吗 window.location.href是同步还是异步,执行机制是怎样的。
感谢~~


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

你这是给属性赋值,又不是执行方法,哪有什么同步异步,当然是同步。

什么叫异步:

let href = 'This is a new url.';

// 假设有如下异步方法
location.setHref(href, callback);

location.href === href; // 调用异步方法后立即取值,是 true 是 false 都有可能

function callback(newhref) {
    location.href === newhref; // 异步回调中再取值,是 true
}

这叫异步。

你这个例子根本不是同步异步的问题,而是当浏览器页面地址变化后、原页面的 JS 引擎生命周期是否立即终止的问题。

答案:无论是 ES 标准还是 HTML 规范,都没定义这种行为应该怎么做,所以浏览器做出怎样的表现,都是有可能的,也都是合理的。你的业务也不应该依赖此表现。


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to Vigges Developer Community for programmer and developer-Open, Learning and Share
...