JS中的同步异步编程思想

JS中的两种编程思想<同步>、异步#

• 1、同步编程->上一件事情没有完成,继续处理上一件事情,只有上一件事情完成了,才会做下一件事情(JS中大部分都是同步编程的)

1
for (var i = 0; i < 100000; i++) {
2
    if (i == 99999) {
3
        console.log("循环结束了~~");//->(1)
4
    }
5
}
6
console.log("ok");//->(2)

• 1. for循环就是同步编程的,只有循环结束后,才会继续执行下面的代码

1
while (1) {
2

3
}
4
console.log("ok");//->永远都不会执行的,因为上面的循环是死循环,循环永远都不会结束

• 2、异步->规划要做一件事情,但是不是当前立马去执行这件事情,需要等一定的时间,这样的话,我们不会等着它执行,而是继续执行下面的操作,“只有当下面的事情都处理完成了,才会返回头处理之前的事情;如果下面的事情并没有处理完成,不管之前的事情有没有到时间,都踏踏实实的给我等着”
• 在JS中异步编程只有四种情况:
  • 1)定时器都是异步编程的
  • 2)所有的事件绑定都是异步编程的
  • 3)Ajax读取数据的时候,我们一般都设置为异步编程
  • 4)回调函数也是异步编程的

1
var n = 0;
2
window.setTimeout(function () {
3
    n++;
4
    console.log(n);//->1 (2)
5
}, 1000);
6
console.log(n);//->0 (1)

• 3.定时器
  • 1. 每一个浏览器对于定时器的等待时间都有一个最小的值,谷歌<5>6ms IE<10>13ms,如果设置的等待时间小于这个值,不起作用,还是需要等到最小时间才执行的;尤其是写0也不是立即执行;

    1
    var n = 0;
    2
    window.setTimeout(function () {
    3
        n++;
    4
        console.log(n);//->1 (2)
    5
    }, 0);
    6
    console.log(n);//->0 (1)
    7
    //-->先输出0  再输出1

    • 2. 我们定时器设置的等待时间不一定就是最后执行的时间,如果定时器之后还有其他的事情正在处理中,不管定时器的时间有没有到,都是不会执行定时器的

    1
    var n = 0;
    2
    window.setTimeout(function () {
    3
        n++;
    4
        console.log(n);//->不执行的
    5
    }, 0);
    6
    console.log(n);//->0 (1)
    7
    while (1) {//->死循环
    8
        n++;
    9
    }
    10
    console.log(n);//->不执行
    11
    var n = 0;
    12
    window.setTimeout(function () {
    13
        n += 2;
    14
        console.log(n); //->7 (4)
    15
    }, 20);
    16
    window.setTimeout(function () {
    17
        n += 5;
    18
        console.log(n); //->5 (3)
    19
    }, 5);
    20
    console.log(n);//->0 (1)
    21
    for (var i = 0; i < 10000000; i++) {}
    22
    console.log(n);//->0 (2)

    展开收起
    • 3)事件绑定

    1
    var oLis=document.getElementsByTagName("li");
    2
        for(var i=0;i<oLis.length;i++){
    3
            oLis[i].onclick=function(){
    4
                tabChange(i);
    5
            }
    6
        }