Import, rename, and export a function in JavaScript? - Stack Overflow

admin管理员组

文章数量:1193970

With JavaScript what's the shortest way to import a named export, rename it, and export it again?

This code works but it feels more verbose than it should be

import { mock as myFunctionMock } from 'context/myFunction';
export const myFunction = myFunctionMock;

With JavaScript what's the shortest way to import a named export, rename it, and export it again?

This code works but it feels more verbose than it should be

import { mock as myFunctionMock } from 'context/myFunction';
export const myFunction = myFunctionMock;

• javascript

Share Improve this question Follow asked Mar 25, 2019 at 14:02 EvanssEvanss 23.5k9999 gold badges321321 silver badges551551 bronze badges 7

• 1 I'm just curious, why would you want that? – Vencovsky Commented Mar 25, 2019 at 14:04
• @Vencovsky I was just thinking the same thing! I could only think wrapping a massive read-only project function but even then... – Andrei Commented Mar 25, 2019 at 14:05
• 1 @Vencovsky the renaming or the shortness? The renaming could be really useful - let's say you've made some algorithm and export it as "calculateFoo" but then find a library that has it as "calculateBar" - instead of changing your entire source code, you can just re-export and rename it to "calculateFoo". Or you could just always be re-exporting it from the start but changing where you import it from. – VLAZ Commented Mar 25, 2019 at 14:07
• 2 @Vencovsky so go through your entire codebase and change every import of myFunctions to externalLibrary and calculateFoo to calculateBar and then every time you use calculateFoo in your actual code you have to change it to calculateBar? Sure, you can do that. I don't think it's easier than NOT doing all of that and changing a single line. – VLAZ Commented Mar 25, 2019 at 14:12
• 1 @Vencovsky you could be authoring your own library but reusing a function from a library you didn't write – Mulan Commented Mar 25, 2019 at 14:53

 |  Show 2 more comments

3 Answers 3

Sorted by: Reset to default 19

You can combine the import and export like so:

export { mock as myFunctionMock } from 'context/myFunction';

See MDN Docs

Note that you won't actually be able to use myFunctionMock within your code file since you haven't imported it. Neither mock nor myFunctionMock will be defined within this module.

This is a useful shorthand when you're building a library that will be used by other modules or by your end-user.

For example, if you had a utils library that you wanted to export, but you wanted to organize your util functions across several smaller files, such as stringUtils, objectUtils, dataUtils, etc, you can export the contents of those modules within your utils module to create a single, monolithic access point:

stringUtils.js

export function toLower(){}

export function toUpper(){}

objectUtils.js

export function propertyMap(){}

utils.js

export {
    toLower as stringToLower,
    toUpper as stringToUpper,
} from "stringUtils.js";
export {
    propertyMap as objectPropertyMap
} from "objectUtils.js";

I wouldn't generally recommend this approach for internal code as it can make your dependency trees a bit wonky in some cases. It can, however, be extremely useful in situations where you want to import from a common interface but the implementation is dependent on the build (prod vs dev, web vs node, etc)

import { mock as myFunction } from 'context/myFunction';
export { myFunction };

in your original exporter, do:

module.exports = { mock: function () {...}}

When importing, do:

const myFunctionMock = require('file path of exporter');

then to reexport in the same file:

module.exports = {renamedMock: myFunctionMock};

Now any changes to mock will propagate to the other modules where it's referenced (side note, this is node.js in a nutshell).

本文标签： importrenameand export a function in JavaScriptStack Overflow