zoukankan      html  css  js  c++  java
  • JS 有趣的JS

    一、

    var arr = [];
    for (var i = 0; i < 3; i++) {
          arr[i] = function() {
                console.log(i+'__') // 3 3 3
          }
    }
    
    arr[0]();
    arr[1]();
    arr[2]();

    执行上下文

    for循环开始时,i 作为一个全局变量,每次循环都将 function 放进 arr,但 function 没有执行
    循环结束,全局变量 i 的值已经变为了 3,这时再执行函数 function
    执行结果 3 3 3

    二、

    for (var i = 0; i < 3; i++) {
         setTimeout(function() {
                console.log(i+'...') // 3 3 3
         }, 0)
    }

    JS运行机制
    setTimeout 是异步方法
    for 循环开始时,setTimeout 里的函数 function 并没有立即执行,而是被加入任务队列
    循环结束时,也就是当主进程运行结束时,任务队列的方法才会进入主进程开始执行,此时全局变量 i 的值已经变为了 3
    所以执行结果 3 3 3

    三、

    window.val = 1;
    var obj = {
          val: 2,
          start: function() {
              // console.log(this)
              this.val *= 2;
              val *= 2;
              console.log(val)
              console.log(this.val)
          }
    }
    obj.start()   // 2 4
    var func = obj.start;
    func(); // 8 8

    this 指向
    当执行 obj.start() 时,start函数为 obj 属性,this 指向 obj,执行完毕,window.val = 2,obj.val = 4;
    当执行 func() 时,obj.start作为普通函数被调用,this 指向 window。

  • 相关阅读:
    clientX和clientY属性需要注意的地方
    事件冒泡 --- 仿select下拉框
    body和document的梗
    完美运动框架
    仿flash运动框架
    多物体运动框架
    Computed Styles
    悬浮框
    【一起驴友】公司笔试
    Client Dimensions , offsetHeight , scrollTop 属性详解
  • 原文地址:https://www.cnblogs.com/gaosirs/p/10598987.html
Copyright © 2011-2022 走看看