Trong hướng dẫn này, bạn sẽ tìm hiểu về trình tạo JavaScript với sự trợ giúp của các ví dụ.
Trong JavaScript, trình tạo cung cấp một cách mới để làm việc với các hàm và trình vòng lặp.
Sử dụng máy phát điện,
- bạn có thể dừng việc thực thi một hàm từ bất kỳ đâu bên trong hàm
- và tiếp tục thực thi mã từ vị trí bị tạm dừng
Tạo trình tạo JavaScript
Để tạo một trình tạo, trước tiên bạn cần xác định một chức năng của trình tạo bằng function*
biểu tượng. Các đối tượng của chức năng máy phát điện được gọi là máy phát điện.
// define a generator function function* generator_function() (… ) // creating a generator const generator_obj = generator_function();
Lưu ý : Hàm máy phát được ký hiệu là *
. Bạn có thể sử dụng function* generatorFunc() (… )
hoặc function *generatorFunc()(… )
tạo chúng.
Sử dụng lợi nhuận để tạm dừng thực thi
Như đã đề cập ở trên, bạn có thể tạm dừng thực thi một hàm của trình tạo mà không cần thực thi toàn bộ thân hàm. Đối với điều đó, chúng tôi sử dụng yield
từ khóa. Ví dụ,
// generator function function* generatorFunc() ( console.log("1. code before the first yield"); yield 100; console.log("2. code before the second yield"); yield 200; ) // returns generator object const generator = generatorFunc(); console.log(generator.next());
Đầu ra
1. mã trước sản lượng đầu tiên (giá trị: 100, thực hiện: sai)
Đây,
- Một đối tượng trình tạo có tên
generator
được tạo. - Khi
generator.next()
được gọi, mã đầu tiênyield
được thực thi. Khiyield
gặp phải, chương trình trả về giá trị và tạm dừng chức năng tạo.
Lưu ý : Bạn cần gán các đối tượng của trình tạo cho một biến trước khi sử dụng.
Làm việc của nhiều Báo cáo lợi nhuận
Các yield
biểu thức trả về một giá trị. Tuy nhiên, không giống như return
câu lệnh, nó không kết thúc chương trình. Đó là lý do tại sao bạn có thể tiếp tục thực thi mã từ vị trí được tạo cuối cùng. Ví dụ,
function* generatorFunc() ( console.log("1. code before first yield"); yield 100; console.log("2. code before the second yield"); yield 200; console.log("3. code after the second yield"); ) const generator = generatorFunc(); console.log(generator.next()); console.log(generator.next()); console.log(generator.next());
Đầu ra
1. mã trước năng suất đầu tiên (giá trị: 100, thực hiện: sai) 2. mã trước năng suất thứ hai (giá trị: 200, thực hiện: sai) (giá trị: không xác định, thực hiện: đúng)
Đây là cách chương trình này hoạt động.
- Câu
generator.next()
lệnh đầu tiên thực thi mã cho đến câu lệnh lợi nhuận đầu tiên và tạm dừng việc thực thi chương trình. - Cái thứ hai
generator.next()
bắt đầu chương trình từ vị trí tạm dừng. - Khi tất cả các phần tử được truy cập, nó sẽ trả về (value: undefined, done: true).

