JavaScript - 原子操作對象

歡迎，有抱負的程式設計師們！今天，我們將深入探索JavaScript中的原子操作對象的迷人世界。別擔心如果你是程式設計的新手；我將成為你這次旅程中的友好導遊，一步步為你解釋一切。那麼，讓我們開始吧！

原子操作對象

原子操作對象在JavaScript中就像是一個特殊的工具箱，它幫助我們以安全和協調的方式操作共享內存。想像你和你的朋友們正在一起進行一個團隊專案，但你们分處不同的房間。原子操作對象就像一套規則，幫助你們相互通訊和合作，而不會相互干擾。

什麼是共享內存？

在我們深入探討之前，讓我們先了解什麼是共享內存。在程式設計中，共享內存就像是一塊白板，多個人（或者在我們的例子中，程序的多個部分）可以同時讀取和寫入。這可能非常有用，但如果管理不當，也可能會導致混淆。

"原子"的本質

現在，你可能會想，"為什麼叫做'原子'？" 在程式設計的世界中，"原子"並不意味著像化學中的微小粒子。相反，它意味著某件事發生得很快，沒有中斷。

想像你正在做三明治。如果這是一個原子操作，那麼它意味著你會一氣呵成地開始並完成三明治，而沒有其他人碰食材或打擾你。這就是程式設計中原子的本質！

原子操作

讓我們看看我們可以使用原子操作對象進行的一些操作。這些操作幫助我們安全且高效地操作共享內存。

原子操作的表格

操作	描述
add()	將給定的值加到數組特定位置的值上
and()	执行位運算AND操作
compareExchange()	比較數組中的值和給定的值，如果相同則替換
exchange()	將特定位置的值替換為新值
load()	讀取特定位置的值
or()	执行位運算OR操作
store()	在特定位置存儲值
sub()	從特定位置的值中減去一個值
xor()	执行位運算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