recursal/MDN huggingface dataset:
Array[@@species]
================

**`Array[@@species]`** 정적 접근자 속성은 배열 메서드에서 반환 값을 구성하는 데 사용되는 생성자를 반환합니다.

**경고:** `@@species`가 존재하면 임의 코드가 실행될 수 있어 보안 취약점이 발생할 수 있습니다. 또한 특정 최적화를 훨씬 더 어렵게 만듭니다. 엔진 구현자는 이 기능을 제거할지 검토하고 있습니다. 가능하면 이 기능에 의존하지 마십시오. `toReversed()`와 같은 최신 배열 메서드는 `@@species`를 사용하지 않으며, 항상 새 `Array` 기반 클래스 인스턴스를 반환합니다.

구문
--


```js
Array[Symbol.species]
```

### 반환 값

`get @@species`가 호출된 생성자(`this`)의 값입니다. 반환값은 새 배열을 생성하는 배열 메서드에서 반환값을 구성하는 데 사용됩니다.

설명
--

`@@species` 접근자 속성은 `Array` 객체에 대한 기본 생성자를 반환합니다. 하위 클래스 생성자가 이를 재정의하여 생성자 할당을 변경할 수 있습니다. 기본 구현은 기본적으로 다음과 같습니다.


```js
// 설명을 위한 가상의 내부 구현
class Array {
  static get [Symbol.species]() {
    return this;
  }
}
```


이 다형성 구현으로 인해 파생된 하위 클래스의 `@@species`도 기본적으로 생성자 자체를 반환합니다.


```js
class SubArray extends Array {}
SubArray[Symbol.species] === SubArray; // true
```


기존 배열을 변경하지 않고 새 배열 인스턴스를 반환하는 배열 메서드(예: `filter()`, `map()`)를 호출하면, 배열의 `constructor[@@species]`에 접근합니다. 반환된 생성자는 배열 메서드의 반환값을 구성하는 데 사용됩니다. 이렇게 하면 배열 메서드가 배열과 관련이 없는 객체를 반환하도록 만드는 것이 기술적으로 가능합니다.


```js
class NotAnArray {
  constructor(length) {
    this.length = length;
  }
}

const arr = [0, 1, 2];
arr.constructor = { [Symbol.species]: NotAnArray };
arr.map((i) => i); // NotAnArray { '0': 0, '1': 1, '2': 2, length: 3 }
arr.filter((i) => i); // NotAnArray { '0': 1, '1': 2, length: 0 }
arr.concat([1, 2]); // NotAnArray { '0': 0, '1': 1, '2': 2, '3': 1, '4': 2, length: 5 }
```

예제
--

### 일반 객체의 species

`@@species` 속성은 기본 생성자 함수, 즉 `Array`의 `Array` 생성자를 반환합니다.


```js
Array[Symbol.species]; // [Function: Array]
```

### 파생 객체의 species

`MyArray`와 같은 사용자 정의 `Array`의 하위 클래스의 인스턴스에서, `MyArray`의 species는 `MyArray` 생성자입니다. 그러나 파생 클래스 메서드에서 부모 `Array` 객체를 반환하려면 이를 덮어쓰는 것이 좋습니다:


```js
class MyArray extends Array {
  // MyArray species를 부모 Array 생성자로 재설정
  static get [Symbol.species]() {
    return Array;
  }
}
```

명세서
---

| Specification |
| --- |
| ECMAScript Language Specification # sec-get-array-@@species |

브라우저 호환성
--------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

같이 보기
-----

* `Array[@@species]` 폴리필과 `core-js`의 영향을 받는 모든 `Array` 메서드에서의 `@@species` 지원
* 인덱스된 컬렉션
* `Array`
* `Symbol.species` (en-US)
Array.prototype.keys()
======================

`Array` 인스턴스의 **`keys()`** 메서드는 배열의 각 인덱스에 대한 키를 포함하는 새로운 배열 반복자 (en-US) 객체를 반환합니다.

시도해보기
-----

구문
--


```js
keys()
```

### 매개변수

없음.

### 반환 값

새로운 순회 가능 반복자 객체 (en-US)

설명
--

희소 배열에 사용되는 경우, `keys()` 메서드는 빈 슬롯의 값이 `undefined`인 것처럼 반복합니다.

`key()` 메서드는 범용 메서드입니다. `this` 값에는 `length` 속성과 정수 키 속성만 있을 것으로 예상됩니다.

예제
--

### 희소 배열에 keys() 사용하기

배열에 실제로 존재하는 키만 포함하는 `Object.keys()`와 달리, `keys()` 반복자는 누락된 속성을 나타내는 빈 공간을 무시하지 않습니다.


