同时过滤两个数组？答案

【问题标题】：Filter on two arrays same time?同时过滤两个数组？
【发布时间】：2021-01-29 06:19:03
【问题描述】：

我有两个数组：

const array1 = [{
        "id": "4521",
        "name": "Tiruchirapalli",
        "stateId": "101"
      },
      {
        "id": "1850",
        "name": "Tenkasi",
        "stateId": "101"
      },
      {
        "id": "202",
        "name": "Thanjavur",
        "stateId": "101"
      },
      {
        "id": "505",
        "name": "Ernakulam",
        "stateId": "102"
      },
    ];

现在是array2

 const array2 = [{
        "id": 1850,
        "cityName": "Tenkasi",
        "aliasNames": [
          "Thenkasi"
        ]
      },
      {
        "id": 4521,
        "cityName": "Tiruchirapalli",
        "aliasNames": [
          "Trichy"
        ]
      },
      {
        "id": 202,
        "cityName": "Thanjavur",
        "aliasNames": [
          "Tanjore"
        ]
      },
      {
        "id": 505,
        "cityName": "Ernakulam",
        "aliasNames": [
            "Kochi",
            "Cochin"
        ]
    },
    ];

我需要做的是，如何同时过滤两个数组（或过滤第一个，然后过滤第二个，哪个是性能有效的）。

例如，当用户键入“Kochi”时，首先它应该检查 array1 是否有 name="Kochi"，如果有，那么我们可以设置状态，如果没有，我们需要找到它在array2上并更新状态！

哪种方法是快速有效的处理方式 - （array1 有 2500 条记录，array2 有 990 条记录）所以性能/速度也是一个问题

我的尝试：

searchFilterFunction = text => {   
        this.setState({ typedText: text }); 
 
        const newData = array1.filter(item => {      
          const itemData = `${item.name.toUpperCase()}`;
           const textData = text.toUpperCase();
           return itemData.indexOf(textData) > -1;    
        });
        
        this.setState({ data: newData});  
      };

如何以优化的方式实现第二个过滤器？

【问题讨论】：

我能想到的最好的方法是先循环遍历较短的数组，如果找到条目，则可以设置状态并跳过休息逻辑，否则在第二个数组上开始过滤。在这种情况下，时间复杂度将是 O(n)，其中 n 是 array1.length+array2.length
您是否多次搜索。如果是，那么您可以创建一个名称地图，这样可以节省您的时间。

标签： javascript arrays reactjs filter

【解决方案1】：

例如，当用户键入“Kochi”时，首先它应该检查 array1 查看它是否有 name="Kochi"，如果有，我们可以设置状态有了它，如果它没有，我们需要在 array2 和更新状态！

我会用 Array.find 做这样的事情。

if( array1.find(item=>item.name.toUpperCase() === text) ) {    
   // set state 
} else if( array2.find(item=>item.cityName.toUpperCase() === text) ) {
   // set state
}

精致的形式是

let result = array1.find(item=>item.name.toUpperCase() === text);

// check in array 2 as we cannot find in array 1
if(!result) {
 result = array2.find(item=>{
     // check in aliasNames and in cityName
     return item.cityName.toUpperCase() === text  || item.aliasNames.includes(text);
   }
  );
}

if(result) {
  setState(result);
} else {
  // place not found
}

关于基于您的阵列数量的性能，您不会看到太大的差异。如果您想节省一些毫秒，您可以首先检查具有最少计数的数组，如其中一个 cmets 中所述。但是时间也会根据元素是否在数组中而有所不同。

【讨论】：

【解决方案2】：

我认为这是最佳解决方案，因为嵌套两个过滤器将不起作用，因为您需要先从第一个数组过滤，然后再从第二个数组过滤。

const array1 = [{
        "id": "4521",
        "name": "Tiruchirapalli",
        "stateId": "101"
      },
      {
        "id": "1850",
        "name": "Tenkasi",
        "stateId": "101"
      },
      {
        "id": "202",
        "name": "Thanjavur",
        "stateId": "101"
      },
      {
        "id": "505",
        "name": "Ernakulam",
        "stateId": "102"
      },
    ];

 const array2 = [{ "id": 1850, "cityName": "Tenkasi",
        "aliasNames": [
          "Thenkasi"
        ]
      },{"id": 4521,"cityName": "Tiruchirapalli",
        "aliasNames": [
          "Trichy"
        ]
      },
      {
        "id": 202,
        "cityName": "Thanjavur",
        "aliasNames": [
          "Tanjore"
        ]
      },
      {
        "id": 505,
        "cityName": "Ernakulam",
        "aliasNames": [
            "Kochi",
            "Cochin"
        ]
    },
    ];


function filter(text) {
// Complexity Linear
  const filter_array = array1.filter((a) => {
      return (a.name === text)
  });
  if (filter_array.length > 0) {
    //Set State and return
  } 
  
  //Complexity Linear and includes complexity Linear O(sq(m*n)) where n is     //the aliasName record 
  const filter_array2 = array2.filter((a) => {
    return a.cityName === text  || a.aliasNames.includes(text);
  });
  return filter_array2 //Set State filter array 2
  
}

console.log(filter("Kochi"));

【讨论】：