js 函数声明和函数表达式的执行结果

// var 定义的变量会进行变量提升,声明被拿到函数或全局作用域的顶端,并输出 undefined // 函数声明也会进行提升,var 的变量提升会覆盖函数声明提升 console.log(" 0 ") var fn = function () { console.log("fn0-1") } f …

// var 定义的变量会进行变量提升,声明被拿到函数或全局作用域的顶端,并输出 undefined
// 函数声明也会进行提升,var 的变量提升会覆盖函数声明提升
console.log("=====0======")
var fn = function () {
  console.log("fn0-1")
}
fn()
var fn = function () {
  console.log("fn0-2")
}
fn()
function fn() {
  console.log("fn0-3")
}
fn()
function fn() {
  console.log("fn0-4")
}
fn()
// fn0-1
// fn0-2
// fn0-2
// fn0-2
console.log("=====1======")
try {
  fn1()
} catch (error) {
  console.log(error)
}
var fn1 = function () {
  console.log("fn1-1")
}
// Uncaught TypeError: fn1 is not a function

console.log("====2=======")
// 函数声明会提升,可以直接在函数定义之前执行函数,后面定义的函数声明会覆盖前面的函数声明
function fn2() {
  console.log("fn2-1")
}
fn2()
function fn2() {
  console.log("fn2-2")
}
fn2()
// fn2-2
// fn2-2

console.log("=====3======")
fn3()   // 函数声明提升,走最后一个函数声明的结果
var fn3 = function () {
    console.log("fn3-1")
}
function fn3() {
  console.log("fn3-2")
}
fn3()  // var 声明提升覆盖函数声明提升
function fn3() {
  console.log("fn3-3")
}
fn3() //  var 声明提升覆盖函数声明提升
// fn3-3
// fn3-1
// fn3-1

console.log("=====5======")
var fn5 = function () {
  console.log("fn5-1")
}
fn5()
var fn5 = function () {
  console.log("fn5-2")
}
fn5()
// fn5-1
// fn5-2
// 总结:函数表达式相对于函数声明的一个重要区别是函数声明在代码解析阶段就会被提升(函数声明提升),而函数表达式则需要在赋值语句执行到达时才会创建函数对象

参考:https://juejin.cn/post/7237051958993469496

推荐:看 《你不知道的 JavaScript》,里面有详细的 js 执行细节,看完很有收获。

                       

点击阅读全文

上一篇 2023年 6月 9日 pm8:48
下一篇 2023年 6月 9日 pm8:48