```js
const arr = ["a", , "c"];
const sparseKeys = Object.keys(arr);
const denseKeys = [...arr.keys()];
console.log(sparseKeys); // ['0', '2']
console.log(denseKeys); // [0, 1, 2]
```

### 배열이 아닌 객체에 keys() 호출하기

`keys()` 메서드는 `this`의 `length` 속성을 읽은 다음, 0과 `length - 1` 사이의 모든 정수 인덱스를 산출합니다. 실제 인덱스 접근은 발생하지 않습니다.


```js
const arrayLike = {
  length: 3,
};
for (const entry of Array.prototype.keys.call(arrayLike)) {
  console.log(entry);
}
// 0
// 1
// 2
```

명세서
---

| Specification |
| --- |
| ECMAScript Language Specification # sec-array.prototype.keys |

브라우저 호환성
--------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

같이 보기
-----

* `core-js`의 `Array.prototype.keys` 폴리필
* 인덱스 기반 컬렉션 안내서
* `Array`
* `Array.prototype.entries()`
* `Array.prototype.values()`
* `Array.prototype[@@iterator]()`
* `TypedArray.prototype.keys()`
* 순회 프로토콜
Array.prototype.reverse()
=========================

**`reverse()`** 메서드는 배열의 순서를 반전합니다. 첫 번째 요소는 마지막 요소가 되며 마지막 요소는 첫 번째 요소가 됩니다.

시도해보기
-----

구문
--


```js
a.reverse();
```

### 반환 값

순서가 반전된 배열.

설명
--

`reverse` 메서드는 호출한 배열을 반전하고 원본 배열을 변형하며 그 참조를 반환합니다.

예시
--

### 배열의 요소를 반전하기

다음 예시는 3개의 요소가 든 myArray 배열을 만든 후, 반전시킵니다.


```js
const a = [1, 2, 3];
console.log(a); // [1, 2, 3]

a.reverse();
console.log(a); // [3, 2, 1]
```

명세
--

| Specification |
| --- |
| ECMAScript Language Specification # sec-array.prototype.reverse |

브라우저 호환성
--------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

같이 보기
-----

* `Array.prototype.join()`
* `Array.prototype.sort()`
* `TypedArray.prototype.reverse()`
Array.prototype[@@iterator]()
=============================

`Array` 인스턴스의 **`[@@iterator]()`** 메서드는 순회 가능 프로토콜을 구현하며, 배열을 전개 구문이나 `for...of` 루프와 같이 순회 가능을 기대하는 대부분의 구문에서 사용할 수 있도록 합니다. 이 메서드는 배열의 각 인덱스 값을 산출하는 배열 순회자 객체 (en-US)를 반환합니다.

이 속성의 초기 값은 `Array.prototype.values` 속성의 초기 값과 동일한 함수 객체입니다.

시도해보기
-----

구문
--


```js
array[Symbol.iterator]()
```

### 매개변수

없음.

### 반환 값

`Array.prototype.values()`와 동일한 반환 값입니다. 이는 배열의 각 인덱스의 값을 산출하는 새로운 순회 가능 순회자 객체 (en-US)입니다.

예제
--

### for...of 루프를 사용한 순회

이 메서드를 직접 호출할 필요는 거의 없습니다. `@@iterator` 메서드가 있으면 배열을 순회 가능으로 만들 수 있으며, `for...of` 루프와 같은 순회 구문은 이 메서드를 자동으로 호출하여 반복할 순회자를 얻습니다.

#### HTML


```html
<ul id="letterResult"></ul>
```


#### JavaScript


```js
const arr = ["a", "b", "c"];
const letterResult = document.getElementById("letterResult");
for (const letter of arr) {
  const li = document.createElement("li");
  li.textContent = letter;
  letterResult.appendChild(li);
}
```


#### 결과

### 순회자를 수동으로 부르기

반환된 순회자 객체의 `next` 메서드를 수동으로 호출하여 순회 과정을 최대한 제어할 수 있습니다.


```js
const arr = ["a", "b", "c", "d", "e"];
const arrIter = arr[Symbol.iterator]();
console.log(arrIter.next().value); // a
console.log(arrIter.next().value); // b
console.log(arrIter.next().value); // c
console.log(arrIter.next().value); // d
console.log(arrIter.next().value); // e
```

### 동일한 함수로 문자열과 문자열 배열 처리하기

