JavaScript - 原子对象

欢迎，有抱负的程序员们！今天，我们将深入探索JavaScript中迷人的原子对象世界。如果你是编程新手，不用担心；我将作为你的友好向导，一步一步地解释所有内容。那么，让我们开始吧！

原子对象

原子对象在JavaScript中就像一个特殊的工具箱，它帮助我们以安全且协调的方式处理共享内存。想象你和你的朋友们正在一个团队项目中工作，但你们都在不同的房间里。原子对象就像一套规则，帮助你们沟通和协作，而不会互相干扰。

什么是共享内存？

在我们深入探讨之前，让我们先了解什么是共享内存。在编程中，共享内存就像一块白板，多个人（或者在我们的情况下，程序的多个部分）可以同时从中读取和写入。这非常有用，但如果管理不当，也可能导致混乱。

“原子”的本质

现在，你可能好奇，“为什么它被称为‘原子’？”在编程的世界里，“原子”并不意味着化学中的微小粒子。相反，它意味着某件事是完整无中断地一次性发生的。

想象你正在做三明治。如果这是一个原子操作，那意味着你会一次性开始并完成三明治的制作，而不会有人触碰食材或打断你。这就是编程中原子操作的本质！

原子操作

让我们看看我们可以使用原子对象执行的一些操作。这些操作帮助我们安全且高效地处理共享内存。

原子操作表

操作	描述
add()	将给定值添加到数组中特定位置的值
and()	执行按位与操作
compareExchange()	将数组中的值与给定值进行比较，如果匹配则替换
exchange()	将给定位置上的值替换为新值
load()	读取给定位置上的值
or()	执行按位或操作
store()	在给定位置存储值
sub()	从给定位置上的值中减去一个值
xor()	执行按位异或操作
wait()	等待直到满足特定条件
notify()	唤醒等待的进程

示例

现在，让我们看一些示例，了解如何在实践中使用这些原子操作。

示例 1：原子地添加数字

// 创建一个共享的 Int32Array
const buffer = new SharedArrayBuffer(4);
const intArray = new Int32Array(buffer);

// 将第一个元素初始化为 0
intArray[0] = 0;

// 原子地将 5 添加到值
Atomics.add(intArray, 0, 5);

console.log(intArray[0]); // 输出：5

在这个示例中，我们创建了一个共享数组并使用 Atomics.add() 添加了一个数字。这确保即使程序的多部分同时尝试修改这个值，它们也不会互相干扰。

示例 2：比较和交换值

const buffer = new SharedArrayBuffer(4);
const intArray = new Int32Array(buffer);

intArray[0] = 10;

// 尝试将 10 替换为 20
const oldValue = Atomics.compareExchange(intArray, 0, 10, 20);

console.log(oldValue); // 输出：10
console.log(intArray[0]); // 输出：20

在这里，我们使用 Atomics.compareExchange()。这个操作检查索引 0 的值是否为 10，如果是，它将其替换为 20。这在你只想在程序的其他部分没有更改值时更新它时很有用。

示例 3：等待和通知

const buffer = new SharedArrayBuffer(4);
const intArray = new Int32Array(buffer);

// 在代码的一个部分（例如，工作线程）
Atomics.wait(intArray, 0, 0);

// 在另一个部分（例如，主线程）
intArray[0] = 1;
Atomics.notify(intArray, 0, 1);

这个示例演示了如何使用 Atomics.wait() 和 Atomics.notify() 在程序的不同部分之间进行协调。一个部分等待值的变化，而另一个部分进行变化并发出通知。

结论

恭喜你！你已经迈出了进入JavaScript中原子对象世界的第一步。这些工具现在可能看起来有些抽象，但它们对于构建高效的多线程应用程序非常强大。

记住，编程就像学习一门新语言。它需要时间和实践，但随着你学习每个新概念，你都在打开一个充满可能性的世界。继续尝试，继续提问，最重要的是，享受这个过程！

在我多年的教学过程中，我见证了无数学生从完全的初学者成长为自信的程序员。你现在就在这样的激动人心的旅程上。所以，去吧，尝试这些示例，调整它们，看看会发生什么。这就是真正的学习过程！

下次见，快乐编码！

Credits: Image by storyset