在前端领域，提供并发处理能力是相当复杂的问题。传统的 JavaScript 引擎是单线程执行的，这就意味着只有一个任务在同时进行，当它在执行的时候，其他的任务会被放到等待队列中，等待运行。这种方式限制了 JavaScript 对于一些高性能计算场景的应用，也限制了它的并发能力。
但是，ECMAScript 2017 中引入的 SharedArrayBuffer 却可以帮助我们在 JavaScript 中轻松实现并发处理能力。SharedArrayBuffer 是一种新的内置对象类型，它可以被用来创建一个 ArrayBuffer，这个 ArrayBuffer 可以被多个代理共享读取和写入。其实，SharedArrayBuffer 相当于物理内存中的一块内存区域，可以被多个线程同时操作。
SharedArrayBuffer 使用
SharedArrayBuffer 创建的方式与 ArrayBuffer 很相似，只是在新建时需要加上“new SharedArrayBuffer()”语句。
// 创建一个长度为 16 的 SharedArrayBuffer const sharedBuffer = new SharedArrayBuffer(16);
接下来，我们可以通过 TypedArray 视图来操作这个共享缓冲区。通过定义一个 new TypedArray(buffer, byteOffset, length) 视图对象，我们可以读取或者写入这个共享内存对象。
// 创建一个 Int32Array 视图，它可以操作第一个 4 个字节 const int32View1 = new Int32Array(sharedBuffer, 0, 1);
SharedArrayBuffer 线程同步
在多线程编程环境中，需要对数据的访问进行协调，以解决线程间竞争的问题。JavaScript 在多线程环境下，为了保证线程安全，采用了一种严格的同步策略，即使用“锁”来保证同时只有一个线程操作共享内存。这意味着，任意时间只有一个线程可以获得锁定，而其他线程必须等待当前线程释放锁定后才能进行操作。
在 SharedArrayBuffer 中，使用了一种新的线程同步原语，即 Atomics。
-- -------------------- ---- ------- -- ------------ - ----- ------------ - --- --------------------- ----- --------- - --- ------------------------- -- -- ----- --------------- ---------------------- -- --- -- ---------- -------------------------- -- -
使用 Atomics.add() 方法是通过原子操作来保证变量的原子性操作。在原子操作期间，线程上下文会被锁定，这样就可以避免与其他线程同时操作同一个共享内存。
SharedArrayBuffer 可能的问题
由于 SharedArrayBuffer 可以被多个线程同时读取和写入，可能会导致一些意想不到的问题。例如，由于读取和写入的顺序是不确定的，可能导致某些线程看到的值不是期望中的值。
除此之外，SharedArrayBuffer 也存在一些安全性问题。由于 SharedArrayBuffer 的操作是“非重入式的”，如果线程被中断，它可能无法确定共享内存中的状态。
此外，在一些低效浏览器中，可能对于 SharedArrayBuffer 这种新功能还不支持。
结论
SharedArrayBuffer 提供了一种新的机制来帮助 JavaScript 程序员处理并发计算问题。它使得多线程编程更加容易，允许我们在前端中使用多线程操作来优化性能。
在实际开发中，我们需要特别注意 SharedArrayBuffer 的安全性以及在不同浏览器上的支持情况。并且，在使用 SharedArrayBuffer 这种新特性时，我们需要注意同步和锁定的问题，以确保多线程间的操作都是安全和可靠的。
参考链接：
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6710887e5f551281026be0cd