문자열 (en-US)과 배열은 모두 순회 가능 프로토콜을 구현하기 때문에, 범용 함수는 두 입력을 동일한 방식으로 처리하도록 설계할 수 있습니다. 이는 입력이 배열이거나 적어도 해당 메서드가 있는 객체여야 하는 `Array.prototype.values()`를 직접 호출하는 것보다 낫습니다.


```js
function logIterable(it) {
  if (typeof it[Symbol.iterator] !== "function") {
    console.log(it, "is not iterable.");
    return;
  }
  for (const letter of it) {
    console.log(letter);
  }
}

// Array
logIterable(["a", "b", "c"]);
// a
// b
// c

// String
logIterable("abc");
// a
// b
// c

// Number
logIterable(123);
// 123은 순회 가능이 아닙니다.
```

명세서
---

| Specification |
| --- |
| ECMAScript Language Specification # sec-array.prototype-@@iterator |

브라우저 호환성
--------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

같이 보기
-----

* `core-js`의 `Array.prototype[@@iterator]` 폴리필
* 인덱스된 컬렉션
* `Array`
* `Array.prototype.keys()`
* `Array.prototype.entries()`
* `Array.prototype.values()`
* `TypedArray.prototype[@@iterator]()`
* `String.prototype[@@iterator]()`
* `Symbol.iterator`
* 순회 프로토콜
Array.prototype.push()
======================

**`push()`** 메서드는 배열의 끝에 하나 이상의 요소를 추가하고, 배열의 새로운 길이를 반환합니다.

시도해보기
-----

구문
--


```js
    arr.push(element1[, ...[, elementN]])
```

### 매개변수

`elementN`

배열의 끝에 추가할 요소.

### 반환 값

호출한 배열의 새로운 `length` 속성.

설명
--

`push` 메서드는 배열 끝에 여러 값을 추가합니다.

`push`는 의도적으로 제네릭합니다. 배열을 닯은 객체에 `call()` 또는 `apply()`로 사용될 수 있다. `push` 메서드는 주어진 값을 입력하는 것을 어디에 시작할 것인지를 결정하기 위해 `length` 속성에 의존한다. 만약 `length` 속성이 숫자로 변환 될 수 없다면 인덱스는 0을 사용한다. `length` 가 생성되게 될 경우에 길이 값이 존재하지 않을 가능성을 포함한다.

String(문자열)이 변경할 수 없는 것처럼 비록 이 명령어의 어플리케이션들이 적합하지 않다고 할지라도 단지 원래 배열 같은 객체는 strings이다.

예시
--

### 배열에 엘리먼트를 추가 하기

다음 코드는 두가지 엘리먼트를 포함하는 스포츠 배열을 생성하고 두개의 엘리먼트를 추가 한다. `total` 변수는 추가한 배열의 새 길이 값을 포함한다.


```js
var sports = ["축구", "야구"];
var total = sports.push("미식축구", "수영");

console.log(sports); // ['축구', '야구', '미식축구', '수영']
console.log(total); // 4
```

### 두개의 배열을 합치기

이 예제는 두번째 배열의 모든 엘리먼트를 push 하기 위해 `apply()`를 사용한다.

만약 두번째 배열( 아래 예제에서는 moreVegs )이 매우 클 경우, 이 메소드를 사용하지 말아야 한다. 실제로 한 함수가 사용가능한 매개변수의 최대 개수에는 제한이 있기 때문이다. 더 자세한 사항은 `apply()` 에서 찾아볼 수 있다.


```js
var vegetables = ["설탕당근", "감자"];
var moreVegs = ["셀러리", "홍당무"];

// 첫번째 배열에 두번째 배열을 합친다.
// vegetables.push('셀러리', '홍당무'); 하는 것과 동일하다.
Array.prototype.push.apply(vegetables, moreVegs);

console.log(vegetables); // ['설탕당근', '감자', '셀러리', '홍당무']
```

명세
--

| Specification |
| --- |
| ECMAScript Language Specification # sec-array.prototype.push |

브라우저 호환성
--------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

같이 보기
-----

* `Array.prototype.pop()`
* `Array.prototype.shift()`
* `Array.prototype.unshift()`
* `Array.prototype.concat()`
Array.prototype.with()
======================

`Array` 인스턴스의 **`with()`** 메서드는 주어진 인덱스의 값을 변경하기 위해 대괄호 표기법을 사용하는 것의 복사 버전입니다. 이 함수는 지정된 인덱스의 요소가 지정된 값으로 대체된 새 배열을 반환합니다.

구문
--


```js
array.with(index, value)
```

### 매개변수

`index`

배열을 변경할 0 기반 인덱스이며 정수로 변환되는 값입니다.

