纯现代javascript中的调试数组方法链中间结果 我想在方法链的中间看到数组的状态： arr.filter(...) .flatMap(...) .map(...) .sort() // fyi, sort returns the sorted array // say I want to see the array content at this point .map(...) .slice(0, 10)

我可以通过在下划线JS中使用

tap（）

函数来实现这一点，如中所述。但我想在不使用任何库的情况下进行此操作

---

我浏览了一遍，它似乎没有类似于

tap

功能的功能。有什么解决办法吗？

自己写一个：

// Be careful when overriding the default prototype, it might cause other code to fail or is a performance nightmare
Object.defineProperty(Array.prototype, "log", {
  enumerable: false, // < make sure it doesnt suddenly appear somewhere (defaults to false though)
  value(name) {
    console.log(name, this);
    return this; // < enable chaining
  },
});

[1, 2, 3].filter(it => it > 1).log("after filtering");

或者，如果您想用最少的代码实现这一点，只需执行以下操作：

const log = (...mutations) => arr => mutations.reduce((prev, op) => (it => (console.log(it), it))(op(prev)), arr);

log(
 it => it.map(n => n + 1),
 it => it.filter(it => it > 2)
)([1, 2, 3, 4])

---

你自己写一个就行了：

// Be careful when overriding the default prototype, it might cause other code to fail or is a performance nightmare
Object.defineProperty(Array.prototype, "log", {
  enumerable: false, // < make sure it doesnt suddenly appear somewhere (defaults to false though)
  value(name) {
    console.log(name, this);
    return this; // < enable chaining
  },
});

[1, 2, 3].filter(it => it > 1).log("after filtering");

或者，如果您想用最少的代码实现这一点，只需执行以下操作：

const log = (...mutations) => arr => mutations.reduce((prev, op) => (it => (console.log(it), it))(op(prev)), arr);

log(
 it => it.map(n => n + 1),
 it => it.filter(it => it > 2)
)([1, 2, 3, 4])

---

您必须自己编写，或者使用调试器。这是一个快速的模型

Array.prototype.log=（…args）=>（console.log（this，args），this）

如果

arr

相对较小，您可以将

.foreach（item=>console.log（item））

添加到链中的任何一点，并在控制台的新行上查看每个数组项。@a.Lamansky

。foreach

返回

未定义的
，但在
之后它将无法链接。foreach
@cakraw您是对的，我忽略了这个细节，但它确实使
forEach
在这种情况下毫无用处。但是，您可以使用带有显式返回的
.map
来实现相同的效果，但代价是稍微增加一些代码：
.map（item=>{console.log（item）；returnitem}）。您必须自己编写，或使用调试器。这是一个快速的模型
Array.prototype.log=（…args）=>（console.log（this，args），this）
如果
arr
相对较小，您可以将
.foreach（item=>console.log（item））
添加到链中的任何一点，并在控制台的新行上查看每个数组项。@a.Lamansky
。foreach
返回
未定义的
，但在
之后它将无法链接。foreach
@cakraw您是对的，我忽略了这个细节，但它确实使
forEach
在这种情况下毫无用处。但是，您可以使用带有显式返回的
.map
来实现相同的效果，但代价是稍微增加一些代码：
.map（item=>{console.log（item）；returnitem}）。第一个就是我要找的！对于更一般化的
tap
-like函数，它应该是：
Object.defineProperty（Array.prototype，“tap”，{value（f）{f（this）；返回this；}）
并像
[1,2,3]那样使用它。点击（console.log）.filter（it=>it%2==1）
第一个就是我要找的！对于更一般化的
tap
-like函数，它应该是：
Object.defineProperty（Array.prototype，“tap”，{value（f）{f（this）；返回this；}）
并像
[1,2,3]那样使用它。点击（console.log）.filter（it=>it%2==1）