2017-10-15 76 views
1

我是一名自學前端網頁開發的平面設計師。我完成了關於HTML和CSS的全部閱讀。現在我正在閱讀有關JavaScript的文章,特別是Marijn Haverbeke(2011)的一本名爲Eloquent JavaScript的書。在功能關閉的話題,他給出了這樣的例子,不多解釋:在JavaScript中的一個參數中強制使用兩個值?

function makeAdder(amount) { 
    return function(number) { 
     return number + amount; 
    }; 
} 

var addTwo = makeAdder(2); 
addTwo(3); 
-> 5 

我不明白這裏是可變number如何給出一個值,當它是一個匿名函數function(number)內的體內功能makeAdder()makeAdder()函數只接受一個參數amount。這在makeAdder(2)中給出值「2」,是一個可變定義addTwo

但後來變量addTwo被執行,就好像它是一個函數,並給出了不同的值3.現在真正奇怪的是,如何賦予addTwo函數3的值在某種程度上被用於嵌套函數體number + amount用於可變number,與量的(2),最後用的5

+0

基本上,當調用'makeAdder(2)'時,它只是返回一個新函數,該函數知道_amount_(設爲2)的值。然後用3作爲參數調用新創建的函數。此時'addTwo'可以和_number + amount_(3 + 2)。 如果你在不帶參數的情況下調用'makeAdder()',那麼當你嘗試'addTwo(3)'時,它將返回'NaN',因爲'addTwo'的_amount_的值爲'undefined'(_3_ + _undefined_ = _NaN_)。 – aUXcoder

回答

0

3 ways to define a javascript class

Javascript.Info class

W上的最終值結束值將它添加如果您打電話給makeAdder,它實際上取值爲amount,將它放入金額變量中,並且返回函數。它尚未評估內部返回的函數。

然後,當您調用addTwo時,它會將您的參數number傳遞給內部函數,然後評估內部函數並返回響應。

在您的代碼中添加console.log語句會清楚地分配和調用執行順序。 當您調用外部函數時,它的行爲就像創建一個makeAdder對象一樣。

我稱它爲一個類,因爲類是通過函數關鍵字,IIFE等在JavaScript中創建的。當您創建一個makeAdder類的對象時,您指定了一個值爲2的成員變量amount。

由於此變量保留在類的對象內,並將函數返回到makeAdder的對象範圍內,因此可以返回功能。當您計算返回的函數時,成員變量.is的值可用於內部函數。當評估內部函數時,它會從類的對象中獲取成員變量的值,並從傳遞給它的參數中獲取數值。總結並返回結果。

function makeAdder(amount) { 
 
console.log("value assigned to amount is " + amount); 
 
    return function(number) { 
 
    console.log("value assigned to number is " + number); 
 
    return number + amount; 
 
    }; 
 
    } 
 

 
var addTwo = makeAdder(2); 
 
console.log("value assigned to amount, now calling inner function"); 
 
console.log(addTwo(3));

更新下:

我改變你的函數下面有點類兼容的結構。

  1. 當2值被傳遞給量時,外功能進行評價(在創建的新的類對象),2的值被設置爲成員變量this.amt從你所提供量的值(= 2)。

  2. 另一個函數是在這個對象內定義的。它被命名爲val,另一個功能。這只是定義,而不是評估。

  3. 我將val作爲函數從類的對象返回。所以,從對象返回一個函數,並且其成員變量this.amt已經有一個值。

  4. 我在下面調用this.val函數兩次。查看語法。爲什麼我可以直接用參數調用它?因爲它返回一個準備好被評估的函數。

    調用帶量= 2,數= 5, = 5

var a = function(amount) { 
 
     console.log("value assigned to amount is " + amount); 
 
    
 
     this.amt = amount; 
 

 
     this.value = function(number) { 
 
     console.log("value assigned to number is " + number); 
 
     return number + amt; 
 
     }; 
 
    
 
     return this.value; 
 
    } 
 
    
 

 
console.log(a(2)(5)); 
 
x = a(8); 
 
console.log(x(5));

