Get country name from country code using JavaScript

Posted on by Edward Anderson
Get Country name from Country code using JavaScript

In JavaScript, there are several ways to get country name from country code using JavaScript. We have successfully experimented with a few techniques, including the Intl.DisplayNames() and the countries.json library. With the explanation and samples below, let’s get started.

How to get country name from country code using JavaScript.

Using Intl.DisplayNames()

This Intl.DisplayNames() method translates language, region and display names and returns a new Intl.DisplayNames object.

Syntax:

Intl.DisplayNames(locales, options)

Parameters:

  • locales: BCP 47 language tag-formatted string or collection of strings in this format.
  • options: a thing that has some or all of the optional characteristics. We only utilize the “type” attribute in this situation.

Example:

// Define an object that converts all country codes into country names in English language
let countries = new Intl.DisplayNames(['en-UK'], { type: 'region' });
 
// Get country name from country code "vn"
let countryName = countries.of('VN');
console.log(countryName);

Output:

Vietnam

The above example shows that we have used the constructor Intl.DisplayNames() with two arguments that are the language to be displayed (“en-UK” means English) and the kind of data to be displayed, because this method does not only convert country code into country name but also other data such as “currency” or “language”. As we only want to get the country name, we have put an object that has a key “type” and a value as “region” to get the result. If you want to display the country name in another language. Here is another sample: 

// Define an object that converts all country codes into country names in English language
let countries = new Intl.DisplayNames('en-US', { type: 'region' });
 
// Get country name from country code "TH"
let countryName = countries.of('TH');
console.log(countryName);

Output:

Thailand

As you can see, we only pass a string “en-US” in the parameters of the constructor, and it works also. In the next solution, we will show you another way to do this.

Using countries.json

There is a website that contains the data of all country codes globally and the corresponding country name. All you need to do is creating them or copying them into a file named “countries.json” in your project. The data of the file can be found here. We will fetch all the data into json type and store it in a variable. Then, we will access a property whose name is the country code from that object, and the result will be its corresponding country name.

// Get country name from country code from user input
fetch("https://raw.githubusercontent.com/learnshareit22/getCountryNameFromCountryCode/main/countries.json")
    .then(res => res.json())
    .then(countries => {
        alert(countries[prompt("Type country code")]);
    });

Output:

Type country code: VN
Result: Vietnam

As you can see, this solution also produces the same country name as the first solution. However, this solution only displays the name in the English language instead of the user-defined option like the first approach. Moreover, this approach requires you to create a new file to store data to process the need.

Summary

Using Intl.DisplayNames() and the countries.json file, you have learned two alternative methods in this article for extracting a country name from a country code using JavaScript. We really hope you find this information to be useful. Please feel free to leave a comment below if you have any queries so that we can respond as quickly as possible. I’m grateful.

Maybe you are interested:

Related Posts

Leave a Reply

Your email address will not be published. Required fields are marked *