Question

我有这个if if表达式过滤元素dogs[] courses[] departments[]里面第一个片段绝对按照我想要的方式工作但我的问题是它不可重用，方式是es5-ish。

第一段摘录

    if (item == 'dogs') {
      item = 'dogs';
      return this[`${item}`].filter(item => new RegExp(`^${data}`, 'gi').test(item));
    } else if (item == 'courses') {
      item = 'courses';
      return this[`${item}`].filter(item => new RegExp(`^${data}`, 'gi').test(item));
    } else if (item == 'departments') {
      item = 'departments';
      this.dept = this.deptControl.value;
      return this[`${item}`].filter(item => new RegExp(`^${data}`, 'gi').test(item.name));
    }

在这个片段中，我尽力缩短es5-ish代码，但deptartments[]不起作用，我想要的方式

第二段摘录

    item =
      item == 'dogs' ? 'dogs'
        : item == 'courses' ? 'courses'
        : item == 'departments' ? 'departments' : '';

    return this[`${item}`].filter(item => new RegExp(`^${data}`, 'gi').test(item == 'departments' ? item.name : item));

并且此代码段中的department[]同样无法按我想要的方式运作

第3段摘录

    item =
     item == 'dogs' ? 'dogs'
        : item == 'courses' ? 'courses'
        : item == 'departments' ? 'departments' : '';

    // let patch = item == 'departments' ? item.name : item;
    let patch = item == 'departments' ? item['name'] : item;

    return this[`${item}`].filter(item => new RegExp(`^${data}`, 'gi').test(patch));

请帮助我如何使用三元运算符在departments[]块中解决我的问题，而不是旧样式if..else

Answer 1

只需在过滤器中使用其他变量名称，例如x：

return {dogs:1,courses:1,departments:1}[item] ? this[item].filter(x => 
        new RegExp(`^${data}`, 'gi').test(item == 'departments' ? x.name : x))
    : undefined;

Answer 2

如果你在某个部门设置了一个值，我想也许这里的switch声明会很好。这样的事情怎么样？

const testItem = (items, data) => {
  return items.filter(item => new RegExp(`^${data}`, 'gi').test(item))
}

switch (item) {
  case 'dogs':
  case 'courses':
    return testItem(this[item], data)
  case 'departments':
    this.dept = this.deptControl.value
    return testItem(this[item], data)
}

这是我的建议，原因如下：

为人而不是计算机编写代码。更易读和可维护的解决方案是更好的解决方案。
D on R epeat Y 我们自己 - 尝试将常用操作放入较小的功能中（这不仅更易于维护，但是翻译可以做出更好的优化）

注意如何重用testItem函数，并且当item是狗或课程时执行相同的指令。此外，尽管此示例没有任何相等运算符，但您应该在Javascript中使用===而不是== :)（我知道，它令人困惑......）

Javascript三元运算符链接错误

2 个答案: