work flow của function generator trong ES6



  • Mình đọc được một đoạn code ví dụ về function generator trong ES6, không hẳn là mình không hiểu nhưng mà rất mơ hồ, không diễn đạt được là nó chạy như nào. Anh em nào có tài liệu hoặc có cách giải thích nào dễ hiểu về cái này không thì chia sẻ cho mọi người cùng biết đi :(
    Đoạn code:

    var foo, f;
    foo = function * () {
        console.log('generator 1');
        console.log('yield 1', yield 'A');
        console.log('generator 2');
        console.log('yield 2', yield 'B');
        console.log('generator 3');
    };
    f = foo();
    console.log('tick 1');
    console.log(f.next('a'));
    console.log('tick 2');
    console.log(f.next('b'));
    console.log('tick 3');
    console.log(f.next('c'));
    console.log('tick 4');
    console.log(f.next('d'));
    

    Còn đây là kết qủa trên terminal:

    tick 1
    generator 1
    { value: 'A', done: false }
    tick 2
    yield 1 b
    generator 2
    { value: 'B', done: false }
    tick 3
    yield 2 c
    generator 3
    { value: undefined, done: true }
    tick 4
    { value: undefined, done: true }


  • cái này là generation function, khi một generate function được gọi bởi hàm next, thì nó lấy chạy tới cái lấy cái value của cái yield gần nhất trong scope function. Sau khi cái yield được sài, nó sẽ ko còn giá trị, nói hàm next được gọi tiếp theo, nó sẽ từ cái yield mới sài đó chạy tiếp tới cái yield tiếp theo để lấy value thôi. Cứ như vậy cho đến khi ko còn yield nào nữa. Coi MDN là biết liền ý mà.



  • Re: work flow của function generator trong ES6

    console.log('yield 1', yield 'A');
    

    Dòng trên có được thực thi trong lần gọi next đầu tiên không ?

    Mình băn khoăng bởi vì result object là

    { value: 'A', done: false }
    

    Vậy nghĩa là cái

    yield 'A'
    

    được thực thi.

    Nhưng sao cái string

    'yield 1'
    

    ở cùng dòng lại hiện ra ở lần call next() tiếp theo chứ không phải ngay dòng đó.



  • yield 'A' -> nó return mất tiêu, nên dòng console đó sẽ chạy lại ở lần sau :D



  • Function bình thường chỉ có thể return 1 kết quả duy nhất. Còn generator function có thể return nhiều kết quả. Hình dung chúng nằm trong 1 stack. Mỗi lần call sẽ lấy ra 1 item trong stack đó.


Log in to reply