Generators generator and the JS expression yield

1.Generators generator function

       Generator function is an asynchronous programming solutions ES6 provided, the behavior of traditional grammar function is completely different.

       Generator functions are understood various angles. Syntax, it can be understood as a first, Generator function is a state machine, a plurality of internal state of the package.

       Generator function returns an execution visitor object, that is, in addition to a function Generator state machine, or a visitor object generating function. Returning visitor object, you may in turn through each state inside Generator function.

       Formally, Generator function is a normal function, but there are two features. First, there is between the function key and the function name with an asterisk; Second, the functions that use the expression yield, define different internal states (yield meaning in English is "output").

       Generator following code defines a function demoGenerator, has within it two expressions yield (Hello and world), i.e., the function has three states: hello, world and return statement (end of the execution).

function* demoGenerator() {
  yield 'hello';
  yield 'world';
  return 'ending';}

var hw = demoGenerator();

Generator function calls the method with normal function, but also after the function name with a pair of parentheses. The difference is that, after calling Generator function, which is not performed, nor is the function is to return the result, but a pointer to the object's internal state.

2.yield expression

       Because Generator function returns the visitor object, that's only traverse to the next internal state next method invocation, so in fact it provides a way to suspend execution of the function. yield expression is a pause sign.

  • Encounter yield expression, you suspend the operation of the back, and immediately after the yield value of the expression of the latter, as the value of the returned object property values.

  • The next time you call the next method, and then continues down until the next yield expression.

  • If you no longer meet the new yield expression, it has been run to the end of the function, until the return statement, and the return value of the expression behind the statement, as the value of the returned object property values.

  • If the function does not return statement, then the value returned by the object attribute is undefined.

           Next, 必须调用遍历器对象的next方法so that the pointer moves to the next state. That is, each call to the next method, it is time to stop internal pointer from place to begin or function head, 直到遇到下一个yield表达式(或return语句)为止.

In other words, the function is piecewise Generator performed, the yield marker expression is suspended, and the next method can resume execution.

hw.next();
// { value: 'hello', done: false }

hw.next();
// { value: 'world', done: false }

hw.next();
// { value: 'ending', done: true }

hw.next();
// { value: undefined, done: true }

      The above code is called a total of four next methods:

  • The first call, Generator function begins execution, until the first yield expression so far. next method returns an object whose property value is the value of the current value hello yield false expression, done property, expressed traversal is not over yet.
  • The second call, Generator function from where the last stop of expression yield, executed until the next yield expression. value property next method returns an object of value is the current value of the world yield false expression, done property, expressed traversal is not over yet.
  • The third call, Generator function from where the last stop of expression yield, has been implementing a return statement (if there is no return statement is executed to the end of the function). The method returns the next attribute value of the object, the value of the expression is immediately behind the return statement (if no return statement, then the value attribute is undefined), the attribute value of true done indicating traversal has completed.
  • The fourth call, this time Generator function has finished running, next method returns an object's value property is undefined, done property is true. Later call to the next method, this value is returned.

Summary: Generator function call returns an iterator object representing the internal pointer Generator function. After each call to the next method visitor object, the object will return a value and has done two properties. value property represents the value of the current internal state, that is the value of the expression yield expression behind; done attribute is a Boolean value that indicates whether traversal end.

Published 51 original articles · won praise 181 · views 20000 +

Guess you like

Origin blog.csdn.net/weixin_42881768/article/details/104718438