Javascript Objects and Arrays — Part 4

This article is about Javascript objects, arrays, storing a list of items, storing a list of objects, navigating object properties..

• An array is essentially a list of something. Arrays provide a lot of flexibility and provide accessing data easily.

So, let’s start with an example written by me.

As we have seen, we have different arrays (mediterraneanCountries, asiaCountries, popularCity..) and they have lists of objects (and their properties and values), for example, mediterraneanCountries has 3 objects. Properties: countryName, isInEurope, and so on. For example, popularCity is an array (list of objects) and Spain’s popularCity consists of 2 objects.

const country = {
    mediterraneanCountries: [
        {
            countryName: 'Spain',
            countryCode: '+34',
            population: 47.42,
            isInEurope: true,
            popularCity: [
                {
                    city: 'Barcelona',
                    popularFood: ['Paella']
                },
                {
                    city: 'Madrid',
                    popularFood: ['Roast suckling pig']
                },
            ]
        },
        {
            countryName: 'Turkey',
            countryCode: '+90',
            population: 84.85,
            isInEurope: true,
            popularCity: [
                {
                    city: 'Adana',
                    popularFood: ['Adana Kebap', 'İçli Köfte']
                },
                {
                    city: 'Mersin',
                    popularFood: ['Tantuni']
                }
            ]
        },
        {
            countryName: 'Italy',
            countryCode: '+39',
            population: 59.11,
            isInEurope: true,
            popularCity: [
                {
                    city: 'Palermo',
                    popularFood: ['Parmigiana di melanzane']
                },
                {
                    city: 'Rome',
                    popularFood: ['Trippa alla romana', 'Pasta']
                }
            ]
        }
    ],
    asiaCountries: [
        {
            countryName: 'South Korea',
            countryCode: '+82',
            population: 51.74,
            isInEurope: false,
            popularCity:
                [
                    {
                        city: 'Seul',
                        popularFood: ['Galbi']
                    },
                    {
                        city: 'Busan',
                        popularFood: ['Dongchimi']
                    },
                    {
                        city: 'Jeju',
                        popularFood: ['Tteokbokki']
                    }
                ]
        },
        {
            countryName: 'Japon',
            countryCode: '+81',
            population: 125.7,
            isInEurope: false,
            popularCity: [
                {
                    city: 'Tokyo',
                    popularFood: ['Sushi']
                },
                {
                    city: 'Osaka',
                    popularFood: ['Tempura']
                }
            ]
        }
    ]
};

1. Example: Filter the Mediterranean countries whose population is greater than 50 million.

• We use filter function, it’s similar to foreach. It’s getting all Mediterranean countries one by one and checking if their population is greater than 50. If it’s not greater than 50, it directly returns false, so we don’t need to use ‘else’ here.

You can check the results below. For all Mediterranean countries, we have an array and it has 3 objects in it. But the filtered countries’ array has 2 objects. Because Spain is not on the list, its population is less than 50.

2. Example: Filter the first Asian country’s popular cities whose name includes ‘e’ letter.

• We use filter function, it’s similar to foreach. It’s getting first Asian country’s popular cities one by one and checking if their name include ‘e’ letter inside of it. If it doesn’t include ‘e’, it directly returns false, so we don’t need to use ‘else’ here.

3. Example: Filter the Mediterranean countries that are in Europe and calculate the total population with Reduce method. Also, find the minimum and maximum populations.

The reduce() method returns a single value: the function's accumulated result. We can do this using the forEach() method of course.

Lastly, the minimum and maximum populations are displayed by using the reduce method below.

Have a good day!

We often think that great achievements require great actions. However, it is surprising the difference a small improvement can make over time. If you improve by 1 percent every day for 1 year, you will be 37 times better by the end of the year. So, keep working!