* 음수 인덱스는 배열의 끝부터 역산합니다 — `index < 0`인 경우 `index + array.length`가 사용됩니다.
* 정규화 후 인덱스가 범위를 벗어나면, `RangeError`가 발생합니다.

`value`

주어진 인덱스에 할당할 값입니다.

### 반환 값

`index`의 요소 값이 `value`로 대체된 새로운 배열.

### 예외

`RangeError`

`index > array.length` 혹은 `index < -array.length` 일때 발생합니다.

설명
--

`with()` 메서드는 배열에서 주어진 인덱스의 값을 변경하여, 주어진 인덱스에 있는 요소가 주어진 값으로 대체된 새 배열을 반환합니다. 원래 배열은 수정되지 않습니다. 이를 통해 조작을 수행하는 동안 배열 메서드를 연속으로 이어서 호출 할 수 있습니다.

`with()` 메서드는 희소 배열을 생성하지 않습니다. 만약 원래 배열이 희소 배열인 경우 빈 슬롯은 새로운 배열에서 `undefined`으로 대체됩니다.

`with()` 메서드는 제네릭 메서드입니다. 이 메서드는 `this` 값에 `length` 속성과 정수 키 속성 만을 필요로 합니다.

예제
--

### 하나의 요소만 변경한채로 새로운 배열을 만들기


```js
const arr = [1, 2, 3, 4, 5];
console.log(arr.with(2, 6)); // [1, 2, 6, 4, 5]
console.log(arr); // [1, 2, 3, 4, 5]
```

### 배열 메서드 연속하여 연결하기

`with()` 메서드를 사용하면 배열의 단일 요소를 업데이트한 후 다른 배열 메서드를 적용할 수 있습니다.


```js
const arr = [1, 2, 3, 4, 5];
console.log(arr.with(2, 6).map((x) => x \*\* 2)); // [1, 4, 36, 16, 25]
```

### 희소 배열에서 with() 사용하기

`with()` 메서드는 언제나 밀집 배열을 생성합니다.


```js
const arr = [1, , 3, 4, , 6];
console.log(arr.with(0, 2)); // [2, undefined, 3, 4, undefined, 6]
```

### 배열이 아닌 객체에서 with() 호출하기

`with()` 메서드는 `this`의 `length` 속성을 읽습니다. 그리고 `this`의 정수 키 속성을 읽어서 새 배열에 쓰고,
 `value`는 주어진 `index`에 씁니다.


```js
const arrayLike = {
  length: 3,
  unrelated: "foo",
  0: 5,
  2: 4,
};
console.log(Array.prototype.with.call(arrayLike, 0, 1));
// [ 1, undefined, 4 ]
```

명세서
---

| Specification |
| --- |
| ECMAScript Language Specification # sec-array.prototype.with |

브라우저 호환성
--------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

같이 보기
-----

* Polyfill of `Array.prototype.with` in `core-js`
* `Array.prototype.toReversed()`
* `Array.prototype.toSorted()`
* `Array.prototype.toSpliced()`
* `TypedArray.prototype.with()` (en-US)
Array.of()
==========

**`Array.of()`** 메서드는 인자의 수나 유형에 관계없이 가변 인자를 갖는 새 `Array` 인스턴스를 만듭니다.

`Array.of()`와 `Array` 생성자의 차이는 정수형 인자의 처리 방법에 있습니다. `Array.of(7)`은 하나의 요소 `7`을 가진 배열을 생성하지만 `Array(7)`은 `length` 속성이 7인 빈 배열을 생성합니다.


```js
Array.of(7); // [7]
Array.of(1, 2, 3); // [1, 2, 3]

Array(7); // [ , , , , , , ]
Array(1, 2, 3); // [1, 2, 3]
```

구문
--


```js
    Array.of(element0[, element1[, ...[, elementN]]])
```

### 매개변수

`elementN`

배열을 생성할 때 사용할 요소.

### 반환 값

새로운 `Array` 객체.

설명
--

이 함수는 ECMAScript 2015 표준 일부입니다. 자세한 정보는 `Array.of`, `Array.from` 제안 사항과 `Array.of` 폴리필에서 확인하실 수 있습니다.

예제
--


```js
Array.of(1); // [1]
Array.of(1, 2, 3); // [1, 2, 3]
Array.of(undefined); // [undefined]
```

폴리필
---

아래 코드를 다른 코드 이전에 포함하면 `Array.of`를 지원하지 않는 환경에서도 사용할 수 있습니다.


```js
if (!Array.of) {
  Array.of = function () {
    return Array.prototype.slice.call(arguments);
  };
}
```

명세
--

| Specification |
| --- |
| ECMAScript Language Specification # sec-array.of |

