This is a summary of multiple concurrent secondary thought ES6 asynchronous processing and understanding

1. First we need to understand that js in the for loop, forEach loop, some differences of map cycle directly provide some basis for saying behind when it comes to the

  1.1 for the basic cycle, but also the most easily understood.

  1.2 forEach and map usage is similar,

  Same point:

      You can be traversed to each element of the array , and the same parameters (array current item item, the index index of the current item, the original array input)

  difference:

      forEach () method performs a function provided to each element of the array. Always returns undefined;

      map () method creates a new array, the result is returned after the results of each element in the array to call a function provided. The return value is a new array (but does not change the original array);
  Worded as follows:
. 1  var ary = [1,2,3,4,5 ];
 2 . 1 .forEach ()
 . 3 // no return value, undefined
 . 4 ary.forEach ( function (value, index, Array) {
 . 5    // do something 
. 6 }, the this )
 . 7  
. 8 2 .map () 
 . 9 // return a value, it may return 
. 11 ary.map ( function (value, index, Array) {
 12 is    // do something 
13 is    return XXX
 14 }, the this )

 

2 Now we begin to understand the idea of ​​a multi-asynchronous operation, assume that we currently have such a scene: the list has five tabs, we need to get some data that are five tab, and then click Print out the order

  2.1 data acquisition method of a tab is an asynchronous, this time we intend to use a for loop

 1 async function UpdateClientCache(){
 2       //debugger
 3       console.log('begin')
 4       console.log(new Date())
 5       let arrList = [1,2,3]
 6       let result = []
 7       for (const iterator of arrList) {
 8         result.push(await this.getLMxTableInfo(iterator))//getLMXTableInfo()是一个异步的操作
 9       }
10       console.log('end')
11       console.log(result)
12       the console.log ( new new a Date ())
 13 is      },
 14  
15  // Result difficult to imagine sequentially stored in the output result of the asynchronous operation of each of the return, and executes the next asynchronous operation getLMXTableInfo () are returned in the last after secondary and relationships

 

  2.2 If we take the above for-of forEach loop into it? If the map into it?

. 1  UpdateClientCache () {
 2        // Debugger 
. 3        the console.log ( new new a Date ())
 . 4        the let arrList = [l, 2,3 ]
 . 5        the let Result = []
 . 6        the let Promises arrList.map = ((DOC) => Common .getLMxTableInfo (DOC));
 . 7        Result = the await Promise.all (Promises);
 . 8        the console.log (Result)
 . 9        the console.log ( new new a Date ())
 10      }, 

    // asynchronous operation is actually performed in parallel each time, do not rely on the return value of the last, time saving operation, and in turn return value (here you can go to the actual operation, to adjust the asynchronous time by comparing the new sleep (), my understanding is that asynchronous operation is still waiting, but the synchronization part is Parallel)

// foreachy is the same reason we can have a different wording, we need to note that this is a forEach features: a function for each element of the array is performed once provided, then we can write

UpdateClientCache(){
  console.log(new Date())
  let arrList = [1,2,3]
  let result = []
  
  arrList.forEach(async function(doc){
    result.push(await common.getLMXTableInfo(doc))
  })
  console.log (result) // course is undefined 
  the console.log (new new a Date ())
}

// described, and this should be above the same, belongs to a plurality of asynchronous concurrent case, because every traverse must forEach re-provide a function

corresponding to the await common.getLMXTableInfo = RES1 the let (. 1)

    the let the await common.getLMXTableInfo RES2 = (2)
    let res3 = await common.getLMXTableInfo(3)
    result.push()res1,res2,res3

  I do this in accordance with ES6 explain async examples in the test, in some places the specific reasons not yet clear, some not reproduce the phenomenon of reducing time-consuming, so some places still do reservations, we can do some testing in accordance with this idea , a custom function asynchronous, a callback is given, the test time can be new sleep ()

To cause obstruction in order to achieve the test of time, you can also use this example:

  

. 1  var now = new new a Date ();
 2  var exitTime of that now.getTime = () + 4000 ; // specific time can be changed, ms units
 . 3  the while ( to true ) {
 . 4    now = new new a Date ();
 . 5    IF (now. the getTime ()> exitTime of that) {
 . 6        BREAK ;
 . 7    }
 . 8 } 
a method is a kind of front end // wait thought, it can be packaged into a parameter specific milliseconds

 

 

Guess you like

Origin www.cnblogs.com/xiujun/p/11613254.html