适用范围: yes Visual Studio no Visual Studio for Mac no Visual Studio Code

Visual Studio 提供了功能强大、即时可用的 JavaScript 编辑体验。 借助于基于 TypeScript 的语言服务所提供的支持,Visual Studio 提供功能丰富的 IntelliSense、现代 JavaScript 功能支持,以及工作效率功能(如“转到定义”、重构等)。

有关 Visual Studio 的常规 IntelliSense 功能的详细信息,请参阅 使用 IntelliSense

JavaScript IntelliSense 会显示有关参数和成员列表的信息。 此信息由 TypeScript 语言服务提供,该服务在后台使用静态分析来更好地了解使用者的代码。

TypeScript 使用多个源来构建此信息:

  • 基于类型推理的 IntelliSense
  • 基于 JSDoc 的 IntelliSense
  • 基于 TypeScript 声明文件的 IntelliSense
  • 自动获取类型定义
  • 基于类型推理的 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 文件不会对项目产生任何影响

  • 使用 IntelliSense
  • JavaScript 支持 (Visual Studio for Mac)
  •