브라우저 호환성
--------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

같이 보기
-----

* `Array`
* `Array.from()`
* `TypedArray.of()`
Array.prototype.includes()
==========================

`Array` 인스턴스의 **`includes()`** 메서드는 배열의 항목에 특정 값이 포함되어 있는지를 판단하여 적절히 `true` 또는 `false`를 반환합니다.

시도해보기
-----

구문
--


```js
includes(searchElement)
includes(searchElement, fromIndex)
```

### 매개변수

`searchElement`

찾을 값입니다.

`fromIndex` Optional

검색을 시작할 0 기반 인덱스로, 정수로 변환됩니다.

* 음수 인덱스는 배열의 끝부터 거꾸로 셉니다. 즉, `fromIndex < 0`이면, `fromIndex + array.length`가 사용됩니다. 그러나, 이 경우에도 배열은 여전히 앞에서 뒤로 검색됩니다.
* `fromIndex < -array.length`이거나 `fromIndex`가 생략되면, `0`이 사용되어 전체 배열이 검색됩니다.
* `fromIndex >= array.length` 이면, 배열은 검색되지 않고 `false`가 반환됩니다.

### 반환 값

배열(또는 `fromIndex`를 지정했다면, `fromIndex` 인덱스로 표시된 배열의 일부) 내에서 `searchElement` 값이 발견되면 `true` 불리언 값이 반환됩니다.

설명
--

`includes()` 메서드는 SameValueZero 알고리즘을 사용하여 `searchElement`를 배열의 요소와 비교합니다. 0 값은 부호에 관계없이 모두 동일한 것으로 간주됩니다. (즉, `-0`은 `0`과 같지만), `false`는 `0`과 같은 것으로 간주되지 않습니다. `NaN`은 올바르게 검색될 수 있습니다.

희소 배열에 사용할 경우, `include()` 메서드는 빈 슬롯을 `undefined`로 간주하고 순회합니다.

`includes()` 메서드는 범용입니다. `this` 값에는 `length` 속성과 정수 키 속성만 있을 것으로 예상합니다.

예제
--

### includes() 사용하기


```js
[1, 2, 3].includes(2); // true
[1, 2, 3].includes(4); // false
[1, 2, 3].includes(3, 3); // false
[1, 2, 3].includes(3, -1); // true
[1, 2, NaN].includes(NaN); // true
["1", "2", "3"].includes(3); // false
```

### fromIndex가 배열 길이보다 크거나 같은 경우

`fromIndex`가 배열의 길이보다 크거나 같으면 `false`가 반환됩니다. 배열은 검색되지 않습니다.


```js
const arr = ["a", "b", "c"];

arr.includes("c", 3); // false
arr.includes("c", 100); // false
```

### 0보다 작은 인덱스 계산

`fromIndex`가 음수라면, 계산된 인덱스가 `searchElement` 검색을 시작할 배열의 위치로 사용되도록 계산됩니다.
 계산된 인덱스가 `0`보다 작거나 같으면 전체 배열에서 검색됩니다.


```js
// 배열 길이는 3
// fromIndex는 -100
// 계산된 인덱스는 3 + (-100) = -97

const arr = ["a", "b", "c"];

arr.includes("a", -100); // true
arr.includes("b", -100); // true
arr.includes("c", -100); // true
arr.includes("a", -2); // false
```

### 희소 배열에서 includes() 사용하기

희소 배열에서 `undefined`를 검색하면 `true`를 얻을 수 있습니다.


```js
console.log([1, , 3].includes(undefined)); // true
```

### 배열이 아닌 객체에서 includes() 호출하기

`includes()` 메서드는 `this`의 `length` 속성을 읽은 다음 키가 `length`보다 작은 음수가 아닌 정수인 각 속성에 접근합니다.


```js
const arrayLike = {
  length: 3,
  0: 2,
  1: 3,
  2: 4,
  3: 1, // length가 3이므로 includes()에서 무시됩니다.
};
console.log(Array.prototype.includes.call(arrayLike, 2));
// true
console.log(Array.prototype.includes.call(arrayLike, 1));
// false
```

명세서
---

| Specification |
| --- |
| ECMAScript Language Specification # sec-array.prototype.includes |

브라우저 호환성
--------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

같이 보기
-----

* `core-js`의 `Array.prototype.includes` 폴리필
* 인덱스 기반 컬렉션 안내서
* `Array`
* `Array.prototype.indexOf()`
* `Array.prototype.find()`
* `Array.prototype.findIndex()`
* `TypedArray.prototype.includes()` (en-US)
* `String.prototype.includes()`
Array.prototype.shift()
=======================

