CODEWITHSUNDEEP
javascriptreactjsecmascript-6
Alwaysblue
Alwaysblue

Reputation: 11960

export default something() meaning

I was going through React Navigation docs and I encountered something like this over there:

import Ionicons from 'react-native-vector-icons/Ionicons';
import { createBottomTabNavigator } from 'react-navigation';

export default createBottomTabNavigator(
  {

Now, I am unable to comprehend what this line does: 

export default createBottomTabNavigator(

I mean it definitely exports something but is it a function?

If yes, then shouldn't it be like:

export default function createBottomTabNavigator(

or According to ES6 something like this:

export default function createBottomTabNavigator = () =>{

Upvotes: 1

Views: 83

Answers (2)

user5734311
user5734311

Reputation:

The code is equivalent to

const MyBottomTabNavigator = createBottomTabNavigator( { /* ... */ });
export default MyBottomTabNavigator;

The function is called, an Object is returned. The Object is exported and used elsewhere.

Edit: More example code in the same vein:

const rootOf2 = Math.sqrt(2.0);
export default rootOf2;

Upvotes: 1

Lazar Nikolic
Lazar Nikolic

Reputation: 4404

Answer given by Chris G is correct. I would also like to add that there is the difference between two ways you can export your variables or functions, by export and export default.

Imagine having variable in file const myVar = 'someValue'; If you export it from file just with export export { myVar } you would have to import it in the file where you would like to use your variable of function like this: import { myVar } from 'name-of-your-module';

In other case, where you export it with default export default myVar, you can import it without {} - like this: import myVar from 'name-of-your-module'

Export default serves to export a single value or to have a fallback value for our module.

Upvotes: 1

Related Questions