美文网首页
在 JS 中,关于函数的执行时机

在 JS 中,关于函数的执行时机

作者: 猫的老字号 | 来源:发表于2020-06-10 23:16 被阅读0次

函数是一种对象,函数是由 Function 构造的

Function.__proto__ === Function.prototype
// >>true

函数的要素

每个函数都有默认的调用时机
let a = 1
function fn(){
  console.log(a)
}
a = 2
fn()
// >>2
函数的调用时机 && setTimeout()
let a = 1
function fn() {
  setTimeout(()=>{
    console.log(a)
}, 0)
}
fn()
a = 2
// >> a = 2

这里的 setTimeout 方法是一个定时器,在定时器到期后即执行代码,定时为默认值 0 时,意味着:“马上”执行代码,实际的延迟时间可能会比期待的(delay 毫秒数)更长。

let i = 0
for(i = 0; i<6; i++){
  setTimeout(()=>{
    console.log(i)
}, 0)
}
// >> 6, 6, 6, 6, 6, 6

为什么会打印出 6 个 6 ?

同上,因为setTimeout是异步执行,在delay值取为 0 时,“马上”执行代码,所以它会在for循环结束后执行。

此时的变量i,值已经被覆盖成6了,所以会执行6console.log(6)

那如何才能得到符合我们直觉的0 - 5
for循环中使用let声明变量
for(let i = 0; i<6; i++){
  setTimeout(()=>{
    console.log(i)
  },0)
}
// >> 0, 1, 2, 3, 4, 5
因为在let中,let有自己的作用域块,所以在for循环的表达式中使用let,等价于在代码块中使用let
  • for (let i = 0; i< 5; i++) || 这句话的圆括号之间,有一个隐藏的作用域
  • for (let i = 0; i< 5; i++) { 循环体 } || 在每次执行循环体之前,JS 引擎会把i在循环体的上下文中重新声明及初始化一次,即每次循环会多创建一个i
另一种方法得到0 - 5
let i = 0
for(i = 0; i<6; i++){
    setTimeout((value)=> {
      console.log(value)
    },0,i)
}
// >> 0, 1, 2, 3, 4, 5

i作为参数传入到setTimeout()中即可实现打印出0 - 5

相关文章

  • 在 JS 中,关于函数的执行时机

    函数是一种对象,函数是由 Function 构造的 函数的要素 每个函数都有默认的调用时机 函数的调用时机 && ...

  • 2020-11-07

    JS 函数的执行时机 函数的执行时机不同结果也会不同,js也分为同步执行和异步执行 简单的举几个同步执行例子1、 ...

  • JS函数的执行时机

    JS函数的执行时机 在解释JS函数的执行时机之前,先来看一个例子 将console.log打印出来是什么呢?答案是...

  • [js]一招教你掌握this指向

    关于 This 它是JS关键字,在JS中具有特殊意义,代表一个空间地址; this是执行的主体,谁执行的这个函数谁...

  • ES6箭头函数

    定义 ES6 允许使用“箭头”(=>)定义函数。 关于普通函数应该知道的 js中的this是执行上下文,在普通函数...

  • JS函数执行时机

    请问下面这段代码会打印什么结果 打印出6 个6解析:因为i作用域,不属于 for 循环体,属于 global;等到...

  • JS 函数的执行时机

    1. 常见的面试题代码解释 // 6 个 6JS是单线程运行的,setTimeout(code,millisec)...

  • JS 函数的执行时机

    为什么打印出6 个 6? setTimeout 会过一段时间才去执行,这时候for已经循环完了所以打出6个6 为什...

  • JS 函数的执行时机

    1 解释为什么如下代码会打印 6 个 6 变量i在for循环中执行i++. 最后一次i++ ,i=6,for循环不...

  • JS 函数的执行时机

    1 解释为什么如下代码会打印 6 个 6 -函数一共会执行6次循环,每次循环到i = 6的时候就打印出值-在有se...

网友评论

      本文标题:在 JS 中,关于函数的执行时机

      本文链接:https://www.haomeiwen.com/subject/pkymtktx.html