лучший подход для импорта одноименных функций в модулях ES6 - PullRequest
Новая
       5

лучший подход для импорта одноименных функций в модулях ES6

1 голос
/ 29 февраля 2020

Мне нужно импортировать одну и ту же функцию имени из двух разных модулей в ES6. Должен ли я переименовать каждую функцию с псевдонимом as при импорте или использовать шаблон модуля Reveal? Или, может быть, есть лучшие подходы?

Решение с псевдонимом

projects.module. js

    function init() {
      console.log("projects module initiated!");
    }

    export { init };

projects_steps.module. js

    function init() {
      console.log("project steps module initiated!");
    }

    export { init };

index. js

    import { init as projectsInit } from "./projects.module.js";
    import { init as projectStepsInit } from "./project_steps.module.js";

    projectsInit();
    projectStepsInit();

Решение с шаблоном модуля Reveal

projects.module. js

var projects = (() => {
  function init() {
    console.log("projects module initiated!");
  }

  return {
    init: init
  };
})();

export { projects };

project_steps.module. js

var projectSteps = (() => {
  function init() {
    console.log("project steps module initiated!");
  }

  return {
    init: init
  };
})();
export { projectSteps };

index. js

import { projects } from "./projects.module.js";
import { projectSteps } from "./project_steps.module.js";

projects.init();
projectSteps.init();

Просто добавим, в будущем будут добавлены дополнительные функции к этим модулям.

Спасибо за заранее!

1 Ответ

1 голос
/ 29 февраля 2020

Шаблон раскрытия модулей - это более старый шаблон, предшествующий модулям ES6. Его целью было скрыть детали «модуля» в частной области действия и предотвратить загрязнение глобальной области.

С модулями ES6 это совершенно не нужно. Ваш вопрос действительно о плюсах и минусах экспорта отдельных функций по сравнению с одним интерфейсом.

Вместо этого рассмотрите возможность использования следующего подхода:

projects.module. js

function init() {
  console.log("projects module initiated!");
}

function foo() {
}

// export an object as the default, which will act as your interface
export default { init, foo };

projects_steps.module. js

function init() {
  console.log("project steps module initiated!");
}

function foo() {
}

// you can still export individual functions where it makes sense
export function projectStepsThing() {
}

// if you don't want to export a default, then just set an object like so:
export const projectSteps = { init, foo };

index. js

import projects from "./projects.module.js";
import { projectSteps, projectStepsThing } from "./project_steps.module.js";

projects.init();
projects.foo();
projectSteps.init();
projectSteps.foo();

projectStepsThing();
...