即使文本存在，JS数组也不返回特定文本的索引值

Question

对 JS 相当陌生。我有一个 HTML 表格，其中的列按以下顺序排列：大陆、国家等... 到目前为止，我的工作代码可以读取 HTML 表格，为所有国家/地区创建一个数组，然后删除重复项。我还有一个数组，可以在 HTML 表中为国家数组的每个元素查找大陆。

我的问题是我似乎无法在大洲数组中查找某个值的所有索引（例如“非洲”）。这是我的代码：

//Step 1: create an array to hold each country's continent. The 'countries' array was 
previously created. 
 
   var continents = [];
   for (const element of countries){
     console.log(element);

      var contin = []; 
      for (j = 0 ; j < data.rows.length; j++){
         if (data.rows[j].cells[1].innerHTML.indexOf(element) >= 0) 
         contin.push(data.rows[j].cells[0].innerHTML);
         }
         continents.push(contin);
}

//Step 2: Create a function that can look up all indexes in the continents array for a certain value.
        function getAllIndexes(arr, val) {
          var indexes = [], i;
          for(i = 0; i < arr.length; i++)
              if (arr[i] === val)
              indexes.push(i);
          return indexes;
        }

//Step 3: Run the function to get all index values where continents array = "Africa"
         indexesAfrica = getAllIndexes(continents, "Africa");
         alert(indexesAfrica);

当我运行该函数时，它返回一个空白。我已经在其他数组上测试了该函数并且它可以工作。例如，此代码返回“1,3”的正确索引：

var funArr = ["test", "Africa", "Hello","Africa"];
indexesAfrica = getAllIndexes(funArr, "Africa");
alert(indexesAfrica);

这让我觉得我的大洲数组有问题？当我提醒（大陆）时，大陆数组显示正确的数组项列表，但我似乎无法在其中查找任何内容。想法？

Answer 1

我打算将此作为评论留下，但它似乎可以解决你的情况，也许有助于教一些东西。为什么将它们作为 2 个单独的数组？它的可扩展性不是很高。如果您对国家/地区数组进行排序，您将失去与大陆的关联。最好将它们组合成一个易于过滤的对象数组（例如，如果您只想显示位于非洲的国家/地区）。

let countries = ["Algeria", "Angola", "Benin", "Botswana", "Burkina Faso", "Burundi", "Cameroon", "Cape Verde", "USA"]
let data = document.querySelector('table');

let globe = countries.map(country => { // using map, we can transform each incoming country into a country/continent object
  let continent = 'N/A'; // just so we have somethign in case we dont find a continent
  [...data.rows].forEach(row => { // data is the table, rows are the <tr> tags, but we need to make it iterable for the loop, so we wrap it in a spread [...] 
    if (row.cells[1].innerText.trim() === country) continent = row.cells[0].innerText.trim();
  })
  return { country: country, continent: continent}; // we return an object back to our map
});
console.log(globe)

//Step 2: Run the function to get all index values where continents array = "Africa"

const africanCountries = globe.filter(e => e.continent === "Africa").map(e => e.country);
console.log(africanCountries)

<table>
  <tr><td>Africa</td><td>Algeria</td></tr>
  <tr><td>Africa</td><td>Angola</td></tr>
  <tr><td>Africa</td><td>Benin</td></tr>
  <tr><td>North America</td><td>USA</td></tr>
  <tr><td>Africa</td><td>Botswana</td></tr>
  <tr><td>Africa</td><td>Burkina Faso</td></tr>
  <tr><td>Africa</td><td>Faso</td></tr>
  <tr><td>Africa</td><td>Burundi</td></tr>
  <tr><td>Africa</td><td>Cameroon</td></tr>
  <tr><td>Africa</td><td>Cape Verde</td></tr>
</table>

更新：要添加纬度和经度，您可以在 map() 中点击索引

let globe = countries.map((country, index) => { // using map, we can transform each incoming country into a country/continent object
  let continent = 'N/A'; // just so we have somethign in case we dont find a continent
  [...data.rows].forEach(row => { // data is the table, rows are the <tr> tags, but we need to make it iterable for the loop, so we wrap it in a spread [...] 
    if (row.cells[1].innerText.trim() === country) continent = row.cells[0].innerText.trim();
  })
  return { 
     country: country, 
     continent: continent,
     lat: countryLat[index],
     long: countryLong[index]
   }; // we return an object back to our map
});