JavaScript IntelliSense
Visual Studio 提供了功能强大、即时可用的 JavaScript 编辑体验。 借助于基于 TypeScript 的语言服务所提供的支持,Visual Studio 提供功能丰富的 IntelliSense、现代 JavaScript 功能支持,以及工作效率功能(如“转到定义”、重构等)。
有关 Visual Studio 的常规 IntelliSense 功能的详细信息,请参阅使用 IntelliSense。
JavaScript IntelliSense 会显示有关参数和成员列表的信息。 此信息由 TypeScript 语言服务提供,该服务在后台使用静态分析来更好地了解使用者的代码。
TypeScript 使用多个源来构建此信息:
基于类型推理的 IntelliSense
在 JavaScript 中,通常没有可用的显式类型信息。 好在一般情况下可根据周围的代码上下文,轻松推导出类型。 此过程称为“类型推理”。
对于变量或属性,类型通常是用于对其进行初始化的值类型或最新的赋值。
var nextItem = 10;
nextItem; // here we know nextItem is a number
nextItem = "box";
nextItem; // now we know nextItem is a string
对于函数,可以从 return 语句中推断返回类型。
当前无法对函数参数进行推理,但是可使用 JSDoc 或 TypeScript .d.ts 文件解决此问题(请参阅后面的部分)。
此外,还有针对以下内容的专门推导:
- “ES3 style”类(用构造函数和原型属性的赋值来指定)。
- CommonJS 样式模块模式(指定为
exports
对象上的属性赋值或对module.exports
属性的赋值)。
function Foo(param1) {
this.prop = param1;
}
Foo.prototype.getIt = function () { return this.prop; };
// Foo will appear as a class, and instances will have a 'prop' property and a 'getIt' method.
exports.Foo = Foo;
// This file will appear as an external module with a 'Foo' export.
// Note that assigning a value to "module.exports" is also supported.
基于 JSDoc 的 IntelliSense
在类型推理不提供所需类型信息(或支持文档)的情况下,可通过 JSDoc 注释显式提供类型信息。 例如,若要为部分声明的对象提供特定类型,可使用 @type
标记,如下所示:
/**
* @type {{a: boolean, b: boolean, c: number}}
*/
var x = {a: true};
x.b = false;
x. // <- "x" is shown as having properties a, b, and c of the types specified
如前文所述,无法对函数参数进行推理。 但是,还可以使用 JSDoc @param
标记向函数参数添加类型。
/**
* @param {string} param1 - The first argument to this function
*/
function Foo(param1) {
this.prop = param1; // "param1" (and thus "this.prop") are now of type "string".
}
有关当前支持的 JsDoc 注释,请参阅类型检查 JavaScript 文件中的 JsDoc 信息。
基于 TypeScript 声明文件的 IntelliSense
由于 JavaScript 和 TypeScript 基于同一语言服务,因此它们能够以丰富的方式进行交互。 例如,可以为在 .d.ts 文件(详细信息)中声明的值提供 JavaScript IntelliSense(请参阅 TypeScript 文档),而且在 TypeScript 中声明的类型(如接口和类)可用作 JsDoc 注释中的类型。
下面是一个简单的示例,其中演示 TypeScript 定义文件通过接口向同一项目的 JavaScript 文件提供此类类型信息(使用 JsDoc
标记)。
自动获取类型定义
在 TypeScript 世界中,最常用的 JavaScript 库的 API 由 .d.ts 文件描述,此类定义最常见的存储库位于 DefinitelyTyped。
默认情况下,语言服务尝试检测正在使用的 JavaScript 库,然后自动下载和引用用于描述库的对应 .d.ts 文件,以提供功能更丰富的 IntelliSense。 文件将下载到用户文件夹下的缓存中,位置为 %LOCALAPPDATA%\Microsoft\TypeScript。
注意
如果使用的是 tsconfig.json 配置文件,此功能在默认情况下为“禁用”,但可将其设置为“启用”,如下所述。
目前,自动检测适用于从 npm(通过读取 package.json 文件)、Bower(通过读取 bower.json 文件)下载的依赖项,以及项目中与大致前 400 个最常用的 JavaScript 库的列表匹配的松散文件。 例如,如果项目中有 jquery-1.10.min.js,将提取并加载 jquery.d.ts 文件,从而提供更好的编辑体验。 .d.ts 文件不会对项目产生任何影响。