使用函数声明

时间:2018-01-30 15:07:54

标签: javascript

我看到使用函数表达式声明闭包而不是函数声明。作为java脚本的新手,我有以下查询。我尝试引用类似的问题,但它没有帮助我。

  1. 总是需要使用函数表达式声明闭包 而不是功能定义
  2. 关闭需要自我调用 功能表达
  3. 我理解Function之间的关键区别 声明和函数表达式id提升。谁能帮我 什么时候和哪种情况我应该决定我是否应该去 函数声明或函数表达式。使用其中任何一个的其他优点和缺点是什么
  4. 抱歉,以前可能会回答一些问题,或者说基本的问题,但是我对此感到困惑

    下面是我使用函数声明完成的示例,但它没有给我正确的结果

    
    
    function counter() {
    var count = 0;
    	return function() { return count++; }
    }
    
    <!-- using function declaration -->
    
    <button onclick="alert(counter())">Counter</button>
    &#13;
    &#13;
    &#13;

    &#13;
    &#13;
    var counter = (function() {
      var count = 0;
    	return function() { return count++; }
      increment();
    })();
    &#13;
    <button onclick="alert(counter())">Counter</button>
    &#13;
    &#13;
    &#13;

2 个答案:

答案 0 :(得分:1)

  

总是需要使用函数表达式声明闭包,而不是函数定义声明

没有。任何函数定义在关闭外部作用域变量时都会形成闭包。

通常在使用闭包时,我们想要对函数对象做一件事,所以我们只是将它作为表达式放在调用或赋值或返回语句中,而不是在前面声明它并且通过名字引用它。

  

闭包需要在函数表达式中自我调用

没有。大多数IIFE根本不是封闭式的。然而,它们经常为闭包定义提供范围。可以在任何类型的范围中创建闭包,即使在块范围内(使用let / const)。

  

我理解函数声明和函数表达式之间的关键区别是提升。使用其中任何一个有什么其他优点和缺点?

查看var functionName = function() {} vs function functionName() {}

  

任何人都可以帮助我何时以及在哪种情况下我应该决定是否应该使用函数声明或函数表达式。

每当使用函数表达式初始化变量声明时,只需使用函数声明。否则,您将主要使用函数表达式。

你的例子与这个问题没什么关系。

之间没有区别
function makeCounter() {
    var count = 0;
    return function increment() { return count++; }
}

function makeCounter() {
    var count = 0;
    function increment() { return count++; }
    return increment;
}

除了第一行更短。当然,你必须这样做

var counter = makeCounter(); // assigns increment function to counter
counter(); // calls increment

算什么。在您的IIFE版本中,您只需将makeCounter内联为函数表达式:

var counter = (function makeCounter() {
    var count = 0;
    return function increment() { return count++; }
    // increment(); - this statement is never evaluated
})();
counter();

答案 1 :(得分:0)

  

封闭

根据this定义,闭包只是函数和声明函数的词法环境的组合。

在您的情况下,您声明了一个返回子函数的函数计数器。这意味着当您运行counter()时,它将返回一个具有词法范围的计数器的函数引用。您需要调用该函数引用来增加计数器。

var counterRef = counter();

<button onclick="alert(counterRef())">Counter</button>  将适用于你的情况。