**`shift()`** 메서드는 배열에서 첫 번째 요소를 제거하고, 제거된 요소를 반환합니다. 이 메서드는 배열의 길이를 변하게 합니다.

시도해보기
-----

구문
--


```js
arr.shift();
```

### 반환 값

배열에서 제거한 요소. 빈 배열의 경우 `undefined` 를 반환합니다.

설명
--

`shift` 메서드는 0번째 위치의 요소를 제거 하고 연이은 나머지 값들의 위치를 한칸 씩 앞으로 당깁니다. 그리고 제거된 값을 반환 합니다. 만약 배열의 `length`가 0이라면 `undefined`를 리턴 합니다.

`shift`는 의도적인 일반형태로써; 이 메서드는 배열과 유사한 형태의 객체에서 호출 하거나 적용 할 수 있습니다. 연속된 일련의 마지막 항목을 나타내는 길이 속성을 가지고 있지 않은 객체의 제로베이스 수치 속성에는 의미 있는 작동을 하지 않을 수 있습니다. (*Objects which do not contain a `length` property reflecting the last in a series of consecutive, zero-based numerical properties may not behave in any meaningful manner*.)

예제
--

### 배열에서 한 요소 제거하기

아래 코드는 `myFish` 라는 배열에서 첫번째 요소를 제거 하기 전과 후를 보여 줍니다. 그리고 제거된 요소도 보여줍니다.


```js
var myFish = ["angel", "clown", "mandarin", "surgeon"];

console.log("myFish before: " + myFish);
// "제거전 myFish 배열: angel,clown,mandarin,surgeon"

var shifted = myFish.shift();

console.log("myFish after: " + myFish);
// "제거후 myFish 배열: clown,mandarin,surgeon"

console.log("Removed this element: " + shifted);
// "제거된 배열 요소: angel"
```

### while 반복문 안에서 shift() 사용하기

shift() 메서드는 while 문의 조건으로 사용되기도 합니다. 아래 코드에서는 while 문을 한번 돌 때 마다 배열의 다음 요소를 제거하고, 이는 빈 배열이 될 때까지 반복됩니다.


```js
var names = ["Andrew", "Edward", "Paul", "Chris", "John"];

while ((i = names.shift()) !== undefined) {
  console.log(i);
}
// Andrew, Edward, Paul, Chris, John
```

명세
--

| Specification |
| --- |
| ECMAScript Language Specification # sec-array.prototype.shift |

브라우저 호환성
--------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

같이 보기
-----

* `Array.prototype.push()`
* `Array.prototype.pop()`
* `Array.prototype.unshift()`
WeakMap.prototype.delete()
==========================

**`delete()`** 메서드는 `WeakMap` 객체에서 특정 요소를 제거합니다.

시도해보기
-----

구문
--


```js
delete key;
```

### 매개변수

`key`

`WeakMap` 객체에서 제거할 요소의 키입니다.

### 반환 값

`WeakMap` 겍체의 요소가 성공적으로 제거된 경우 `true`입니다. `WeakMap`에서 키를 찾을 수 없거나 키가 객체가 아닌 경우는 `false`입니다.

예제
--

### delete() 메서드 사용하기


```js
const wm = new WeakMap();
wm.set(window, "foo");

wm.delete(window); // true 반환. 성공적으로 제거됨.

wm.has(window); // false 반환. window 객체는 더이상 WeakMap에 있지않음.
```

명세
--

| Specification |
| --- |
| ECMAScript Language Specification # sec-weakmap.prototype.delete |

브라우저 호환성
--------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

같이 보기
-----

* `WeakMap`
WeakMap.prototype.get()
=======================

**`get()`** 메서드는 `WeakMap` 객체에서 특정 요소를 반환합니다.

시도해보기
-----

구문
--


```js
get(key);
```

### 매개변수

`key`

필수로 요구되며,`WeakMap` 객체에서 반환할 요소의 키입니다.

### 반환 값

`WeakMap` 객체의 특정 키와 연결된 요소입니다. 키를 찾을 수 없으면 `undefined`가 반환됩니다.

예제
--

### get() 메서드 사용하기


```js
const wm = new WeakMap();
wm.set(window, "foo");

wm.get(window); // "foo" 반환.
wm.get("baz"); // undefined 반환.
```

명세서
---

| Specification |
| --- |
| ECMAScript Language Specification # sec-weakmap.prototype.get |

브라우저 호환성
--------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

같이 보기
-----

* `WeakMap`
* `WeakMap.set()`
* `WeakMap.has()`
WeakMap.prototype.has()
=======================

