zoukankan      html  css  js  c++  java
  • js----JS的运行机制

    现有如下html结构
    
    <ul>
     <li>click me</li>
     <li>click me</li>
     <li>click me</li>
     <li>click me</li>
    </ul>
    运行如下代码:
        var elements=document.getElementsByTagName('li');
        var length=elements.length;
        for(var i=0;i<length;i++){
            elements[i].onclick=function(){
            alert(i);
        }
     }
    依次点击4个li标签,哪一个选项是正确的运行结果(4,4,4,4)?
    这里考的是JS的运行机制! 
    事件(click,focus等等),定时器(setTimeout和setInterval),ajax,都是会触发异步,属于异步任务;

    js是单线程的一个时间点只能做一件事,优先处理同步任务;

    按照代码从上往下执行,遇到异步,就挂起,放到异步任务里,继续执行同步任务,只有同步任务执行完了,才去看看有没有异步任务,然后再按照顺序执行!
    里for循环是同步任务,onclick是异步任务,所以等for循环执行完了,i变成4了,

    注意:这里因为i是全局变量,最后一个i++,使得i为4(后面的onclick函数,最后在循环外面执行,不受i<length限制);
    所以for循环每执行一次,onclick事件函数都会被挂起一次,共4次; for循环结束后,点击事件 触发了4个onclick函数,接着输出4个4!
  • 相关阅读:
    MySQL 优化实施方案
    MySQL Replication 主从复制全方位解决方案
    CentOS 7.X 系统安装及优化
    W25Q32的使用
    Word分栏
    转载:STM32之中断与事件---中断与事件的区别
    常见贴片电阻的分类、功率、封装、标注规则
    导线时延
    重装系统流程
    MFC应用程序向导生成的文件
  • 原文地址:https://www.cnblogs.com/SRH151219/p/10404704.html
Copyright © 2011-2022 走看看