【问题标题】:Understanding callback function purpose了解回调函数的目的
【发布时间】:2017-12-20 13:24:24
【问题描述】:

我意识到这更像是一个一般性问题,但我已经阅读了此处的类似答案,但找不到更多概述。我是回调的新手,我正在尝试了解何时应该使用它们。

MDN 网络文档有这个例子;

function greeting(name) {
  alert('Hello ' + name);
}

function processUserInput(callback) {
  var name = prompt('Please enter your name.');
  callback(name);
}

processUserInput(greeting);

但是我很难看出这比下面的更有益,我没有将问候函数作为参数传递?

function greeting(name) {
  alert('Hello ' + name);
}

function processUserInput() {
  var name = prompt('Please enter your name.');
  greeting(name);
}

processUserInput();

【问题讨论】:

  • 更容易测试,更松散耦合,更接近单一职责原则的理想。
  • 因为你也可以传入一个函数来做一些除了警告名字之外的事情,比如console.log这个名字例子
  • 如果你想在知道他们的名字后提醒其他东西怎么办?
  • 这个例子的重点是非常简单,这样你就可以看到它是如何工作的。它不应该是回调如何有用的示例。
  • @George,这不能在我的第二个示例中的 greeting(name) 之后以及在第一个示例中的 callback(name) 之后实现吗?我已经阅读了一篇包含一些复杂回调的长篇文章,但是我试图弄清楚它们通常应该在什么时候使用。感谢您的回复,我会仔细阅读您的所有观点。

标签: javascript callback


【解决方案1】:

由于 Javascript 是异步的,有时很难处理来自非阻塞函数的响应,例如。如果您正在进行ajax调用,那么它将异步执行并稍后返回结果,届时主执行流程将传递ajax代码并开始执行以下语句,在这种情况下,很难捕捉到响应进一步处理。

为了处理这些情况,回调就出现了,您将一个函数作为参数传递给 ajax 函数,一旦返回响应,然后通过将响应数据作为参数传递来调用回调以进一步处理。

更多信息在这里http://callbackhell.com/

【讨论】:

    【解决方案2】:

    简单来说,您可以说回调是一种提前提出问题(或请求任务)的方式,即,当您完成此操作时(通常是处理结果)。重点是留出稍后要完成的功能,通常是因为您现在没有所需的输入来执行它们。 你的实现和 MDN 之间的两个主要区别是你的实现更难维护,也更难推理因此测试。

    1.维护/可重用性

    假设您将几千行代码写入代码库,然后您需要更改 processUserInput() 的功能。更改或编写新的回调函数比更改函数 processUserInput() 要容易得多。如果 processUserInput 稍微复杂一点,这将是显而易见的。这也意味着 MDN 在与您的实现不同的各种场景中更有用。您可以在不同的情况下重复使用它,例如说再见、大写名称等,只需编写不同的回调插入 processUserInput()。

    2。测试/更容易推理

    MDN 实现更容易理解。假设函数 processUserInput(greeting) 可能会返回一个问候语比假设 processUserInput() 所做的更容易。这使得测试更容易,因为您始终可以确保 MDN 实现在给定输入的情况下始终返回相同的输出。

    【讨论】:

      【解决方案3】:

      根据具体情况,回调可能非常有用;例如,在使用 JavaScript 开发 Google Chrome 浏览器扩展程序时,一旦设置了回调,就可以使用回调来拦截 Web 请求。

      一般来说,回调的目的是让回调例程在触发器上执行——触发器是某种事件。通常,功能遵循链式 API 的接口。通过实现回调支持,您可以在操作的某个阶段重定向执行流。回调对于第三方开发人员在处理其他人的库时特别有用,具体取决于他们正在尝试做什么。把它们想象成一个通知系统。

      函数一般接受参数对灵活性和维护很有用。如果您对不同的事物使用不同的函数,则可以简单地一遍又一遍地重复使用这些函数以提供不同的功能——同时仍然可以防止一遍又一遍地使用或多或少相同的代码使源代码臃肿。同时,如果你在自己的库中使用函数,出现bug,你可以简单地为一个函数打补丁,然后就可以解决了。

      在您的示例中,您将回调例程传递给您正在调用的函数 - 您正在调用的函数将调用回调函数并传递正确的参数。这是灵活的,因为它允许您调用一个回调例程来打印变量的内容,另一个用于计算传入的字符串的长度,或者另一个用于在某处记录它,等等。它允许您重新使用您设置的函数,并使用正确的参数调用不同的函数,而无需重新制作原始函数。

      【讨论】:

        【解决方案4】:

        这个例子不适合理解回调

        在简单的语言中,当我们必须之后做一些事情或响应某些其他事件或函数或表达式时,会使用回调函数。 即当父函数完成执行时,回调被执行。

        简单示例

        function hungerStatus(status,cb){
            return cb(status)
        }
        function whatToDo(status){
            return status ? "order Pizza" : "lets play"
        }
        
        hungerStatus(false,whatToDo)
        

        另一个例子

        // global variable​
        ​var allUserData = [];
        ​
        ​// generic logStuff function that prints to console​
        ​function logStuff (userData) {
            if ( typeof userData === "string")
            {
                console.log(userData);
            }
            else if ( typeof userData === "object")
            {
                for (var item in userData) {
                    console.log(item + ": " + userData[item]);
                }
        ​
            }
        ​
        }
        ​
        ​// A function that takes two parameters, the last one a callback function​
        ​function getInput (options, callback) {
            allUserData.push (options);
            callback (options);
        ​
        }
        ​
        ​// When we call the getInput function, we pass logStuff as a parameter.​
        ​// So logStuff will be the function that will called back (or executed) inside the getInput function​
        getInput ({name:"Rich", speciality:"JavaScript"}, logStuff);
        

        参考callback exaplanation

        【讨论】:

          猜你喜欢
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 2016-12-22
          • 2014-05-04
          • 2019-04-01
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          相关资源
          最近更新 更多