Let's say you want to import and share a name with some other value that already exists in your program.
- How to use the
as
keyword
For example, suppose you had access to two modules, greeterEspanol.js
and greeterFrancais.js
. Each exports a function called greet()
:
/* inside greeterEspanol.js */
const greet = () => {
console.log('hola');
}
export { greet };
/* inside greeterFrancais.js */
const greet = () => {
console.log('bonjour');
}
export { greet };
Now, let’s say you wanted to use each of these functions in a program, called main.js
, that simulates a conversation between a spanish-speaker and a french-speaker.
import { greet } from 'greeterEspanol.js';
import { greet } from 'greeterFrancais.js';
//Error on line 2 identifier greet has
//already been defined on line 1.
Thankfully, ES6 includes syntax for renaming imported resources by adding in the keyword as
. It looks like this:
import { greet as greetEspanol } from 'greeterEspanol.js';
import { greet as greetFrancais } from 'greeterFrancais.js';
greetEspanol(); // Prints: hola
greetFrancais(); // Prints: bonjour
Hopefully this knowledage comes to be useful when trying to manage your variable names in many different files.
Top comments (0)