看到下方的更清楚代碼段中的功能,然後用量= 8,數 1. ax被定義爲一個函數。它旨在用作課堂。

  • 它有一個成員變量amount和功能val最終計算numberamount和的總和,並返回總。

  • A new ax的對象被創建並分配給b。它使用默認值進行初始化。

  • 設定量可變的值作爲7.

  • 調用具有數參數Val函數爲8

  • 獲取結果15.

  • var ax = function() { 
     
          
     
          this.amount = 0; 
     
          
     
          this.val = function(number) 
     
          { 
     
          console.log("value assigned to number is " + number); 
     
          return number + this.amount; 
     
          } 
     
          
     
         } 
     
         
     
        var b = new ax(); 
     
        b.amount=7; 
     
        console.log(b.val(8)); 
     
    

    LAST SNIPPET

    1. 斧定義了一個函數。當你創建一個新的對象時,傳遞一個變量給它。

    2. 這給類的對象內的this.amount賦值,並不返回任何內容。

    3. 您可以通過傳遞一個參數並使用另一個來自成員變量數量的對象來調用此對象內的另一個函數。

    4. 您會得到結果。

    var ax = function(amt) { 
     
          
     
          this.amount = amt; 
     
          
     
          this.val = function(number) 
     
          { 
     
          console.log("value assigned to number is " + number); 
     
          return number + this.amount; 
     
          } 
     
          
     
         } 
     
         
     
        var b = new ax(6); 
     
        console.log(b.val(8));

    0

    這工作,因爲一些所謂的作用域:函數中的參數的功能,這意味着它可以在整個函數裏面使用範圍的(類似於一個變量聲明,可以在整個代碼庫中重用)。

    這實際上意味着參數amount在整個函數中都可用,即使在新函數中也是如此。

    你可以想想這樣的功能:

    function foo(n) { 
        return n + 2; 
    } 
    
    console.log(foo(5)); 
    
    // What you have done is basically equivalent to this function: 
    
    function foo() { 
        var n = 5; 
        return n + 2; 
    } 
    

    當你調用一個函數,它就像放置一個變量的函數裏面,然後執行它。當然,這會將7記錄到控制檯。這是怎麼回事

    function makeAdder(amount) { 
        return function(number) { 
        return number + amount; 
        }; 
    } 
    
    var addTwo = makeAdder(2); 
    
    // Turns into this: 
    
    function makeAdder() { 
        var amount = 2; 
        return function(number) { 
        return number + amount; 
        } 
    } 
    

    你可以有點看 - 因爲amount = 2,內部函數的計算結果爲:

    現在我們可以應用此makeAdder

    return function(number) { 
        return number + 2; 
    } 
    
    0

    告訴我,如果我理解這一點正確:

    代碼的執行從行開始:

    var addTwo = makeAdder(2); 
    

    此時,makeAdder()被執行,參數2被賦值給參數/變量'amount'。然後控件進入函數'makeAdder'的主體,因爲它會被調用,但是它突然返回的不是一個值,而是整個函數定義('function(number){..}')。在這一點上,makeAdder(amount)實際上變成了函數(number){...},因爲返回的只是一個函數定義而不是執行它,然後通過var定義傳遞給addTwo。在這一點上,addTwo成爲一個「虛擬」函數(數字){..},然後控件看到一個addTwo(現在是一個「虛擬」函數(數字))的執行,賦值爲3,然後傳入數字變量在「虛擬」功能()中。現在可以在函數體{return number + amount;}內進行加法運算,並生成5的總和。

    我真的覺得在這裏的驚人和有趣的(如果我理解的是正確的)是變量'量'是幸運的,因爲它的值不會被刪除當身體返回函數的定義(數字){.. } makeAdder(金額)。就好像他進入了一個變量'limbo',並且在函數(數字){..}稱之爲代碼世界時回到了代碼世界。我在這裏學到的是,控制系統以線性方式(不是完全即時地)在代碼內部的不同路徑(如軌道中的列車)上讀取代碼,並且一些變量可以通過機會或任何您稱之爲的方式自行保存「超額運行」。這是其他編程語言如何工作,或這是獨特的JavaScript?

    對不起,我的非程序員解釋它的方式,因爲我更容易以這種方式來理解它。

    +0

    我希望你知道類,對象和成員變量的概念。當你調用外部函數時,它的行爲就像創建一個makeAdder對象一樣。我稱它爲一個類,因爲類是通過函數關鍵字,IIFE等在JavaScript中創建的。當您創建一個makeAdder類的對象時,您爲成員變量賦值2。由於此變量保留在類的對象內,並將該函數返回到makeAdder的對象範圍內,因此它可用於返回的函數。當您評估返回的函數時,成員變量........ – Amit

    +0

    ......的值可用於內部函數。當評估內部函數時,它會從類的對象中獲取成員變量的值,並從傳遞給它的參數中獲取數值。總結並返回結果。 https://www.phpied.com/3-ways-to-define-a-javascript-class/ – Amit

    +0

    我已經更新了我的答案,以回答您在答案中提出的疑問,並且這是一個很長的答案。花一些時間來完成它。它會使這些事情變得非常清楚。 – Amit

    相關問題