JavaScript Atomics.store() 함수 완벽 정리

JavaScript의 Atomics 객체는 add(더하기), sub(빼기), and, or, xor, load(읽기), store(쓰기) 등 다양한 원자적(atomic) 연산을 정적 메서드 형태로 제공하는 내장 객체입니다. 이러한 메서드들은 SharedArrayBuffer 객체와 함께 사용되며, 여러 스레드가 공유 메모리에 동시에 접근할 때 발생할 수 있는 데이터 경합(race condition) 문제를 방지해 줍니다.

그중 store() 함수는 배열 내 특정 위치(인덱스)와 저장할 숫자 값을 인자로 받아, 지정된 위치에 해당 값을 원자적으로 저장한 후 저장된 값을 그대로 반환합니다.

문법(Syntax)

Atomics.store(typedArray, index, value)

매개변수

typedArray: 값을 저장할 Int8Array, Uint8Array 등 SharedArrayBuffer 기반의 타입 배열(TypedArray)
index: 값을 저장할 배열 내 위치(인덱스)
value: 저장할 숫자 값

반환값

지정한 위치에 성공적으로 저장된 값을 반환합니다.

예제 1: 특정 위치에 값 저장하기

아래 예제에서는 SharedArrayBuffer를 생성한 뒤 Uint8Array로 감싸고, 첫 번째 요소에 20을 할당한 후 Atomics.store()를 사용해 같은 위치에 30을 저장합니다. 이후 Atomics.load()로 값을 읽어 화면에 출력합니다.

<html>
<head>
   <title>JavaScript Example</title>
</head>
<body>
   <script type="text/javascript">
      var arrayBuffer = new SharedArrayBuffer(16);
      var data = new Uint8Array(arrayBuffer);
      data[0] = 20;
      Atomics.store(data, 0, 30);
      document.write(Atomics.load(data, 0));
   </script>
</body>
</html>

출력 결과

첫 번째 요소가 20에서 30으로 변경된 것을 확인할 수 있습니다.

예제 2: 반환값 확인하기

store() 함수는 저장된 값을 반환하므로, 아래처럼 여러 위치에 값을 저장하면서 각 호출의 반환값을 바로 출력할 수도 있습니다.

<html>
<head>
   <title>JavaScript Example</title>
</head>
<body>
   <script type="text/javascript">
      var arrayBuffer = new SharedArrayBuffer(16);
      var data = new Uint8Array(arrayBuffer);
      document.write(Atomics.store(data, 0, 10));
      document.write("<br>");
      document.write(Atomics.store(data, 1, 20));
      document.write("<br>");
      document.write(Atomics.store(data, 2, 30));
      document.write("<br>");
      document.write(Atomics.store(data, 3, 40));
   </script>
</body>
</html>

출력 결과

각 호출마다 전달한 값이 해당 인덱스에 저장되고, 그 값이 그대로 반환되는 것을 확인할 수 있습니다.

정리

Atomics.store()는 공유 메모리 환경에서 안전하게 값을 쓰기(write)할 수 있도록 도와주는 함수입니다. 멀티스레드 환경에서 SharedArrayBuffer를 다룰 때 데이터 일관성을 보장해야 한다면, load()와 store()를 함께 활용하는 것이 좋습니다.