将 ES6 import 语句放在代码文件底部有什么缺点吗？

Question

我最近在查看Apollo 客户端示例时才遇到这种做法- 我没有意识到所有导入语句都可以位于 .js 文件的底部。这似乎是一个好主意，因为很少有在打开文件时我主要要处理的导入语句。

在顺序无关紧要的情况下，我们应该注意这种做法有什么缺点吗？

这可能只是一个示例实践，因为同一家公司将导入放在生产代码的顶部- 但我不确定为什么它不能应用于生产代码。我们正在使用 TypeScript，但我相信这些问题与普通 ES6 是一样的。

Answer 1

通常，您需要先声明/定义某些内容，然后再使用它。先使用它然后定义它似乎很奇怪。阅读您的代码的人会期望导入位于文件的顶部。

对于函数来说也是如此：您可以在声明它们之前使用它们，但是阅读代码的人会期望在上面几行而不是下面找到函数的声明：

var result = add(10, 5);

// some other code

function add (a, b) {
  return a + b;
}

这似乎是一个好主意，因为很少有在打开文件时我主要要处理的导入语句。

我不同意。当我查看一个文件时，我对它的依赖关系以及它与项目中其他文件的关系感兴趣。

假设您想了解某个文件的含义。通常，您会浏览代码，首先查看导入，然后查看使用这些导入的代码。否则，你会遇到很多你从未见过的事情。