JS 函数的执行时机

注意事项

函数需要调用才能执行

let a = 1
function fn(){
console.log(a)
}
//未调用fn，故不会打印

let a = 1
function fn(){
console.log(a)
}
fn()
//打印出1

函数在调用时才会生效，且会被放到第一行，故函数的定义可以放在任何位置。将其放在最后可以使代码更简洁美观。

let a = 1
function fn(){
console.log(a)
}
a = 2
fn()

let a = 1
a = 2
fn()
function fn(){
console.log(a)
}
//以上两个代码是等价的，打印出2

let a = 1
fn()
function fn(){
console.log(a)
}
a = 2
//fn先被调用，打印出1

setTimeout会使函数被调用之后“过一会”执行，这段时间内继续执行未完成的代码

let a = 1
function fn(){
setTimeout(()=>{
console.log(a)
},0)
}
fn()
a = 2
//打印出2，执行完语句a=2之后再执行fn()

setTimeout与for循环同时出现时，如果变量声明在for循环外，则按setTimeout执行；变量声明在for循环内时，JS规定在每次循环时创建一个i，使结果改变。

let i = 0
for(i = 0; i<6; i++){
setTimeout(()=>{
console.log(i)
},0)
}
//let语句在for循环外，先执行for循环六次，跳出循环时i的值为6，再打印六次i。
//6、6、6、6、6、6

for(let i = 0; i<6; i++){
setTimeout(()=>{
console.log(i)
},0)
}
//let语句在for循环内，每次执行for循环时创建一个i并储存它的值，循环完毕后打印出这六个i。
//此时i的值为6，i=6时已经跳出循环。
//把let替换成var不可行
//0 1 2 3 4 5

如何打印出0 1 2 3 4 5？

法1：for和let配合

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

法2：立即执行函数。加一个局部变量j，每次执行for循环的i的值会传给j。

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

法3：利用setTimeout的附加参数，在定时器到期时作为参数传给i。

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

法4：数组。利用数组储存i的值。

let arr=new Array()
for(let i=0;i<6;i++){
arr.push(i)
}
console.log(arr)
let a=arr.join('')
console.log (a)

法5：中间变量j

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

除第一种外，其他几种方法思路类似（吗），都是利用其他参数或开辟一个另外的空间来存储i的值（一个变量只能有一个值），使setTimeout“同时输出”的作用失效。