我正在学习“学习 jQuery”(第三版)。

在第 4 章:“操作 DOM”中，有一节解释了称为“Value Callback”的东西。这对我来说是新的。

作者通过链接列表的示例对此进行了解释，其中每个链接的 ID 必须是唯一的。

摘自本书:

"A value callback is simply a function that is supplied instead of the value for an argument. This function is then invoked once per element in the matched set. Whatever data is returned from the function is used as the new value for the attribute. For example, we can use this technique to generate a different id value for each element, as follows:"

Chaffer, Jonathan (2011-09-23). Learning jQuery, Third Edition (p. 116). Packt Publishing. Kindle Edition.

jQuery(document).ready(function($){

// get all external links
   $('div.chapter a').attr({
        rel:'external',
        title:'Learn more at Wikipedia',
        id: function ( index, oldValue ) {
                return 'wikilink-' + index;
        }
    });
})

工作起来很有魅力，但 id: 属性的机制让我无法理解。

1. 参数 1(索引)如何知道是一个整数？
2. 函数如何知道增加索引？
3. 第二个参数 (oldValue) 如何知道保存属性的旧值(修改前)？
4. 这是一个 jQuery 结构吗？一个 JSON 的东西？这个很酷。它有效，但是......这个“值(value)回调”东西到底是什么的？

请指教

最佳答案

1) How does parameter 1 (index) know to be an integer?

jQuery 传递一个整数。

2) How does the function know to increment index?

回调不会增加 index，jQuery 方法会。

3) How does the second parameter (oldValue) know to hold the old value of the property (before modification)?

jQuery 传递它。

问题 1-3 的答案可能最好通过执行类似于 $.attr 的函数来理解:

Array.prototype.each = function (f) {
    var i;
    for (i=0; i < this.length; ++i) {
        f(i, this[i]);
    }
};

['zero', 'one', 'two'].each(function (i,item) {console.log({i: item})});

f 是一个回调。 each 负责遍历集合并为每个索引和项目调用 f。相同的代码结构可用于函数:

/* Map each item in a sequence to something else, 
 * returning a new sequence of the new values.
 */
Array.prototype.map = function (f) {
    var i, result = [];
    for (i=0; i < this.length; ++i) {
        result[i] = f(i, this[i]);
    }
    return result;
};

['zero', 'one', 'two'].map(function(i,item) {return item.length});
// result: [4, 3, 3]

/* Return a sequence of the items from this sequence 
 * for which 'keep' returns true.
 */
Array.prototype.filter = function (keep) {
    var i, result = [];
    for (i=0; i < this.length; ++i) {
        if (keep(i, this[i])) {
            result.push(this[i]);
        }
    }
    return result;
};

['zero', 'one', 'two'].filter(function(i,item) {return item.length <= 3});
// result: ['one', 'two']

mapconcat 的实现，foldl and foldr留作练习。作为另一个练习，根据 each 重写 map 和 filter。

请注意，这些函数仅用于说明回调的工作原理。它们可能会导致生产代码出现问题。

4) Is this a jQuery construct? A JSON thing? It's cool. it works, but ...what the heck is this "value callback" thing made of?

Callbacks是 jQuery 广泛使用的通用技术。它们是 functional programming 的关键特征，其中函数是可以像其他数据类型一样进行操作的数据。因此，您拥有将函数作为参数并可以返回函数的函数。在某些情况下，callbacks也被称为“延续”，构成了 continuation passing style 的基础(CPS)。这对于 asynchronous function calls 尤为重要[ 2 ] (函数在计算完成之前返回，而不是 synchronous calls )，例如用于 Ajax 请求。要了解 CPS 的一些功能，请阅读 "Use continuations to develop complex Web applications" .

另一方面，“值回调”中的“值”，由于 JS 是一种动态类型语言(类型与数据相关联，而不是变量)，形式参数可以绑定(bind)到任何对象类型。然后，函数可以根据传递的内容进行不同的行为。有时这是通过检查参数的类型来实现的，这实际上是 ad-hoc polymorphism (函数，而不是语言，必须处理分派(dispatch))。然而，parametric polymorphism或(否则)duck typing应该始终优先于检查参数类型。参数多态性是通过确保可以传递给给定函数的所有类型都支持相同的接口(interface)(方法名称、参数、前提条件、后置条件等等)来实现的。例如，所有的序列类型都应该有一个length 属性并且由整数索引；只要它成立，您就可以将自己的序列类型与许多采用数组的函数一起使用。

我不确定您所说的 JSON 是什么意思，但它可能不是通常的意思。 JSON 是一种基于有限版本的 JS 对象文字语法的数据交换格式。示例代码或引用文本中的任何地方均未涉及 JSON。

关于javascript - jQuery:什么是 "Value Callback"？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/11302862/