**`has()`** 메서드는 지정된 키를 가진 요소가 `WeakMap` 객체에 존재하는지를 나타내는 불리언 값을 반환합니다.

시도해보기
-----

구문
--


```js
has(key);
```

### 매개변수

`key`

필수로 요구되며, `WeakMap` 객체에서 존재 여부를 테스트할 요소의 키입니다.

### 반환 값

불리언

`WeakMap` 객체에 지정된 키를 가진 요소가 있으면 `true`를 반환하고, 그렇지 않으면 `false`를 반환합니다.

예제
--

### has 메서드 사용하기


```js
const wm = new WeakMap();
wm.set(window, "foo");

wm.has(window); // true 반환
wm.has("baz"); // false 반환
```

명세서
---

| Specification |
| --- |
| ECMAScript Language Specification # sec-weakmap.prototype.has |

브라우저 호환성
--------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

같이 보기
-----

* `WeakMap`
* `WeakMap.prototype.set()`
* `WeakMap.prototype.get()`
WeakMap.prototype.set()
=======================

**`set()`** 메서드는 지정된 키와 값을 가진 새 요소를 `WeakMap` 객체에 추가합니다.

시도해보기
-----

구문
--


```js
set(key, value);
```

### 매개변수

`key`

필수로 요구되며, 반드시 `object`여야 합니다. `WeakMap` 객체에 추가할 요소의 키입니다.

`value`

필수로 요구되며, 임의의 값입니다. `WeakMap` 객체에 추가할 요소의 값입니다.

### 반환 값

`WeakMap` 객체입니다.

예제
--

### set() 메서드 사용하기


```js
const wm = new WeakMap();
const obj = {};

// WeakMap에 새 요소를 추가합니다
wm.set(obj, "foo").set(window, "bar"); // 체인가능

// WeakMap 요소 업데이트
wm.set(obj, "baz");
```

명세서
---

| Specification |
| --- |
| ECMAScript Language Specification # sec-weakmap.prototype.set |

브라우저 호환성
--------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

같이보기
----

* `WeakMap`
* `WeakMap.prototype.get()`
* `WeakMap.prototype.has()`
BigInt() 생성자
============

Baseline Widely available
-------------------------

This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2020.

* Learn more
* See full compatibility
* Report feedback
**`BigInt()`** 생성자는 `BigInt` 객체를 생성합니다.

구분
--


```js
BigInt(value);
```

### 매개변수

`value`

생성하는 객체에 할당할 숫자 값. 문자열 또는 정수를 사용할 수 있습니다.


**참고:** `BigInt()`는 `new` 연산자와 함께 사용하지 않습니다.

예제
--


```js
BigInt(123);
// 123n
```

명세
--

| Specification |
| --- |
| ECMAScript Language Specification # sec-bigint-constructor |

브라우저 호환성
--------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

같이 보기
-----

* `BigInt` 클래스
Atomics.load()
==============

**`Atomics.load()`** 정적 메서드는 배열의 지정된 위치의 값을 반환합니다.

시도해보기
-----

구문
--


```js
Atomics.load(typedArray, index)
```

### 매개 변수

`typedArray`

 정수형 형식화 배열. `Int8Array`, `Uint8Array`,
 `Int16Array`, `Uint16Array`, `Int32Array`,
 `Uint32Array`, `BigInt64Array`,
 `BigUint64Array` 중 하나.


`index`

값을 불러올 `typedArray`의 인덱스

### 반환 값

주어진 위치(`typedArray[index]`)의 예전 값.

### 예외

* `typedArray`가 허용된 정수형이 아닐 경우 `TypeError`가 발생합니다.
* `index`가 `typedArray`의 범위를 벗어날 경우 `RangeError`가 발생합니다.
예제
--

### `load` 사용하기


```js
const sab = new SharedArrayBuffer(1024);
const ta = new Uint8Array(sab);

Atomics.add(ta, 0, 12);
Atomics.load(ta, 0); // 12
```

명세서
---

| Specification |
| --- |
| ECMAScript Language Specification # sec-atomics.load |

브라우저 호환성
--------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

같이 보기
-----

* `Atomics`
* `Atomics.store()`
Atomics.notify()
================

**`Atomics.notify()`** 정적 메서드는 대기열에서 대기 중인 있는 일부 에이전트에게 알림을 보냅니다.

> 
> 
> **참조:** 이 작업은 공유된 `Int32Array`에서만 작동합니다.
>  공유되지 않은 `ArrayBuffer` 객체에서는 `0`을 반환합니다.
>  
> 
> 
> 

구문
--


```js
Atomics.notify(typedArray, index, count)
```

