JS中用函數(shù)聲明和函數(shù)表達式兩種方式創(chuàng)建函數(shù)的區(qū)別

liangzai_cool 發(fā)布于2019-08-20 18:19 / 2723人閱讀

摘要：在中創(chuàng)建函數(shù)的方式有很多種，本文主要講解函數(shù)聲明和函數(shù)表達式兩種方式創(chuàng)建函數(shù)的區(qū)別上面是這兩種方法創(chuàng)建函數(shù)的格式他倆的區(qū)別主要在對待對待這兩種方式的處理方式上，前者看作函數(shù)，后者為變量。

在JS中創(chuàng)建函數(shù)的方式有很多種，本文主要講解函數(shù)聲明(function declaration)和函數(shù)表達式(function expression)兩種方式創(chuàng)建函數(shù)的區(qū)別.

function add1(a, b) {
    return a + b;
}  //  function declaration

var add2 = function(a, b) {
    return a+b;
};  // function expression

上面是這兩種方法創(chuàng)建函數(shù)的格式
他倆的區(qū)別主要在對待JS對待這兩種方式的處理方式上，前者看作函數(shù)，后者為變量。JS在執(zhí)行代碼的時候，會有一個叫做Hoisting的操作，Hoisting的結果，把對那些變量和函數(shù)進行預處理，把他們放在前面了，而變量只放過去變量名，函數(shù)卻都被放過去了。比如我們看下面代碼來理解一下。

console.log(a);
var a = "1";
console.log(a);   //  undefined  1;

而對于函數(shù)

    console.log(a());
    function a() {
        console.log("lol");
    }
    console.log(a());  // lol  lol;

從上面可以看出，雖然變量和函數(shù)都被Hoisting，但是處理的方式卻是不同的，把這個處理方式應用到上面兩種函數(shù)聲明上面，第一種被看過函數(shù)，第二種被看作變量，那區(qū)別就很顯然了：第二種函數(shù)的聲明必須在函數(shù)調(diào)用的前面，第一個則無需這樣。我們再來看最后一個例子：

var result1 = add1(1, 1);
function add1(n1, n2) {
    return n1 + n2;
}

var result2 = add2(1,1)
var add2 = function(n1, n2) {
    return n1 + n2;
};
result1   // 2
result2  //  undefined

幫到你了嗎？

GPU云服務器云服務器存儲過程和函數(shù)的區(qū)別函數(shù)的聲明c語言函數(shù)聲明聲明式函數(shù)

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

轉載請注明本文地址：http://systransis.cn/yun/84336.html

JavaScript—— 函數(shù)聲明和函數(shù)表達式有什么不同嗎？

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

FleyX 2019-08-20 16:36 評論0 收藏0
Javascirpt - 理解執(zhí)行上下文以及作用域鏈

摘要：本文章記錄本人在深入學習執(zhí)行上下文以及作用域鏈中看書理解到的一些東西，加深記憶和并且整理記錄下來，方便之后的復習。每個執(zhí)行上下文都與一個作用域鏈關聯(lián)在一起。該對象的屬性的值是它被創(chuàng)建時的執(zhí)行上下文對應的作用域鏈。本文章記錄本人在深入學習執(zhí)行上下文以及作用域鏈中看書理解到的一些東西，加深記憶和并且整理記錄下來，方便之后的復習。執(zhí)行上下文概念執(zhí)行上下文，是ECMAScript規(guī)法...

e10101 2019-08-21 10:30 評論0 收藏0
React 單文件組件的解決方案 Omil 和 Omi Snippets

摘要：屬性我們還可以使用來書寫樣式，它會自動幫我們編譯為格式內(nèi)容語法高亮建議使用配合該擴展支持語法高亮擴展開發(fā)項目，當然你可以把文件當作對待。 Omil 是什么？ Omil是一個 webpack 的 loader，它允許你以一種名為單文件組件(SFCs)的格式撰寫 Omi 組件： ${this.data.title} export default class { test(){...

lowett 2019-08-26 10:10 評論0 收藏0
前端基礎入門四（JavaScript基礎）

摘要：學習目標掌握編程的基本思維掌握編程的基本語法我們先來學習基礎，后續(xù)會講解高級。語句基本語法當循環(huán)條件為時，執(zhí)行循環(huán)體，當循環(huán)條件為時，結束循環(huán)?；A語法循環(huán)體循環(huán)條件代碼示例初始化變量循環(huán)體自增循環(huán)條件語句和一般用來解決無法確認次數(shù)的循環(huán)。學習目標: 掌握編程的基本思維掌握編程的基本語法我們先來學習JavaScript基礎，后續(xù)會講解JavaScript高級。重點內(nèi)容變...

王軍 2019-08-30 15:55 評論0 收藏0
前端基礎入門四（JavaScript基礎）

摘要：學習目標掌握編程的基本思維掌握編程的基本語法我們先來學習基礎，后續(xù)會講解高級。語句基本語法當循環(huán)條件為時，執(zhí)行循環(huán)體，當循環(huán)條件為時，結束循環(huán)?；A語法循環(huán)體循環(huán)條件代碼示例初始化變量循環(huán)體自增循環(huán)條件語句和一般用來解決無法確認次數(shù)的循環(huán)。學習目標: 掌握編程的基本思維掌握編程的基本語法我們先來學習JavaScript基礎，后續(xù)會講解JavaScript高級。重點內(nèi)容變...

SnaiLiu 2019-08-23 14:50 評論0 收藏0