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
// 總結：函數表達式相對於函數聲明的一個重要區別是函數聲明在代碼解析階段就會被提升（函數聲明提升），而函數表達式則需要在賦值語句執行到達時才會創建函數對象

參考：https://juejin.cn/post/7237051958993469496

推薦：看 《你不知道的 JavaScript》，裡面有詳細的 js 執行細節，看完很有收穫。