객체 지향 JavaScript — 생성기 및 지도

https://www.amazon.com/John-Au-Yeung/e/B08FT5NT62에서 Amazon에서 내 책을 확인하십시오.

지금 http://jauyeung.net/subscribe/에서 내 이메일 목록을 구독하십시오.

JavaScript는 부분적으로 객체 지향 언어입니다.

JavaScript를 배우려면 JavaScript의 객체 지향 부분을 배워야 합니다.

이 기사에서는 생성기와 맵을 살펴보겠습니다.

발전기

제너레이터 함수를 사용하면 제너레이터 객체를 생성할 수 있습니다.

한 줄씩 실행하고 yield 로 결과를 반환한 다음 다시 호출될 때까지 일시 중지합니다.

필요하지 않을 때 일시 중지되므로 무한 루프를 작성하는 데 사용할 수 있습니다.

예를 들어 다음과 같이 작성하여 생성기 함수를 만들 수 있습니다.

function* generatorFunc() {
  yield 1;
  yield 2;
  yield 3;
}

generatorFunc 생성기 함수가 있습니다.
function* 키워드로 표시됩니다.
yield 키워드를 사용하면 값을 반환하고 값을 일시 중지할 수 있습니다.

그런 다음 생성기를 만든 다음 next를 호출하여 사용할 수 있습니다.

const gen = generatorFunc();
console.log(gen.next());
console.log(gen.next());
console.log(gen.next());
console.log(gen.next());

그런 다음 우리는 다음을 얻습니다.

{value: 1, done: false}
{value: 2, done: false}
{value: 3, done: false}
{value: undefined, done: true}

next는 value 및 done 속성을 가진 객체를 반환합니다.
value에는 반환된 값이 있고 done는 반환할 다른 값이 있는지 여부를 나타냅니다.
done is true는 반환할 다른 값이 없음을 나타냅니다.

인수 없이 yield를 사용하면 next에 값을 전달하고 값을 얻을 수 있습니다.

예를 들어 다음과 같이 작성할 수 있습니다.

function* generatorFunc() {
  console.log(yield);
  console.log(yield);
  console.log(yield);
}

const gen = generatorFunc();
console.log(gen.next());
console.log(gen.next('foo'));
console.log(gen.next('bar'));
console.log(gen.next('baz'));

yield에 콘솔 로그generatorFunc를 기록한 다음 인수로 next를 호출하면 기록됩니다.

첫 번째 것은 본체를 실행하는 대신 생성기 함수를 시작하기 때문에 아무것도 없이 호출해야 합니다.

반환됩니다:

{"done": false,"value": undefined}

Generator 객체는 iterator 계약을 따릅니다.

따라서 Symbol.iterator 메서드를 얻을 수 있습니다.

우리가 가지고있는 경우 :

console.log(gen[Symbol.iterator]() === gen);

우리는 기록true  .

생성기 반복

제너레이터는 반복자입니다.

iterables를 지원하는 모든 것은 제너레이터를 반복하는 데 사용할 수 있습니다.

예를 들어 for-of 루프를 사용할 수 있습니다.

function* genFunc() {
  yield 1;
  yield 2;
}

for (const i of genFunc()) {
  console.log(i)
}

그런 다음 우리는 다음을 얻습니다.

1
2

제너레이터와 함께 구조 분해 구문을 사용할 수도 있습니다.

예를 들어 다음과 같이 작성할 수 있습니다.

function* genFunc() {
  yield 1;
  yield 2;
}

const [x, y] = genFunc();

그런 다음 x는 1이고 y는 2입니다.

컬렉션

JavaScript는 Map  , WeakMap  , Set  , WeakSet  와 같은 다양한 종류의 컬렉션을 제공합니다.

이제 이러한 데이터 구조를 만들기 위해 해킹을 만들 필요가 없습니다.

지도

Map 키-값 쌍을 저장할 수 있습니다.

그것들을 통해 우리는 가치에 빠르게 접근할 수 있습니다.

예를 들어 다음과 같이 작성할 수 있습니다.

const m = new Map();
m.set('first', 1);

그런 다음 다음과 같이 작성하여 얻을 수 있습니다.

console.log(m.get('first'));

키로 값을 가져옵니다.
delete 메소드를 사용하여 주어진 키로 항목을 제거할 수 있습니다.

m.delete('first');

그리고 size 속성으로 크기를 설정할 수 있습니다.

console.log(m.size);

키-값 배열의 배열로 맵을 생성할 수도 있습니다.

const m = new Map([
  ['one', 1],
  ['two', 2],
  ['three', 3],
]);

결론

생성기를 사용하여 이터러블을 생성할 수 있습니다.

또한 맵을 사용하여 키-값 쌍을 저장할 수 있습니다.