Chuyển các đối số đến các hàm của trình tạo
Bạn cũng có thể chuyển các đối số cho một hàm trình tạo. Ví dụ,
// generator function function* generatorFunc() ( // returns 'hello' at first next() let x = yield 'hello'; // returns passed argument on the second next() console.log(x); console.log('some code'); // returns 5 on second next() yield 5; ) const generator = generatorFunc(); console.log(generator.next()); console.log(generator.next(6)); console.log(generator.next());
Đầu ra
(giá trị: "xin chào", thực hiện: sai) 6 một số mã (giá trị: 5, thực hiện: sai) (giá trị: không xác định, thực hiện: đúng)
Trong chương trình trên,
- Đầu tiên
generator.next()
trả về giá trị củayield
(trong trường hợp này là 'hello'). Tuy nhiên, giá trị không được gán cho biến x tronglet x = yield 'hello';
(giá trị: "xin chào", thực hiện: sai)
- Khi
generator.next(6)
gặp phải, mã lại bắt đầu tạilet x = yield 'hello';
và đối số 6 được gán cho x. Ngoài ra, mã còn lại được thực thi đến giâyyield
.6 một số mã (giá trị: 5, thực hiện: sai)
- Khi thứ ba
next()
được thực thi, chương trình trả về (value: undefined, done: true). Đó là bởi vì không có câu lệnh lợi nhuận nào khác.(giá trị: không xác định, thực hiện: đúng)
Trình tạo được sử dụng để triển khai lặp lại
Trình tạo cung cấp một cách dễ dàng hơn để triển khai trình vòng lặp.
Nếu bạn muốn triển khai trình vòng lặp theo cách thủ công, bạn phải tạo một trình vòng lặp với next()
phương thức và lưu trạng thái. Ví dụ,
// creating iterable object const iterableObj = ( // iterator method (Symbol.iterator)() ( let step = 0; return ( next() ( step++; if (step === 1) ( return ( value: '1', done: false); ) else if (step === 2) ( return ( value: '2', done: false); ) else if (step === 3) ( return ( value: '3', done: false); ) return ( value: '', done: true ); ) ) ) ) for (const i of iterableObj) ( console.log(i); )
Đầu ra
1 2 3
Vì trình tạo có thể lặp lại, bạn có thể triển khai trình lặp theo cách dễ dàng hơn. Sau đó, bạn có thể lặp lại qua các trình tạo bằng for… of
vòng lặp. Ví dụ,
// generator function function* generatorFunc() ( yield 1; yield 2; yield 3; ) const obj = generatorFunc(); // iteration through generator for (let value of obj) ( console.log(value); )
Phương pháp máy phát điện
phương pháp | Sự miêu tả |
---|---|
next() | Trả về giá trị lợi nhuận |
return() | Trả về một giá trị và kết thúc trình tạo |
throw() | Ném lỗi và chấm dứt trình tạo |
JavaScript trả về Vs từ khóa lợi nhuận
trả lại từ khóa | từ khóa lợi nhuận |
---|---|
Trả về giá trị và kết thúc hàm. | Trả về giá trị và tạm dừng hàm nhưng không kết thúc hàm. |
Có sẵn trong cả chức năng bình thường và chức năng máy phát điện. | Chỉ có sẵn trong các chức năng của máy phát điện. |
Hàm tạo JavaScript có trả về
You can use the return
statement in a generator function. The return
statement returns a value and terminates the function (similar to regular functions). For example,
// generator function function* generatorFunc() ( yield 100; return 123; console.log("2. some code before second yield"); yield 200; ) // returns generator object const generator = generatorFunc(); console.log(generator.next()); console.log(generator.next()); console.log(generator.next());
Output
(value: 100, done: false) (value: 123, done: true) (value: undefined, done: true)
In the above program, when the return
statement is encountered, it returns the value and done
property becomes true
, and the function terminates. Hence, the next()
method after the return
statement does not return anything.
Note: You can also use the return()
method instead of the return
statement like generator.return(123);
in the above code.
JavaScript Generator Throw Method
Bạn có thể xử lý lỗi một cách rõ ràng trên hàm trình tạo bằng phương thức ném (). Việc sử dụng throw()
phương thức ném ra một lỗi và kết thúc hàm. Ví dụ,
// generator function function* generatorFunc() ( yield 100; yield 200; ) // returns generator object const generator = generatorFunc(); console.log(generator.next()); // throws an error // terminates the generator console.log(generator.throw(new Error('Error occurred.'))); console.log(generator.next());
Đầu ra
(giá trị: 1, thực hiện: sai) Lỗi: Đã xảy ra lỗi.
Sử dụng máy phát điện
- Trình tạo cho phép chúng tôi viết mã sạch hơn trong khi viết các tác vụ không đồng bộ.
- Trình tạo cung cấp một cách dễ dàng hơn để triển khai trình vòng lặp.
- Trình tạo chỉ thực thi mã của nó khi được yêu cầu.
- Máy phát điện là bộ nhớ hiệu quả.
Máy phát điện đã được giới thiệu trong ES6 . Một số trình duyệt có thể không hỗ trợ việc sử dụng máy phát điện. Để tìm hiểu thêm, hãy truy cập hỗ trợ Trình tạo JavaScript.