javascript - 我如何通过我的选择标签中选择的数字过滤我的 json 数据

Question

假设我有这个 json 文件:

[
  {
    "restaurantName":"name1",
    "address":"restaurant1 address",
    "lat":lat1,
    "long":long1,
    "ratings":[
       {
          "stars":4,
          "comment":"good"
       },
       {
          "stars":5,
          "comment":"excellent"
       }
     ]
  },
  {
    "restaurantName":"name2",
    "address":"restaurant2 address",
    "lat":lat2,
    "long":long2,
    "ratings":[
       {
          "stars":4,
          "comment":"good"
       },
       {
          "stars":3,
          "comment":"ok"
       }
     ]
  } 
]

还有这段 html 代码:

<select id="s1">
  <option value="0">0</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
</select>

<select id="s2">
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
</select>

<button type="button" id="btn">filter</button>

问题是我无法找到一种方法来过滤此数据并获取星级评级介于选择标签中的两个数字之间的餐厅列表。

Answer 1

您可以使用函数 Array.reduce 对星星值求和，使用函数 Array.filter 检查 from-to评分区间。

let data = [  {    "restaurantName":"name1",    "address":"restaurant1 address",    "lat":1,    "long":1,    "ratings":[       {          "stars":4,          "comment":"good"       },       {          "stars":5,          "comment":"excellent"       }     ]  },  {    "restaurantName":"name2",    "address":"restaurant2 address",    "lat":1,    "long":1,    "ratings":[       {          "stars":4,          "comment":"good"       },       {          "stars":3,          "comment":"ok"       }     ]  } ],
    ratingFrom = 3, // from s1 select
    ratingTo = 4, // from s2 select
    result = data.filter(d => {
      let avg = d.ratings.reduce((a, r) => a + r.stars, 0) / d.ratings.length;
      return avg >= ratingFrom && avg <= ratingTo;
    });

console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }