1. Synchronous and asynchronous
Synchronization: The program from the top to the bottom of the execution, the popular say For cycle is time-consuming, but the program is silly wait, silly waiting for a haha output, Then output 3, such as mother to pick up the son's plane , need to wait a long time, waiting for the time is silly, do not do other things at the same time.
Asynchronous: The popular talk is to meet a particularly time-consuming thing, the program will not be silly, but first execute the following statement. For example, the mother to pick up the son's plane, need to wait a long time, but mom at the same time to shop or something, not silly.
1<script>2 Sync3Console.log (1);4Console.log (2);5 for(i=1;i<=10;i++){6Console.log ("haha")7 }8Console.log (3);9 Ten Asynchronous OneConsole.log (1); AConsole.log (2); -var count =0; -var timer=setinterval (function () { theConsole.log ("haha"); -count++; - - if(count==10){ + clearinterval (timer); - } +},100); AConsole.log (3); at</script>
View Code
2. Callback function
- callback function: An asynchronous statement is done after it is done.
1<script>2var count =0;3var timer =setinterval (function () {4Console.log ("haha");5count++6 if(Count = = 10){7 clearinterval (timer);8Console.log ("print haha complete");9 callback ();Ten } One},100); A function Callback () { -Console.log ("print haha complete") - } the</script>
View Code
3. Apply and Call statements
- The Apply and call functions are the same, and the function is to have the function called and to set who this is for the function.
1<! DOCTYPE html>2"en">34<meta charset="UTF-8">5<title>Document</title>67<body>8 9<script>Tenvar obj={ One//"name":"Zhangsan", A//" Age": 20, -//"Sayname": Function () { -//Console.log (this.name); the// } -// } - -Obj.sayname (); //Output Zhangsan + -//function ShowName () { +//Console.log (this.name); A// } atShowName ();//there's nothing. -ShowName (obj); //there's nothing. - - -//Call and apply roles: -1. Execute function 2. Change the this point inside the function inShowname.call (obj); //Output Zhangsan -Showname.apply (obj); //Output Zhangsan to +//difference: -var obj = { the "name":"Zhangsan" * } $ function sum (a,b,c) {Panax NotoginsengConsole.log (a+b+c); - Console.log (this.name); the } +SUM (by); A//The call is separated by a comma when the parameter is passed. Apply to wrap the parameters in an array theSum.call (obj,1,2,3); +Sum.apply (obj,[1,2,3]); - $ $</script> - -</body> theView Code4,setTimeout () and setinterval () and function throttling
- SetInterval is to set the spacer;
- SetTimeout is the setting of the delay timer.
- Window.settimeout ( function , time );
after a specified time, the function executes once, and executes only 1 times. window can be omitted
To clear the delay device:
1 //setinterval and settimeout2 setinterval (function () {3 Console.log (Math.random ()); 4 },1000); outputs a random number every second, and can be output 56 setTimeout (function () { 7 Console.log (Math.random ()); 8 },1000); delay 1 seconds output a random number, can only output once
View Code
Function Throttle:
- Definition: function throttling, which is what we want some functions not to trigger continuously. It is even stipulated that the minimum interval for triggering this function is how long.
<! DOCTYPE html>"en">"UTF-8"> <title>Document</title>"Button"Value="Point Me"> <script>//function Throttling, if you do not use the throttle click button will click the output a random number using throttling after the Click button will not work automatically according to the set time interval output var btn= document.getElementsByTagName ('input') [0];//get button var lock=true; Btn.onclick=function () {if(!lock)return; If lock=false, returns directly, the following does not execute Console.log (Math.random ()); Lock=false; SetTimeout (function () {lock=true; }, 1000); } </script></body>View CodeJavaScript Basics Introductory Article