tsd-提升IDE对JavaScript智能感知的能力

时间:2022-12-11 13:10:56

在编写前端JavaScript代码时,最痛苦的莫过于代码的智能感知(Intelli Sense)。

追其根源,是因为JavaScript是一门弱类型的动态语言。对于弱类型的动态语言来说,智能感知就是IDE工具的一个“软肋”。IntelliJ等IDE所用智能感知方式,是一种折中的方式:全文搜索,然后展示出已经使用过的对象成员。这种方式的缺点是,其智能感知的的能力并不精准,经常会显示出很多无关的代码提示。

在很多现代化开发方式中,IDE的强大支持和模块化组织这种“工程化”的思想是我们应对大规模开发的方式之一,这也已经被业界所认同。所以在最近两年,JavaScript的世界也提出了大规模开发的方案,其中有Google的Dart和微软的TypeScript。随着Angular2.0放弃了自家的Dart,而选择了TypeScript,也标志着TypeScript的逐渐成熟。TypeScript是微软总架构师Anders Hejlsberg设计的新语言,他是软件界的传奇人物,是Delphi和.NET的设计者。TypeScript是一种可以编译成传统JavaScript的语言,它并不是完全的创造了一门新语言,而TypeScript是JavaScript语言的超集,它最大的特点就是引入了类型系统。并在编译为JavaScript文件后,可以输出“.ts”的类型元数据信息,为我们IDE的智能感知和重构提供了重要的依据。

关于TypeScript的更多知识,在这里笔者就不在叙述过多。有兴趣的读者可以到http://www.typescriptlang.org/学习,本节要讲的,是它的另一个特性:它编译输出的元数据信息文件(*.d.ts),它可以在不需要修改原有JavaScript文件的情况下,而给JavaScript添加元数据类型信息,而这些类型信息则可以辅助IDE,给出有智能的提示信息,以及重构的依据。

在TypeScript的开源社区,已经为很多的第三方库实现了这类模板文件,我们可以很快的应用在我们的项目之中。当然这里所说的额第三方包含我们常用的:Angular、jQuery、underscore、lodash、jasmine等。

在官方同时也为我们提供了一个方便的工具叫TSD(全称为:TypeScript Definition manager for DefinitelyTyped),它是借鉴NPM包管理工具的思想,实现了一个类似的包管理工具,我们不需要任何的学习成本,只管像使用NPM一样使用它。

这里是TSD主页:http://definitelytyped.org/tsd/,你可以在这里深入了解它,或者是查询你所需要的模板库是否存在于TSD仓库。

TSD也是一个Nodejs的工具,所以我们安装它非常容易,只需要在命令行中输入(对于有些Linux用户需要sudo):

npm install tsd -g

安装我们需要的模板库,也很简单,如jQuery和Angular的安装:

tsd install jquery angular --save

这样TSD就会帮助我们下载jQuery和Angular的d.ts文件,并存放在当前目录的typings独立子目录下,并且它会将我们需要的依赖信息保存在一个叫tsd.json的文件,如NPM的package.json一样,方便于我们的版本管理,以及团队之间的共享。我们只需要共享这个tsd.json文件给其他同事,然后

tsd install

一切都可以满意就绪了。

tsd.json文件的格式如下:

tsd-提升IDE对JavaScript智能感知的能力

同时候TSD工具还会为我们在typing目录下生产一个tsd.d.ts文件,它会为我们引入这些模板文件,使得IDE能够识别出这样模板文件:

/// <reference path="angularjs/angular.d.ts" />
/// <reference path="jquery/jquery.d.ts" />

下面是我们在Intellij中得到的智能感知图:

tsd-提升IDE对JavaScript智能感知的能力

目前能够很好支持TypeScript这一特性的工具有:Intellij家族、微软自家的VS工具、Sublime。有了TSD这一工具,也许我们虽然还不能尝试TypeScript的特性,但我们仍然可以利用它来帮助我们的普通JavaScript开发。

tsd-提升IDE对JavaScript智能感知的能力的更多相关文章

  1. Visual Studio中你所不知道的智能感知

    在Visual Studio中的智能感知,相信大家都用过.summary,param,returns这几个相信很多人都用过的吧.那么field,value等等这些呢. 首先在Visual Studio ...

  2. 如何为javascript代码编写注释以支持智能感知

    在使用Visual Studio做开发的时候,智能感知是非常方便的.从VS2008开始,提供了对javascript的智能感知支持.例如 上述代码中,我们先用document对象的getElement ...

  3. Visual Studio 2012设置Jquery&sol;Javascript智能提示

    Visual Studio 2012设置Jquery/Javascript智能提示 在Visual Studio 2008 Visual Studio 2010中微软已经开始支持jquery/java ...

  4. VS web&period;config&sol;app&period;conifg配置文件自定义类型使用智能感知功能

    大家使用VS编辑web.config或app.config时可以使用智能感知功能的,像下面这样很是方便 当然如果是我们自定义的类型也是可以使用智能感知的,因为智能感知的内容是来自你或其他公司(MS)提 ...

  5. &lpar;Nhibernate &rpar;XML配置文件的智能感知&lpar;IntelliSense&rpar;功能

      XML配置文件的智能感知(IntelliSense)功能 在使用一些第三方的程序库(Nhibernate,Ibatis...)常常需要手工编写比较复杂的配置文件,如果没有像VS IDE那样的Int ...

  6. Visual studio 2017 中的Javascript智能提示与调试

    1.智能提示 对于JS文件中的API,你若需要让那个JS文件中的方法能够在你写的那个JS文件中能够智能显示的话,直接把它拉进你的JS文件中就好了. 举个例子:你想 在你正在写的a.js文件中引用b.j ...

  7. 如何为&period;NETCore安装汉化包智能感知

    引言 具体不记得是在群里还是什么地方有人问过,.NETCore有没有汉化包,答案是有,目前微软已经为我们提供了.NETCore多种语言的语言包.下面看看如何安装与使用吧. 在哪下载? 在微软官方下载 ...

  8. Visual studio智能感知挡住了当前代码输入行

    AssistX->Listboxes->Enable Visual Assist completion, suggestion and member list in .. 如果勾选了该项就 ...

  9. SSMS 2008R2没有智能感知方法解决

    有时SSMS会莫明奇妙的没有了智能感知(前一天还是有的, 第2天就没有了) 在网上查到有如下原因: 1. 服务器上有Offline的DB 解决方案: 将Offline的DB删掉或者设成online即可 ...

随机推荐

  1. JsonOperate 帮助类

    引用 Newtonsoft.Json using Newtonsoft.Json; using System; using System.Collections.Generic; using Syst ...

  2. &lbrack;转&rsqb;第1讲 什么是EMI滤波器

    转:http://www.murata.com/zh-cn/products/emiconfun/emc/2010/10/28/en-20101028-p1 <前言> EMI是Electr ...

  3. tail queue代码阅读

    tail queue是bdb中用的最多的数据结构. 定义在 src/dbinc/queue.h: 注: TRACEBUF,QMD_TRACE_HEAD等是为了 queue代码的debug, 这里移除出 ...

  4. 51NOD 1623 完美消除 数位DP

    题目描述: 定义数的消除操作为选定[L,R,x],如果数的第L到第R位上的数字都大于等于x,并且这些数都相等,那么该操作是合法的(从低位到高位编号,个位是第一位,百位是第二位……),然后将这些位数上的 ...

  5. PHP抓取采集类snoopy介绍

    PHP抓取采集类snoopy介绍 一个PHP的抓取方案 在 2011年07月04日 那天写的     已经有 10270 次阅读了 感谢 参考或原文   服务器君一共花费了14.288 ms进行了2次 ...

  6. linux常用命令&colon;5网络命令

    网络命令 1. 指令名称:write 指令所在路径:/usr/bin/write 执行权限:所有用户 语法:write  <用户名> 功能描述:给用户发送信息,以Ctrl+D保存结束

  7. 2014多校第六场 1007 &vert;&vert; HDU 4927 Series 1(杨辉三角组合数)

    题目链接 题意 : n个数,每操作一次就变成n-1个数,最后变成一个数,输出这个数,操作是指后一个数减前一个数得到的数写下来. 思路 : 找出几个数,算得时候先不要算出来,用式子代替,例如: 1 2 ...

  8. fastdfs storage server的设计与实现

     fastdfs是一个针对互联网应用设计的分布式文件系统.具有架构简单.结构清晰.代码量小等特点. 详细的介绍及架构请參考分布式文件系统FastDFS架构剖析(http://www.program ...

  9. maven仓库有jar包还是报错怎么办?

    出现这种情况通常是jar不能自动下载 一.下载jar包外的其他文件,并放到仓库对应路径下: 点击View All,下载其他文件并放到仓库 二.这样仓库这个对应jar包的文件就齐全了.如果还是报错,请检 ...

  10. 具有相同名称 的类&sol;接口已在使用。请使用类定制设置来解决此冲突。java调用第三方的webservice应用实例

    WSDLToJava Error: http://10.96.84.124:81/BTRPWebServiceForSMB/OnSMBOrderService.svc?xsd=xsd0 [0,0]: ...