面试题：TypeScript中ES6模块与类型声明

Question

在TypeScript项目中，使用ES6模块导入一个没有类型声明的JavaScript模块，你会采取什么方法来确保类型安全？请详细说明步骤并给出代码示例。

Answer 1

1. 创建类型声明文件：
   • 为没有类型声明的JavaScript模块创建一个.d.ts文件。例如，如果要导入的JavaScript模块名为myModule.js，则创建myModule.d.ts。
   • 在.d.ts文件中声明模块的导出类型。假设myModule.js导出一个函数，示例如下：

// myModule.d.ts
declare function myFunction(): string;
export = myFunction;

2. 导入模块并使用：
   • 在TypeScript文件中，可以像正常导入有类型声明的模块一样导入该模块。

// main.ts
import myFunction from './myModule';
const result = myFunction();
console.log(result);

3. 使用@types：
   • 如果该JavaScript模块在@types仓库中有类型声明，可以直接安装对应的@types包。例如，对于一个假设的someLibrary模块：
   • 先安装@types/someLibrary：npm install --save-dev @types/someLibrary
   • 然后在TypeScript文件中导入并使用：

// main.ts
import { someFunction } from'someLibrary';
const result = someFunction();
console.log(result);

4. 使用declare module语法（针对非标准模块导入）：
   • 如果模块使用了非标准的导入方式（例如通过require导入旧的CommonJS模块），可以在TypeScript文件中使用declare module来声明模块类型。

// main.ts
declare module'myOldModule' {
    export function oldFunction(): number;
}
const oldModule = require('myOldModule');
const result = oldModule.oldFunction();
console.log(result);

5. 使用as any（不推荐但有时可用）：
   • 这是一种临时解决方案，它绕过了类型检查。

// main.ts
const myModule = require('./myModule') as any;
const result = myModule.someFunction();
console.log(result);

• 这种方法会失去类型安全，只有在确实无法为模块创建合适类型声明时才使用。