Why can't I use filter for nested objects in javascript?

Question

I am preparing a weather app that gives suggestion list as we enter an input city name.

Json file is in this format:

{"coord":{"lon":-0.13,"lat":51.51},
 "weather":[{"id":300,"main":"Drizzle","description":"light intensity drizzle","icon":"09d"}],
  "base":"stations",
  "main":{"temp":280.32,"pressure":1012,"humidity":81,"temp_min":279.15,"temp_max":281.15},
"visibility":10000,
"wind":{"speed":4.1,"deg":80},
"clouds":{"all":90},"dt":1485789600,
"sys":{"type":1,"id":5091,"message":0.0103,
"country":"GB",
"sunrise":1485762037,
"sunset":1485794875},
"id":2643743,
"name":"London",
"cod":200}

So my code for that functionality is:

inputcity.addEventListener("input",()=>getweather(inputcity.value));
const getweather=async searchtext=>{
    const res=await fetch("https://api.openweathermap.org/data/2.5/weather?q="+inputcity.value+"&units=metric&appid=78a661b7c335021c7d85065aea3673be");
    const cities= await res.json();
    
   
let matches=cities.filter(city=>{
     const regex=new RegExp(`^${searchtext}`,'gi');
        return city.name.match(regex);
});
console.log(matches);
};

What I want is to show a list of city names starting with same letters.

But it's showing error the following error:

 *Uncaught (in promise)TypeError: cities.filter is not a function*

because this api gives data in nested objects not in array of objects.

How can get my code working using filter or any method?

Isn't it cities.filter(....) instead of data? And do you get an array from the API or a single object? — Stutje
– Stutje, Commented Jul 16, 2020 at 7:37
@Stutje yes ,it is cities. sorry for that and i have attached a sample of api data ,it is in nested objects — Anshu Singh
– Anshu Singh, Commented Jul 16, 2020 at 8:50

Matthew Developer · Accepted Answer · 2021-05-30 07:27:31Z

Because i don't have 50 reputation to leave a comment on the comment section.
I will just leave my comments here, so you can got an idea how to do it.

Your code that fetch the API's from https://api.openweathermap.org/data/2.5/weather?q="+inputcity.value+"&units=metric&appid=78a661b7c335021c7d85065aea3673be is only returning data for 1 city.

The returned data is also not a ARRAY, It's a JSON object. See here for better viewing of your data : https://codebeautify.org/jsonviewer/cb13b4bd

For your idea about suggestion list on city name when users inputted the data, is not on their api's feature.

You should make a array for the city name lookup and shows the suggestion with .startsWith(user.input).

Example super inefficient code to do that :

const userinput = "a";
var city = ["aaa", "abc", "bca", "cba", , "ccc"];
city.forEach(searchsuggestion);

function searchsuggestion(value, index) {
   if (value.startsWith(userinput)) {
      console.log("Suggestion : " + value);
   }
   else {
      return;
   }
}

Your Console output for the above code should be :

Suggestion : aaa
Suggestion : abc

Collectives™ on Stack Overflow

Why can't I use filter for nested objects in javascript?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related