Article1：

// 函數表達式(function expression) 
var h = function() {
      // h
}

// 函數聲明(function declaration) 
function h() {
      // h
}

先說兩者的顯著區別:

第一種聲明方式也就是var聲明方式, 函數只有在var語句聲明之后才能被調用

第二種聲明方式也就是function聲明方式, 函數可以在function聲明之前被調用

這是因為,

對第一種情況, 函數表達式是在函數運行階段才賦值給變量h

對第二種情況, 函數表達式是在代碼運行階段之前, 也就是代碼解析階段才賦值給標識符h

為了證明這種說法可以看下面兩個例子:

對應第一種情況,

var h = function () {
      // h
}

console.log(h)
    
h = function () {
      // h1
}

console的結果是

? h() {
  // h
}

因為賦值發生在代碼運行階段, 代碼自上而下運行console.log(h)所在位置只能獲取它之前的賦值

對應第二種情況,

function h() {
      // h
}

console.log(h)
    
function h() {
      // h1
}

console的結果是

? h() {
  // h1
}

因為賦值發生在代碼解析階段, 代碼運行到console.log(h)時解析早已完成, 而解析的結果是后面那個函數h, 故會打印此結果

深入:

JS聲明函數的三種方式:

1.函數表達式:即上面第一種方式, 這種方法使用function操作符創建函數, 表達式可以存儲在變量或者對象屬性里.函數表達式往往被稱為

匿名函數, 因為它沒有名字. 證明這一點你可以console.log(h.name);可以看到打印為空 ""

2.函數聲明:即上面第二種方式, 會聲明一個具名函數, 且函數能在其所在作用域的任意位置被調用, 其創建的函數為具名函數,證明這一

點你可以console.log(h.name);可以看到打印為 "h". 可在后面的代碼中將此函數通過函數名賦值給變量或者對象屬性

3.Function()構造器:不推薦這種用法, 容易出問題

來源：博客園

作者：PajamaCat

原文：https://www.cnblogs.com/skura23/p/7520593.html

---------------------------------------------------------------------------

Article2：

JavaScript 函數和變量聲明的“提前”（hoist）行為

簡單的說 如果我們使用 匿名函數

var a = {}

這種方式， 編譯后變量聲明a 會“被提前”了，但是他的賦值（也就是a）并不會被提前。

也就是，匿名函數只有在被調用時才被初始化。

如果使用

function a () {};

這種方式， 編譯后函數聲明和他的賦值都會被提前。

也就是說函數聲明過程在整個程序執行之前的預處理就完成了，所以只要處于同一個作用域，就可以訪問到，即使在定義之前調用它也可以。

看一個例子

function hereOrThere() { //function statement
  return 'here';
}
console.log(hereOrThere()); // alerts 'there'
function hereOrThere() {
  return 'there';
}

我們會發現alert(hereOrThere)語句執行時會alert('there')！這里的行為其實非常出乎意料，主要原因是JavaScript 函數聲明的“提前”行為，簡而言之，就是Javascript允許我們在變量和函數被聲明之前使用它們，而第二個定義覆蓋了第一種定義。換句話說，上述代碼編譯之后相當于

function hereOrThere() { //function statement
 return 'here';
}
function hereOrThere() {//申明前置了，但因為這里的申明和賦值在一起，所以一起前置
 return 'there';
}
console.log(hereOrThere()); // alerts 'there'

我們期待的行為

var hereOrThere = function () { // function expression
  return 'here';
};
console.log(hereOrThere()); // alerts 'here'
hereOrThere = function () {
  return 'there';
};

這段程序編譯之后相當于：

var hereOrThere；//申明前置了
hereOrThere = function() { // function expression
 return 'here';
};
console.log(hereOrThere()); // alerts 'here'
hereOrThere = function() {
 return 'there';
};

總結

以上所述是小編給大家介紹的JavaScript 中定義函數用 var foo = function () {} 和 function foo()區別介紹，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對腳本之家網站的支持！

來源：腳本之家

作者：歸去來兮-不如去兮

原文：https://www.jb51.net/article/135701.htm

---------------------------------------------------------------------------

總結

以上是生活随笔為你收集整理的JS中var声明与function声明两种函数声明方式的区别的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。