Question

在TypeScript中，

之间有什么区别

 import http = require('http');

和

 var http = require('http');

我看到在代码源中使用这两种方式，它们是否可以互换？

Answer 1

您的import语句是TypeScript，不会在Node中按原样运行。您需要首先将其编译（转换？）到JavaScript。您可以阅读TypeScript文档，了解有关TypeScript import关键字的工作原理的详细信息。请参阅"Going External" section of their Modules doc。

JavaScript中也有import个关键字，但它并不像TypeScript import的工作方式那样有用。它仅适用于支持ES6模块的Node版本。您可以在"ES6 Modules: The Final Syntax"阅读import和require之间的差异。 import可以与require进行比较/对比，但不是var。

Answer 2

我有同样的询问。刚刚在Typescript的“Alias”部分找到了这个：

这与使用var类似，但也适用于导入符号的类型和名称空间含义。重要的是，对于值，导入是与原始符号的明显引用，因此对别名var的更改不会反映在原始变量中

https://www.typescriptlang.org/docs/handbook/namespaces.html#aliases

Answer 3

TypeScript import关键字有几种用法，有些用于取决于环境，解释了为什么会让人感到困惑。让我们看看具有最小细节级别（实际项目中的原因可能更复杂）：

模块CommonJs / Node

@mfc：这是与您的问题相对应的情况。

TypeScript项目使用CommonJs模块，通常是节点项目：

// tsconfig.json
{
    "compilerOptions": {
        "module": "commonjs",
        ...
    }
}

在此上下文中，import _ = require('http');（版本＃1 ）会被转换为var _ = require('http');（版本＃2 ）。因此版本＃1是TypeScript语法，而版本＃2是JavaScript语法。

版本1支持

require()，但版本＃2（错误[ts] Cannot find name 'require'.）不支持，除非通过npm i @types/node --save-dev 向项目添加节点类型（请参阅此{{3} }）

模块ES6

@mfc：这不是你要求的情况。但它在stackoverflow Q/A，所以我已经考虑到了它。

import是ES6关键字，其Trott's answer：

“完全”导入已命名的导出：import * as lib from 'lib';
“拣配”导入已命名的导出：import { square, diag } from 'lib';
导入默认导出：import myFunc from 'myFunc';

根据上面提到的模块编译器选项，这些导入的转换方式不同：

ES6→无变化
CommonJS→var ... = require('...');
AMD→define(...);

命名空间

别名

@mfc：这不是你要求的情况。但它在own syntax，所以我在这里添加了全面的图片。

在Jose A's answer，以前称为“（内部）模块”中，import用于创建namespace，这是另一个命名空间的导出元素的快捷方式。

namespace Root.Branch.Leaf {
    export const configPath = '...';
}

namespace LeafClient {
    import configPath = Root.Branch.Leaf.configPath;
    console.log(`configPath=${configPath}`);
}

import configPath = Root.Branch.Leaf.configPath;行被转换为var configPath = Root.Branch.Leaf.configPath;，参见alias

注意命名空间之外的用法，因为它创建了全局变量！

全球模块

某些库修改全局对象（浏览器中的window全局变量），例如：

jQuery及其$全局变量
TypeScript PlayGround扩展reflect-metadata。

ES6语法还允许使用Reflect加载此类库：import "reflect-metadata";

TypeScript支持此side effects only import。编译器将尝试获取相应的kind of imports以理解库效果，例如新方法typing definition。

TypeScript var vs import

3 个答案:

模块CommonJs / Node

模块ES6

命名空间

别名

全球模块