【问题标题】:How to declare different functions in different conditions?如何在不同的条件下声明不同的函数?
【发布时间】:2017-03-30 10:05:53
【问题描述】:

另外,函数声明不应该出现在 块语句。例如,此代码不会按预期运行:

// Bad
if (condition) {
    function doSomething() {
    alert("Hi!");
  }
} else {
    function doSomething() {
    alert("Yo!");
  }
}

具体的工作方式因浏览器而异。最多 浏览器自动接受第二个声明而不评估 健康)状况; Firefox 评估条件并使用适当的 函数声明。这是 ECMAScript 中的灰色区域 规范,因此应避免。函数声明应该 只能在条件语句之外使用。这个图案是 Google JavaScript 样式指南中明确禁止。

我在《可维护的 JavaScript》第 42 页找到了这些词,它说在“if”语句中声明函数基本上是不允许的。那么在不同条件下声明不同函数的正确方法是什么?这本书没有给出这个问题的解决方案。

【问题讨论】:

  • 用默认情况定义函数,如果条件有效则覆盖它
  • 声明你的函数高于你的条件并在其中调用它们。
  • 请注意,它说“函数声明只能在条件语句之外使用。”

标签: javascript maintainability


【解决方案1】:

函数声明和函数变量总是被 JavaScript 解释器移动(“提升”)到其 JavaScript 范围的顶部。

来源:http://www.adequatelygood.com/JavaScript-Scoping-and-Hoisting.html

if/else 块不会创建新范围,这意味着该方法将不起作用。有很多方法可以处理这种情况,其中一些是:

1 - 在函数定义内部添加if (condition)

function doSomething(){
  var condition = .......
  if (condition) { ... }
  else { .... }
}

2 - 向函数发送参数以了解要使用哪个实现(以防发现条件值不适合函数内部)。

function doSomething(condition){
  if (condition) { ... }
  else { .... }
}

3 - 有两个函数做不同的事情,并根据条件调用一个或另一个。

if (condition) doSomething()
else doOtherThing()

【讨论】:

    【解决方案2】:

    您可能希望更好地设计代码,例如接受函数中的参数以在不同情况之间切换或拥有完全独立的函数。

    一种解决方法是在 if 块之前声明这两个函数,并将您需要的函数分配给一个常量并在您需要的地方调用该常量:

    function doSomething1() {
      alert("Yo!");
    }
    
    function doSomething2() {
      alert("Hi!");
    }
    
    const doSomething;
    
    if (condition) {
      doSomething = doSomething1
    } else {
      doSomething = doSomething2
    }
    
    doSomething()
    

    但同样,这不是一个好的模式,也不是一个经过充分研究的代码

    【讨论】:

      【解决方案3】:

      你的想法不正确。只需声明您的功能。声明函数只是创建它。是否使用它取决于您。它只是说不要尝试有条件地创建函数。使用

      if 语句

      调用或不调用函数。不要用它们来决定要不要

      创建函数

      【讨论】:

        【解决方案4】:

        您可以使用 function expression 并将所需的函数分配给变量。

        var doSomething = condition ?
                function () { alert("Hi!"); } :
                function () { alert("Yo!"); };
        

        【讨论】:

          猜你喜欢
          • 1970-01-01
          • 2013-03-05
          • 2022-09-22
          • 2014-04-02
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          相关资源
          最近更新 更多