How to Export Multiple Functions in JavaScript

By /
Exporting multiple functions in JavaScript

To export multiple functions in JavaScript, use the export statement and export the functions as an object.

For example:

function fun1() {}
function fun2() {}

export { fun1, fun2 }

Alternatively, you can use the export statement in front of the function definitions.

This exports the function in question automatically and you do not need to use the export statement separately.

For instance: 

export function fun1() {}
export function fun2() {}

This is the quick answer.

But I recommend you to stick around to learn more details on:

  • How to import multiple functions in JavaScript.
  • How to export variables and arrow functions in JavaScript.
  • About the restrictions of multiple exports in JavaScript.

How to Export Multiple Variables and Arrow Functions in JavaScript

To export multiple variables, use the same export statement you would use with exporting functions.

For example:

export const firstname = "Alice";
export const lastname = "Smith";

Also, these days it is possible to create arrow functions in JavaScript.

To export these, you can use the export statement like before:

export const sum = (x, y) => x + y;
export const sub = (x, y) => x - y;
export const mul = (x, y) => x * y;
export const div = (x, y) => x / y;

Now that you know how to export multiple functions and variables in JavaScript, let’s take a look at how to import them.

How to Import Multiple Functions in JavaScript

To import multiple functions from a module in JavaScript, specify an object with the function names you want to import.

For instance, given you export functions fun1, and fun2 from a file called example.js, you can import them into another in the same folder file with:

import { fun1, fun2 } from "./example"

Notice how you do not need to use the .js extension in the file path.

Also, remember you have to change the path from which to import if the module is located in another folder.

Exception to Exporting Multiple Functions in JavaScript

You can export as many functions as needed as long as you remember that there can be only one default export.

The default export in JavaScript is used to export a single/fallback value from a module.

With a default export, you do not need to specify a name for the exported function.

The filename is used by default.

Also, you can omit curly braces when importing the default export function into another file.

For example, a default export in a file called example.js:

export default function () {
    console.log("Hello from example.js");
}

can be imported and used like this in another file (in same folder):

import example from "example";

example(); // Prints 'Hello from example.js'

Thus it is not possible to do something like this:

export default function () {
    console.log("Foo");
}

export default function () {
    console.log("Bar");
}

This results in an error, that tells you it is not possible to have multiple default exports:

/example.js: Only one default export allowed per module.

Conclusion

Today you learned how to export multiple functions in JavaScript.

To recap, you can export multiple functions by either:

  • Using the export statement in front of each function definition.
  • Using a separate export statement and specifying the exported functions inside of curly braces separated by commas.

The only natural restriction to multiple exports is the default export. In each file, there can be only one default export function.

Scroll to Top