js 函数声明和函数表达式的执行结果-Toy模板网

这篇具有很好参考价值的文章主要介绍了js 函数声明和函数表达式的执行结果。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

// 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
// 总结：函数表达式相对于函数声明的一个重要区别是函数声明在代码解析阶段就会被提升（函数声明提升），而函数表达式则需要在赋值语句执行到达时才会创建函数对象