我如何用js函数回调

Question

我遇到回调问题主要是因为我不明白他们是如何工作的(或者应该工作).

我有我的功能:

function checkDuplicateIndex(values, callback) {
    $.ajax({
        type: "POST", 
        url: url, 
        data: "command=checkIndexAlbumTracks&" + values,
        dataType: "html",
        success: function(data){
            var returnValue = data.d;   
            callback(returnValue);
        }
    });
}

然后在提交事件中,如何正确调用checkDuplicateIndex以便我可以提醒()值？

Answer 1

这最终是一个很长的答案,所以我将尝试将其分成几部分.

Javascript中的函数

因此,在javascript中,函数是一个可以传递,分配给变量等的对象,就像任何其他数据类型一样.不同之处在于函数而不是文本,数字等字符串是等待执行的代码块.

对于从编程开始的人来说,这通常会让人感到困惑,因为通常在编写代码时,它会在您运行程序时执行.但对于功能而言,情况并非如此.当您在函数内部编写代码时,它会在您调用函数之前等待执行.如果不调用该函数,则永远不会执行代码.我们来看一个简单的例子:

function say_hello(){
  console.log('hello!');
}

你在这里看到的是一个函数声明.这意味着您正在创建一个函数,这是一个等待执行的代码块.如果您运行此代码,则不会将任何内容记录到控制台.现在让我们看一下函数调用.

function say_hello(){
  console.log('hello!');
}

say_hello();

所以在这里我们像以前一样声明函数,但在下面我们称之为.函数调用只是函数的名称,后跟打开和关闭的parens.如果函数接受参数,它们将在parens中,但现在不需要担心.如果你要运行这段代码,你实际上会看到hello!登录到控制台,因为函数被调用,它执行里面的代码.

异步代码

现在,让我们换档一秒钟.当你进行jquery ajax调用时,jquery会将大量代码抽象到库中.他们负责设置,将XMLHttpRequest其发送到您指定的位置,并收集结果,并以跨浏览器的方式执行此操作.但由于javascript是异步的,一旦ajax调用关闭,javascript就会在ajax调用之后继续执行代码,因为谁想要等待别人的服务器响应,而你仍然可以继续这项工作.所以,如果你发射这样的东西:

$.ajax({
  url: 'http://google.com',
  success: function(){ console.log('done!') }
});

console.log('after ajax call');

...您可能会惊讶地发现它after ajax call 在记录之前记录done!.这是因为,如前所述,处理I/O的 javascript调用通常是异步的.

因此,如果进行ajax调用并且即使ajax调用尚未完成它立即继续执行代码,我们如何指定将在完成时运行的代码？这是一切都在一起的地方.通过为jquery提供一个函数,我们记得这是一个未执行的代码块,我们可以为自己编写一个方法来编写只有在ajax调用完成后才执行的代码,方法是将未执行的代码块传递给jquery并说明一点"嘿jquery,拿这个代码,当ajax调用完成后,调用它并传入你从中获取的任何数据." 多方便啊!

我们这样做的方式是通过success和error的性质在jQuery的AJAX功能.如果请求成功,它将调用我们传递给的函数success,我假设您可以猜测如果出现错误会发生什么.

把它放在一起

异步代码和第一类函数是关于javascript的两个最令人困惑的部分,一旦你理解了这两个概念,你就会处于一个很好的位置,虽然它可能需要一段时间才能实现.所以仔细考虑它并进行实验是很重要的.让我们通过几种方式来讨论你正在使用的例子,关于jquery ajax.

首先,我们可以尝试创建自己的函数并将函数的名称传递给成功处理程序.然后当它返回时,它将调用该函数.让我们来看看:

var my_callback = function(data){
  console.log(data);
}

$.ajax({
  url: 'http://google.com',
  success: my_callback
});

这是一种有趣的方式.这里我们为变量分配了一个匿名函数,然后将变量名称传递给成功处理程序.这样可以正常工作.现在让我们尝试另一种方式:

function my_callback(data){
  console.log(data);
}

$.ajax({
  url: 'http://google.com',
  success: my_callback
});

在这里,我们定义一个命名函数并执行相同的操作.这将以相同的方式工作.javascript中的命名函数实际上可以在使用后声明,因此您可以在ajax调用下移动函数声明,它仍然可以工作.试试吧.这对于命名函数来说是一个很好的优势.

最后,我们来看看我们可以处理它的第三种方式:

$.ajax({
  url: 'http://google.com',
  success: function(data){
    console.log(data);
  }
});

在这里,我们在成功处理程序上内联定义一个匿名函数.这与其他两个选项完全相同.在所有这三种方式中,jquery接收一个函数声明,并在需要时调用它,这是在ajax请求返回之后.

我知道这是一个超级长的答案,但你都搞不清这里有一些JavaScript的核心概念,我认为这将是更有帮助这里投奔他们,而不是只解决您的问题,给你答案,而无需解释概念.事实上,我根本没有在这里解决你的问题,但是在理解了这些概念之后你很容易就能自己解决它.如果您仍然遇到问题,请发表评论,我会尝试澄清更多内容.