Question

我在React的某个天气小工具上工作，显示温度和降雨预报。我从OpenWeather获取数据，我的json响应如下：

//rainy day
0:{
  main: {
    temp:10}
  rain: {
    3h: 1000}
}
//sunny day
1:{
  main: {
    temp:10}
}

问题是 rain.3h 属性只有在有一些数据时才会出现在返回的响应中，否则会丢失。我的请求如下：

async getForecast(term) {
  const forecastUrl = "http://api.openweathermap.org/data/2.5/forecast?q=" + term + "&appid=" + apiKey + "&lang=us&units=metric&cnt=16";
  try {
    let response = await fetch(forecastUrl);
    if (response.ok) {
      let jsonResponse = await response.json();
      let forecast = jsonResponse.list.map(
        day => {
          return {
            temp: day.main.temp,
            rain: day.rain["3h"], // can't map missed property
          }
        }
      )
      return (forecast);
    }
  } catch (error) {
    console.log(error);
  }
}

我得到了错误 TypeError：无法读取未定义的属性“3h”。如何添加默认降雨：当响应中缺少属性时为0

Answer 1

您可以使用三元运算符

进行检查

 let forecast = jsonResponse.list.map(
        day => {
          return {
            temp: day.main.temp,
            rain: day.rain?day.rain["3h"] : ''
          }
        }
      )

Answer 2

您应该检查该属性是否存在

var obj = {};
obj.temp = day.main.temp;

if (day.hasOwnProperty("rain") && day.rain.hasOwnProperty("3h"))
  obj.rain = day.rain["3h"];

return obj;

Answer 3

您可以使用带有双安和“＆amp;＆amp;”的作业：

let forecast = jsonResponse.list.map(
  day => {
    return {
      temp: day.main.temp,
      rain: day.rain && day.rain["3h"] || 0
    }
  }
)

这是有效的，因为如果day.rain未定义，那么将不会计算布尔表达式的第二部分，从而避免了未定义错误的无法读取属性，并且OR中的值将用于默认赋值。

返回的json响应/ javascript

3 个答案: