$(...).. map(...).reduce不是函数

Question

我正在尝试使用map&reduce计算页面中几个元素的高度之和.由于未知原因,这给我带来以下异常:

VM52933:2未捕获的TypeError:$(...).map(...).reduce不是函数(...)

$('.items')
    .map( (index,slide) => $(slide).height() )
    .reduce( (prev, next) => prev + next, 0 )

.map返回一个有效的数组:

[48, 48, 48, 75, 48]

如果我单独做地图([48,48,48,75,48] .reduce(...))它的工作原理.我在这做错了什么？

Answer 1

这是因为当你执行$('.items')时它是一个类似数组的数组而不是数组.如果您看到原型itof NodeList类型ad,它就没有reduce方法.如果从Array.from传递它,那么它会将其转换为正确的数组,您将能够应用reduce,map和所有其他数组函数.

更多细节可以在

做点什么

Array.from($('.items'))
.map( (slide) => $(slide).height() )
.reduce( (prev, next) => prev + next, 0 );

而不是(有点)笨重的`Array.from($(selector))`,你也可以写`$(selector).toArray()`,所以归结为:`$('.items') .toArray().map(el => $(el).height()).reduce((a,b)=> a + b,0);` (3认同)