函數聲明與函數表達式的區別

_Suqin 發布于2019-08-22 14:06 / 996人閱讀

摘要：有兩種定義函數的方式函數聲明與函數表達式。所以在實際開發的時候，一定要注意變量函數的聲明會被提升到當前作用域的最前面

JS有兩種定義函數的方式：函數聲明與函數表達式。那么這兩種方式有區別嗎，還是一樣的呢？下面我們來進一步探討探討。

下面我們定義了兩個函數分別為 hello 和 hi，前者采用函數聲明，后者采用函數表達式，然后再調用，如下：

function hello () {
    console.log("Hello the world");
}

var hi = function () {
    console.log("Hi, IMWeb");
}

hello(); // "Hello the world"
hi(); // "Hi, IMWeb"

上面的調用，我們都能得到正確的運行，并沒有什么區別。但是如果我們把順序掉下，先調用函數后定義函數，那么情況就會有點不一樣了。如下：

hello(); // "Hello the world"
hi(); // Uncaught TypeError: hi is not a function

function hello () {
    console.log("Hello the world");
}

var hi = function () {
    console.log("Hi, IMWeb");
}

從上我們可以看到，hello 函數可以照常運行，但是我們的 hi 函數就會報錯了。根據報錯“Uncaught TypeError: hi is not a function”，我們知道 hi 不是 function 了，那又是什么呢？我們繼續使用 typeof 查看下：

console.log(typeof hello); // function
console.log(typeof hi); // undefined

function hello () {
    console.log("Hello the world");
}

var hi = function () {
    console.log("Hi, IMWeb");
}
function hello () {
    console.log("Hello the world");
}
var hi;

console.log(typeof hello); // function
console.log(typeof hi); // undefined

hi = function () {
    console.log("Hi, IMWeb");
}

通過 typeof 我們可以看到 hi 現在是個 undefined 了，這是為什么呢？

這是因為 JavaScript 解釋器中存在一種變量聲明被提升（hoisting）的機制，也就是說變量（函數）的聲明會被提升到當前作用域的最前面，即使寫代碼的時候是寫在最后面，也還是會被提升至最前面。

這樣上面的例子在執行的時候就成了這樣的：

這樣是不是一下就恍然大悟了。所以在實際開發的時候，一定要注意變量（函數）的聲明會被提升到當前作用域的最前面

云服務器 GPU云服務器函數的聲明c語言函數聲明聲明式函數提前聲明函數

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/92863.html

JS基礎篇--函數聲明與定義，作用域，函數聲明與表達式的區別

摘要：在中，有四種方式可以讓命名進入到作用域中按優先級語言定義的命名比如或者，它們在所有作用域內都有效且優先級最高，所以在任何地方你都不能把變量命名為之類的，這樣是沒有意義的形式參數函數定義時聲明的形式參數會作為變量被至該函數的作用域內。 Scoping & Hoisting 例： var a = 1; function foo() { if (!a) { var ...

TerryCai 2019-08-21 10:41 評論0 收藏0
JavaScript—— 函數聲明和函數表達式有什么不同嗎？

摘要：函數聲明和函數表達式的區別函數聲明只能出現在程序或函數體內。所以，在等語義為語句的代碼塊中存在函數聲明，由于函數提升特性，會破壞掉原本的語義。這篇談一下JS函數聲明與函數表達式的區別及要注意的地方：函數聲明主要有兩種類型：函數聲明 function fn() {}; 函數表達式 var fn = function () {}; 這兩種函數創建方式...

FleyX 2019-08-20 16:36 評論0 收藏0
函數聲明與函數表達式的區別

摘要：函數聲明函數聲明的語法說明函數聲明最重要的特征就是函數聲明提升，意思是在執行代碼之前就會讀取函數聲明例子不會報錯，因為函數聲明在在函數之前已經讀取函數表達式函數表達式的語法說明用函數表達式定義的函數在使用之前必須先賦值例子報錯，函數調用之前 1.函數聲明函數聲明的語法： function functionName(arg0,arg1...) { //functionBody ...

Karrdy 2019-08-19 17:57 評論0 收藏0
函數聲明與函數表達式的區別

摘要：，在這里的將所有的函數聲明進行了提升，從而由替代了函數表達式的在順著條件判斷進行了定義，執行為的情況，進行賦值解析。函數聲明（funDeclaration）無論在哪兒定義函數,只要是外層函數并且滿足不被包裹，就都可以進行全局范圍的調用 function foo() { } 在函數體內部的函數聲明無法提升到全局，只能提升到函數體內頂部(塊級作用域空間) function test()...

浠ラ箍 2019-08-22 15:50 評論0 收藏0
js中函數聲明與函數表達式的區別以及立即執行函數

摘要：最近在寫代碼時遇到了閉包，其中閉包又和立即執行函數有點關系，于是牽扯除了函數聲明以及函數表達式，我感覺中文的很多文章寫的不太好，查閱了的指南和這篇關于的文章，覺得寫的很好，整合一下。函數聲明和函數表達式。最近在寫代碼時遇到了閉包，其中閉包又和立即執行函數（immediately invoked function expression, aka IIFE)有點關系，于是牽扯除了函數聲明...

madthumb 2019-08-23 10:26 評論0 收藏0