### 매개변수

`typedArray`

공유된 `Int32Array`.

`index`

깨울 `typedArray`의 위치.

`count` Optional

알림을 보낼 대기 중 에이전트의 숫자. 기본 값은 `+Infinity`입니다.

### 반환 값

* 깨어난 에이전트의 숫자를 반환합니다.
* 공유되지 않은 `ArrayBuffer` 객체가 사용되었을 경우 `0`을 반환합니다.
### 예외

* `typedArray`가 허용된 정수형이 아닐 경우 `TypeError`가 발생합니다.
* `index`가 `typedArray`의 범위를 벗어날 경우 `RangeError`가 발생합니다.
예제
--

### `notify` 사용하기

공유된 `Int32Array`에서


```js
const sab = new SharedArrayBuffer(1024);
const int32 = new Int32Array(sab);
```


 읽기 스레드는 0이 될 것으로 예상되는 위치 0에서 대기 중입니다. 이 상태가 유지되는 한 계속 진행되지 않습니다.
 그러나 쓰기 스레드가 새 값을 저장하면 쓰기 스레드에서 알림을 받고 새 값(123)을 반환합니다.


```js
Atomics.wait(int32, 0, 0);
console.log(int32[0]); // 123
```


쓰기 스레드는 새로운 값을 저장하고 쓰기가 완료되면 대기 중인 스레드에 알립니다.


```js
console.log(int32[0]); // 0;
Atomics.store(int32, 0, 123);
Atomics.notify(int32, 0, 1);
```

명세서
---

| Specification |
| --- |
| ECMAScript Language Specification # sec-atomics.notify |

브라우저 호환성
--------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

같이 보기
-----

* `Atomics`
* `Atomics.wait()`
Atomics.isLockFree()
====================

**`Atomics.isLockFree()`** 정적 메서드는 지정된 요소 바이트 크기를 가진 유형화 배열에 적용될 때
 `Atomics` 메서드가 잠금을 사용할지 아니면 아토믹 하드웨어 연산을 사용할지 결정하는 데 사용됩니다.
 주어진 크기가 정수 타입의 형식화 배열의 BYTES\_PER\_ELEMENT
 속성 중 하나가 아닌 경우 `false`를 반환합니다.

시도해보기
-----

구문
--


```js
Atomics.isLockFree(size)
```

### 매개변수

`size`

검사할 바이트 크기

### 반환 값

해당 연산이 락이 걸렸는지 여부를 가리키는 `true` 혹은 `false` 값

예제
--

### isLockFree 사용하기


```js
Atomics.isLockFree(1); // true
Atomics.isLockFree(2); // true
Atomics.isLockFree(3); // false
Atomics.isLockFree(4); // true
Atomics.isLockFree(5); // false
Atomics.isLockFree(6); // false
Atomics.isLockFree(7); // false
Atomics.isLockFree(8); // true
```

명세서
---

| Specification |
| --- |
| ECMAScript Language Specification # sec-atomics.islockfree |

브라우저 호환성
--------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

같이 보기
-----

* `Atomics`
Atomics.add()
=============

**`Atomics.add()`** 정적 메서드는 배열의 지정된 위치에 지정된 값을 추가하고 해당 위치의 이전 값을 반환합니다.
 이 아토믹 연산은 수정된 값 쓰기가 완료되기 전까지 다른 쓰기가 발생하지 않도록 보장합니다.

시도해보기
-----

구문
--


```js
Atomics.add(typedArray, index, value)
```

### 매개변수

`typedArray`

 정수형 배열. `Int8Array`, `Uint8Array`,
 `Int16Array`, `Uint16Array`, `Int32Array`,
 `Uint32Array`, `BigInt64Array`,
 `BigUint64Array` 중 하나.


`index`

`value`를 더할 `typedArray`내의 위치.

`value`

더할 숫자.

### 반환 값

주어진 위치의 예전 값(`typedArray[index]`).

### 예외

* `typedArray`가 허용된 정수형이 아닐 경우 `TypeError`가 발생합니다.
* `index`가 `typedArray`의 범위를 벗어날 경우 `RangeError`가 발생합니다.
예제
--

### add() 사용하기


```js
const sab = new SharedArrayBuffer(1024);
const ta = new Uint8Array(sab);

Atomics.add(ta, 0, 12); // 예전 값인 0을 반환합니다.
Atomics.load(ta, 0); // 12
```

명세서
---

| Specification |
| --- |
| ECMAScript Language Specification # sec-atomics.add |

브라우저 호환성
--------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

같이 보기
-----

* `Atomics`
* `Atomics.sub()`