JavaScript 模块导入的一个小麻烦

时间 2020-04-10

原文原文链接

做者：Dmitri Pavlutin
翻译：疯狂的技术宅javascript

原文：https://dmitripavlutin.com/ja...前端

未经容许严禁转载java

1.命名导入和自动完成

假设你编写了一个简单的 JavaScript 模块：python

// stringUtils.js
export function equalsIgnoreCase(string1, string2) {
  return string1.toLowerCase() === string2.toLowerCase();
}

这是一个模块 stringUtils。该模块有一个导出为 equalsIgnoreCase 的函数，该函数用来比较 2 个忽略大小写的字符串。程序员

一切看起来都没什么问题。面试

如今让咱们尝试在另外一个 JavaScript 模块 app 中，从 stringUtils 模块导入 equalsIgnoreCase 函数：segmentfault

// app.js
import { equalsIgnoreCase } from './stringUtils';

equalsIgnoreCase('Hello', 'hello'); // => true

你极可能会经过如下方式编写代码：服务器

首先，你必须先写好 import {}。在此步骤中，IDE 没法提供任何有关要导入的模块名称的建议。微信

而后，你继续敲下 from './stringUtils'。而后移回大括号并展开自动完成提示来选择要导入的名称。多线程

尽管 ES2015 的模块优势不少，但 import module 语法使自动完成功能难以使用。

如今，让咱们看看在 Python 中导入命名组件是否存在一样的问题。

这是在 Python 中实现的相同模块 stringUtils 和函数 equalsIgnoreCase 的代码：

# stringUtils.py
def equalsIgnoreCase(string1, string2):
  return string1.lower() == string2.lower()

在 Python 中，你无需明确指出要导出的函数。

如今，在另外一个 Python 模块 app 内，让咱们尝试从 stringUtils 中导入函数 equalsIgnoreCase：

# app.py
from stringUtils import equalsIgnoreCase

equalsIgnoreCase('Hello', 'hello') # => true

你极可能会经过如下方式编写 app 模块：

在 Python 中，首先指出要从中导入的模块：from from stringUtils。而后再编写要导入的内容 import ...。

若是你想了解更多能够导入的函数，实际上编辑器早已经知道模块名称并可以提供必要的建议。作的不错！

对 JavaScript 中的命名导入启用自动完成功能，我能够找到的惟一解决方案是向 IDE 寻求帮助。

启用插件后，经过先敲下 imd 并按 tab 键，光标会首先跳到你编写模块路径的位置。而后再按 tab 键，光标跳回到大括号内的导入位置。运做方式以下：

在 JavaScript 中，import 语法会强制你先指出要导入的项目（函数、类、变量），而后再指明模块的路径。这种方法对自动完成是很不友好的。

相反，在 Python 中首先指定模块名称，而后指定要导入的组件：from stringUtils import equalsIgnoreCase。使用此语法能够轻松自动完成导入的项目。

经过使用 IDE 的可能性，例如 ES6 code snippet 插件，你能够部分解决 JavaScript 中命名导入自动完成的问题。总比没有好。