Array.prototype.filter无法正常工作

时间:2019-09-15 19:45:40

标签: javascript algorithm filter async-await es6-promise

我正在使用 star wars API 制作示例应用程序,需要使用选择字段和html5中的按钮过滤数据。我有一个名为filterBySelections的函数,它使用array.filter。功能应:

  • 获取选择选项
  • 如果选择了一个选项,则从参数对象中查找所有内容。

我尝试使用array.includes来运行filter方法 使用array[index]中的arr.filter

 <select name="" id="option-1" tabindex="2">
      <option >CR90 Corvette</option>
      <option >V-wing</option>
      <option >Belbullab </option>
      <option >Starfighter</option>
      <option >Jedi Interceptor</option>
      <option >Star Destroyer</option>
      <option >Trade Fedaration Cruiser</option>
      <option >Solar Sailer</option>
      <option >Republic Attack Cruiser</option>
      <option >A-wing</option>
      <option >B-wing</option>
      <option >Naboo Figther</option>
      <option >Millenium Falcon</option>
    </select>

//lib.js

function filterBySelections(obj = []) {
  var select_1 = Array.from(document.getElementById("option-1"));
  var select_2 = Array.from(document.getElementById("option-2"));
  var mylist;
  for (var i = 0; i < select_1.length; i++) {
    var opt1 = select_1[i],
      opt2 = select_2[i];

    if (opt1.selected && opt2.selected) {
      mylist = obj.filter((data, index, array) => {
        if (array[index].name !== opt1.textContent) return false;
        if (array[index].name !== opt2.textContent) return false;
        return array[index].name == (opt1 && opt2).textContent;
      });
    }
  }
return mylist
}


//compare.js

compareButton.addEventListener("click", initApp);

function initApp() {
  api
    .getStarShips()
    .then(response => quick_sort(response))
    .then(result =>
      compareButton.addEventListener("click", filterBySelections(result))
    ).then (data=>console.log(data))
    .catch(err => console.log(err));
}

1 个答案:

答案 0 :(得分:0)

  return array[index].name == (opt1 && opt2).textContent;

等于

 return array[index].name == opt2.textContent;

由于opt1 truthy ,因此&&的求值结果是在右侧,所以这可能不是您想要的。您已经在上面的if语句中介绍了这两种情况,所以

 return true;

或者只使用一些布尔代数:

  mylist = obj.filter((data) => data.name === opt1.textContent || data.name === opt2.textContent);