javascript - jquery 当() : different behaviour for one vs multiple thenables

Question

jQuery.when()可用于在 thenable 对象完成时执行回调。

我发现它很有用，因为它可以对多个 thenable 对象进行分组:

promise1.then((v1)=>{
  promise2.then((v2)=>{
    promise3.then((v3)=>{
      // arrow pattern ... 
    })         
  })
})

// converts to
$.when(promise1, promise2, promise3)
.done((v1, v2, v3)=>{
  // yay, nice and flat
});

但现在我发现当我提供一个与多个 thenable 时，该函数的行为有所不同。在多个 thenable 的情况下，when() 似乎记录了附加信息，实际返回可通过 v1[0] 访问。

我已经设置了一个 fiddle :https://jsfiddle.net/xpvt214o/989940/

HTML:

<ul>
<li><div id="result1"></div></li>
<br>
<li><div id="result2"></div></li>
</ul>

JS:

$.when(
    $.get("https://httpbin.org/get")
).done((v1)=>[
  $("#result1").html(v1["url"])
])

$.when(
    $.get("https://httpbin.org/get"),
    $.get("https://httpbin.org/get")
).done((v1, v2)=>[
  $("#result2").html(v1[0]["url"])
])

Answer 1

这有点奇怪，因为 $.ajax.then() 有多个参数，而 $.when 仅当有多个 Promise 时才会返回所有这些参数。传入

一种解决方法是为每个请求添加 then()

$.when(
    $.get("https://httpbin.org/get").then(d=>d),
    $.get("https://httpbin.org/get").then(d=>d)
).then((v1, v2)=>{
  console.log(v1["url"])
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

或者使用 Promise.all() 忽略 $.ajax.then()

的辅助参数

Promise.all([$.get("https://httpbin.org/get"), $.get("https://httpbin.org/get")])
  .then(res => console.log(res[0].url))

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>