Javascript 생성기(Generator)의 소개 및 사용

무엇이 생성기입니까?

생성기는 함수 내부에서 실행되는 일부 코드이다

값을 되돌린 후, 그것은 스스로 멈추고, 또는

호출 프로그램은 정지를 취소하고 다른 값을 되돌려 달라고 요구할 수 있습니다.

이런'귀환'은 전통적인 종함수 리턴이 아니다.그래서 그것은 특별한 명칭인 이엘드를 부여받았다.
생성기 문법은 언어에 따라 다르다.Javascript의 생성기 문법은 PHP와 유사하지만 차이점도 크다. 만약 그들의 작용이 같기를 원한다면 결국은 매우 곤혹스러울 것이다.
javascript에서 생성기를 사용하려면 다음이 필요합니다.

특수한 생성기 함수를 정의합니다

이 함수를 호출하여 생성기 대상을 만듭니다

순환 중에 이 생성기 대상을 사용하거나next 방법을 직접 호출합니다.

우리는 아래의 간단한 절차를 시작으로 다음과 같은 각 단계를 수행한다.

// File: sample-program.js
function *createGenerator() {
 for(let i=0;i<20;i++) {
 yield i
 }
}

const generator = createGenerator()

console.log(generator.next())
console.log(generator.next())

이 코드를 실행하면 다음과 같은 출력을 얻을 수 있습니다.
$ node sample-program.js
{ value: 0, done: false }
{ value: 1, done: false }
다음은 내가 이 프로그램이 어떻게 작동하는지 설명한다.

생성기 함수

먼저 코드에 생성기 함수의 정의가 존재합니다.

function* createGenerator() {
 for(let i=0;i<20;i++) {
 yield i
 }
}

function 뒤에 있는 *는 자바스크립트에 생성기 함수라고 알려줍니다.다음 글꼴은 모두 생성기 함수의 유효한 정의입니다.

function*createGenerator
function* createGenerator
function *createGenerator

* 함수 이름의 일부가 아닙니다.function* 기호가 생성기를 정의합니다.

생성기 함수 호출

생성기 함수를 정의한 후에 다른 이름의 함수로 명명합니다.

//  ： ，  *。 *  
// `function *`  
const generator = createGenerator()

그러나createGenerator 함수는 반환 값이 없습니다.이것은 생성기 함수에 전통적인 반환 값이 없기 때문이다.반대로, 생성기 함수를 직접 호출할 때, 그것은 항상 실례화된 Generator 대상을 되돌려줍니다.
이 생성기 대상은next 방법을 가지고 있다.next를 호출하면 생성기 함수 내부에서 코드가 실행됩니다.

function* createGenerator() {
 for(let i=0;i<20;i++) {
  yield i
 }
}

이것은 매우 중요하기 때문에 그것을 다시 호출할 수 있다.생성기 함수를 직접 호출하면 생성기 함수에서 코드가 실행되지 않습니다.생성기 대상을 만듭니다.이것은 생성기 대상에next를 호출하여 생성기 함수의 코드를 호출합니다.
생성기 대상에서next를 처음 호출할 때, 내부 코드는 yield 문장이 나타날 때까지 계속 실행됩니다.yield에 실행되면javascript는 이 코드의 실행을 멈추고,next는 (즉 당신에게, 또는 yield) 하나의 대상을 되돌려줍니다. 이 대상은 yield 줄의 값을 포함합니다.
두 번째 (또는 세 번째, 네 번째, 심지어 여러 번) next를 호출할 때, 코드는 정지를 취소하고 계속 실행할 것입니다.변수 (예: 이 예의 i) 는 값을 유지합니다.코드가 다른 yield 문장에 도달하면 이 함수는 다시 멈추고 yield 값을 포함하는 대상을 되돌려줍니다.
이것이 바로 우리가 왜 두 번next를 호출해야 하는가 하는 것이다

console.log(generator.next())
console.log(generator.next())

출력은 다음과 같습니다.
{ value: 0, done: false }
{ value: 1, done: false }
생성기 함수의 코드가 실행되면 나중에next에 대한 모든 호출은 하나의 대상을 되돌려줍니다. 이 대상의 값은undefined이고done는true로 설정됩니다.

{ value: undefined, done: true }

생성기 및 순환

생성기 대상에서next를 수동으로 호출할 수 있지만, 우리는 주로 순환에서 사용해야 한다.이 약간 수정된 프로그램을 보세요.

// File: sample-program.js
@highlightsyntax@jscript
function *createGenerator() {
 for(let i=0;i<5;i++) {
 yield i
 }
}

const generator = createGenerator()
for(const value of generator) {
 console.log(value)
}

for...of 순환에서 생성기 대상을 사용할 때, 매번 순환은 생성기 대상에next를 호출하고, 생성된 값으로 변수 (위의value) 를 채웁니다.프로그램을 실행하면 다음과 같은 내용이 출력됩니다.
$ node sample-program.js
0
일
이
삼
사
다음 문장에서 우리는 더욱 깊이 있게 for...of 순환, 그리고 자바스크립트에 자바스크립트의 모든 대상을 순환하는 내장 방법을 탐색합니다.

총결산

자바스크립트 생성기(Generator)에 대한 이 글은 여기까지 소개되었습니다. 자바스크립트 생성기(Generator)에 대한 더 많은 내용은 저희 이전의 글을 검색하거나 아래의 관련 글을 계속 훑어보시기 바랍니다. 앞으로 많은 응원 부탁드립니다!