关于storage事件接收顺序与存储行为的技术咨询

场景说明 #

tab_1执行代码：

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

tab_2同时执行代码：

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

问题解答 #

1. 是否会出现2先于1被存储的情况？ #

不会。同一个标签页内的JavaScript是单线程同步执行的，localStorage.set('key', 1)必须执行完成后，才会轮到下一行的set('key', 2)执行，所以同一个标签里的写入操作严格遵循代码顺序，不可能出现2比1先存储的情况。

2. 是否会出现3或4被插入到1和2之间存储的情况？ #

会。tab_1和tab_2是两个独立的执行环境，它们的代码并行运行，没有内置的同步机制来保证跨标签的写入顺序。比如tab_1刚写完1，tab_2就写入了3，之后tab_1才写入2，这样存储顺序就是1、3、2，相当于3插到了1和2之间；同理也可能出现4插入到1和2之间的情况。

3. tab_3接收的storage事件顺序是否可能与存储值的顺序不一致？例如存储顺序为3、4、1、2时，是否会接收到1、2、3、4或4、1、2、3这类非对应顺序？ #

不会。浏览器会保证storage事件的触发顺序和实际存储操作的完成顺序完全一致。每一次localStorage写入操作完成后，才会向其他标签页发送对应的事件，事件的先后顺序严格遵循实际写入的先后顺序，不会出现乱序的情况。

内容的提问来源于stack exchange，提问作者Ivan Ivanyuk