深入解析jQuery中Deferred的deferred.promise()方法

理解 jQuery 中的 deferred.promise() 方法与 .promise() 实例方法的差异

在 jQuery 中，deferred.promise() 和 .promise() 这两个 API 虽然语法相似，但实则存在重大差异。deferred.promise() 是 Deferred 实例的一个方法，它返回一个 Deferred.Promise 实例。这个 Deferred.Promise 对象可以被看作是一个 deferred 对象的“视图”，它只包含观察 deferred 对象状态的方法，如 done(), then(), fail(), isResolved(), isRejected(), always() 等。这些方法只能观察 deferred 的状态，无法更改其内在状态，非常适合用于 API 的封装。

举个例子，想象一下一个 deferred 对象的持有者根据自己的需要控制 deferred 的状态（已解决或已拒绝），并将这个 deferred 对象的 Promise 对象返回给其他观察者。这些观察者只能绑定状态变化的回调函数进行观察，而无法更改 deferred 对象的内在状态，从而起到了隔离和保护的作用。

关于 deferred.promise() 的使用，下面是一个示例：

```javascript

$(function(){

var deferred = new $.Deferred(); // 新建一个 deferred 对象

var promise = deferred.promise(); // 获取 deferred 对象的 Promise

var doSomething = function(p) {

p.done(function(){

alert('deferred resolved.');

});

};

deferred.resolve(); // 解决 deferred，触发 done 回调

doSomething(promise); // 执行 doSomething 函数，弹出警告框

});

```

deferred.promise() 还可以接受一个 object 参数。传入的 object 将被赋予 Promise 的方法，并作为结果返回。这样做的目的是允许我们在现有的对象上添加 Promise 的功能。例如：

```javascript

var obj = {

hello: function(name) {

alert("Hello " + name);

}

};

var defer = new $.Deferred();

defer.promise(obj); // 将 obj 设置为一个 Promise

defer.resolve("John"); // 解决 deferred，触发 obj 的 done 回调

obj.done(function(name) {

this.hello(name); // 将弹出 "Hello John"

}).hello("Karl"); // 直接调用 hello 方法，将弹出 "Hello Karl"

```

关于 deferred.promise() 的作用，重要的是要理解它并不能保证 deferred 对象的状态不变。它的主要作用是阻止其他代码改变这个 deferred 对象的状态。通过 deferred.promise() 返回的 deferred promise 对象没有 resolve、reject、progress 等改变状态的方法，你只能使用 done、then、fail 等方法来添加处理函数或判断状态。

```javascript

// 定义wait函数来模拟异步任务

var wait = function() {

var dtd = new $.Deferred(); // 在函数内部创建Deferred对象

var tasks = function() {

alert("执行完毕！"); // 模拟任务完成时的操作

dtd.resolve(); // 改变Deferred对象的执行状态为已完成

};

setTimeout(tasks, 5000); // 使用setTimeout模拟异步任务

return dtd.promise(); // 返回Promise对象，允许外部添加处理成功的回调函数和处理失败的回调函数

};

// 使用wait函数并处理结果状态

$.when(wait()) // 注意这里的括号内只调用wait函数，不需要传入任何参数

.done(function() { alert("哈哈，成功了！"); }) // 添加处理成功的回调函数

.fail(function() { alert("出错啦！"); }); // 添加处理失败的回调函数

```

现在关于文章提到的几个问题，当我们把Deferred对象暴露出来或者在调用`wait`函数后改变其状态时，可能会引发一些预期之外的行为。为了避免这种情况，我们应该遵循上述模式，在函数内部创建和管理Deferred对象的状态，并返回Promise对象供外部代码使用。这样确保了代码的可预测性和安全性。关于`.promise()`方法的说明是正确的，它是jQuery实例的方法，用于处理一组类型的动作完成后返回一个Promise对象供事件监听器使用。关于jQuery中的Promise方法

Promise方法是一个强大的工具，它允许我们在处理异步操作（如动画）时更加灵活地处理回调。这个方法接受两个可选参数：type和target。其中，type是队列的类型，默认值为fx，主要用于指定jQuery对象的动画。target则是要赋予Promise行为的对象。这两个参数目前主要用于动画的监控，在动画完成后执行特定的操作。

在缺乏动画效果的情况下，Promise对象会立即返回一个已解决的状态。例如，当我们创建一个div元素并对其进行promise处理后，我们可以立即触发done方法。此时的alert会立即显示这个div元素，并且arg1也等于这个元素。

而在涉及到动画效果时，Promise的使用则更为出色。比如在一个HTML页面中，我们有一系列的div元素，每个div都有淡入淡出的动画效果。当我们点击一个按钮时，这些div会依次进行动画。在此过程中，我们可能希望在所有的div都完成动画后执行某些操作。这时，我们就可以使用$("div").promise().done()来实现。当所有的div都完成动画后，我们会看到页面上的提示信息变为"Finished!"。

Promise方法为我们提供了一种优雅的方式来处理异步操作，特别是在处理复杂的动画序列时。它允许我们在特定的时间点（如所有动画完成后）执行某些操作，从而提高了代码的可读性和可维护性。

值得一提的是，除了默认的fx类型，目前尚未发现其他类型的type值。但这并不意味着未来不会有更多的应用场景。随着技术的发展和需求的增长，Promise方法的应用范围可能会进一步扩大。了解和掌握这个方法对于我们编写更高效的代码具有重要的意义。

以上就是关于jQuery中的Promise方法的和示例。希望这些内容能够帮助你更好地理解这个方法，并在实际项目中加以应用。也期待你在使用过程中不断发现新的应用场景和技巧，共同推动技术的发展。