javascript - map与forEach的嵌套遍历，如何返回一个数组?

Question

应用场景 一个表格的过滤筛选，可能涉及多个筛选条件，this.filter里面存的是所有筛选条件的v-model状态的一个对象，this.tableData是从后端获取的所有原始表格数据的数组，this.filteredTableData是过滤后的表格...

漂亮男人 · Answer

直接用 [].filter 啊...

伊谢尔伦 · Answer

题主的问题有点难懂
若想把map转为数组
只需要输入 [...map] 即可

PHP中文网 · Answer

filter更为恰当。

另外，加一个变量就会影响性能的观点从何而来。不要在还没出现任何性能问题之时就靠猜测它会有性能问题。

要么你就用普通的for循环代替，要么你就得在forEach外面定义一个bool值来判断。

phpcn_u1582 · Answer

我之前遇到过使用 map 和 forEach 带来的问题，后来都合理的使用 for...in 和 for...of 来解决掉了，你是不是可以换一下思路，不一定要用 map 和 forEach 来解决。

習慣沉默 · Answer

不要再forEach里用this

filterTableData() {
      var that = this;
      this.filteredTableData = this.tableData.map((item, index) => {
        Object.keys(that.filter).forEach(key => {
          if (that.filter[key] && item[key] && item[key] === that.filter[key]) {
            console.log(item)
            return item
          }
        })
      })
      console.log(this.filteredTableData)
      // this.paginateTableData()
    },

巴扎黑 · Answer

我回答你数组里都是undefined的问题吧。

你在map函数里没有return 当然就不会有返回值啊，没有显示的返回值当然是undefined。

相当于你遍历的结果没有返回做了无用功。

map的回调函数不应该这么写么？

(item, index) => {
    return Object.keys(this.filter).forEach(key => {
        if (this.filter[key] && item[key] && item[key] === this.filter[key]) {
            console.log(item)
            return item
        }
    })
}

当我没有回答吧，又看了一遍，你是知道这个问题的。return Object.keys(this.filter) 对你这来说没有意义。

还是需要使用个中间变量的，如：

this.filteredTableData = this.tableData.map((item, index) => {
    var _item;
    Object.keys(this.filter).forEach(key => {
        if (this.filter[key] && item[key] && item[key] === this.filter[key]) {
            console.log(item)
            _item = item;
            // return item
        }
    })
    return _item
})

// 你要考虑声明变量的性能损失的话 可以在外层声明好 用完 释放掉。

var _item;
this.filteredTableData = this.tableData.map((item, index) => {
    Object.keys(this.filter).forEach(key => {
        if (this.filter[key] && item[key] && item[key] === this.filter[key]) {
            console.log(item)
            _item = item;
            // return item
        }
    })
    return _item
})
_item = null

漂亮男人 · Answer

不知道你是不是这个意思。

filterTableData () {
    this.filteredTableData = this.tableData.filter((item, index) => {
      return Object.keys(this.filter).some(key => this.filter[key] && item[key] && item[key] === this.filter[key])
    })
    console.log(this.filteredTableData)
    // this.paginateTableData()
}

应用场景

代码

问题