按照什么顺序接收`storage`事件？

Question

按什么顺序接收

storage

事件？

例如tab_1执行代码

localStorage.set('key', 1);
localStorage.set('key', 2);

tab_2 执行代码

localStorage.set('key', 3);
localStorage.set('key', 4);

它们同时执行代码。

问题：

• 2可以先存储在1之前吗？
• 1和2之间可以存储3或4吗？
• tab_3 能否以与存储值的顺序不同的顺序接收

  storage

  事件？（例如，如果我们存储 3, 4, 1, 2，我们可以接收 1, 2, 3, 4，甚至以随机顺序（如 4）， 1,2,3)

Answer 1

文档：https://developer.mozilla.org/en-US/docs/Web/API/Storage

2可以先存储在1之前吗？

Javascript 使用单线程并按顺序执行命令。所以，如果你有

localStorage.setItem('key', 1);
localStorage.setItem('key', 2);

那么我的期望是1在2之前存储，并且2覆盖1，因为

setItem

似乎是一个简单的函数调用，我不认为它涉及异步数据。我说“我不认为”是因为我不知道它的源代码在哪里，但考虑到它是本机代码：

由浏览器开发人员来实现它或集成一个实现。我知道您想真正找到答案，所以这里有一个测试：

let one = 0;
let two = 0;
for (let i = 0; i < 10000; i++) {
    localStorage.setItem('key', 1);
    localStorage.setItem('key', 2);
    if (localStorage.getItem('key') == 1) one++;
    else two++;
}
console.log('one ' + one + ' two ' + two);

FireFox 中的输出：

一0二10000

Chrome 中也是如此。所以答案是不。

1和2之间可以存储3或4吗？

如果两个不同选项卡中的 Javascript 可以同时运行，那么可以。让我们为此编写一个测试：

setTimeout(function() {alert("the other tab")}, 5000);

在一个选项卡中运行此代码，然后快速转移到另一个选项卡。如果 5 秒后您在其他选项卡上看到警报，那么答案是肯定的。如果没有，那么答案是否定的。在 FireFox 中运行此命令并移至另一个选项卡，我可以看到现在不活动的选项卡上出现一个红点，表示警报发生在那里。 Chrome 也发生了同样的情况，但那里的点是橙色的。所以答案是是。

tab_3 是否可以按照与值存储的顺序不同的顺序接收存储事件？（例如，如果我们存储 3, 4, 1, 2，我们可以接收 1, 2, 3, 4，甚至以随机顺序，如 4, 1, 2, 3)

这很大程度上取决于实现，但我希望存储在

localStorage

中的数据的加载在每次调用时都以相同的方式运行。您可以通过分别在 tab1 和 tab2 中运行代码来测试它，可能使用

setTimeout

并打开更多选项卡，在运行代码之前或之后检查每个选项卡中

localStorage

的值。如果它们相同，那么测试结果表明它确实可靠。如果不是，那么测试就推翻了我关于可靠性的假设。