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

在编写前端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工具还会为我们在typing目录下生产一个tsd.d.ts文件,它会为我们引入这些模板文件,使得IDE能够识别出这样模板文件:

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

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

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

作者:破  狼 
出处:http://www.cnblogs.com/whitewolf/ 
本文版权归作者,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。该文章也同时发布在我的独立博客中-个人独立博客博客园--破狼51CTO--破狼。http://www.cnblogs.com/whitewolf/p/tsd-javascript-Intelli-sense.html

时间: 2025-01-31 05:46:12

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

Visual Studio 2008对jQuery实现智能感知提示

Visual Studio 2008对Javascript提供了良好的智能感知提示,随着jQuery 的流行和Microsoft将把jQuery ship到Visual Studio中,jQuery.com发布了对 Visual Studio 2008的智能感知提示文档.你可以在 http://docs.jquery.com/Downloading_jQuery#Download_jQuery下载,或者直 接在http://code.jquery.com/jquery-1.2.6-vsdoc.j

5G网络开辟移动通信新纪元 智能感知将无所不在

5G网络不仅是移动通信技术的提升,而且是多种无线接入技术演进集成后的解决方案总称.它将掀起整个行业的巨大变革,推动人类社会全面进入数字化时代. 智能感知将无所不在 5G网络是第五代移动通信技术的简称,是继4G网络之后移动宽带技术发展的新里程碑.5G网络可以覆盖人人.物物.人物,使所有的事物都通过网络进行连接,满足不同行业.不同用户对通信的复杂需求. 5G网络普及后,整个世界将变成名副其实的地球村,大容量信息高速公路将大大缩小物理上的距离,加之万物互联,这决定了它具有广泛的应用前景. 那时的互联网

让VS2008对JQuery语法的智能感知更完美一点_实用技巧

一.刚才看到已经有快手的牛人做完了这项工作,现在可以直接下载(http://data.lancefisher.net/jquery-1.2.3-intellisense.js)回来用了. 这样引用就行了 <script src="jquery-1.2.3-intellisense.js" type="text/javascript"></script> 如果是在独立的.js文件中需要JQuery智能提示,那么在文件开始加上这行 /// <

终端具备智能感知、互联互通和协调共享的功能

日前,网友林先生发布了一条微博,称家中的酒柜刚发来了一条短信,解救了自己多年来珍藏的几十瓶名贵红酒.该微博一发出,便吸引了无数网友的关注,也引来了部分网友的质疑:"酒柜怎么会发手机短信?开玩笑吧." 原来林先生是一名红酒爱好者,家中珍藏着几十瓶顶级红酒.在外出差期间,突然收到酒柜发来的提醒短信,说酒柜内温度偏高,需要及时调整温度.林先生立即通过手机对温度进行了调整,并给家人打电话确认,才知道原来是儿子调皮,趁他不在家偷偷打开酒柜玩耍,导致运行酒柜温度发生较大起伏,自动发短信"

jquery实现智能感知连接外网搜索_jquery

复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title

vs 2008中使用Asp.net Ajax智能感知Intellisense

使用方法很简单 1.在Aspx文件中加入ScriptManager,即此文件可以智能感知 2.HTML中<script type="text/javascript" src="MicrosoftAjax.js"></script>也可以,不过要注意路径,还有就是别用绝对路径 3.JS文件中加入 /// <reference path="MicrosoftAjax.js" />注意路径如果不能确定的话可以直接从解

Red Gate系列之三 SQL Server 开发利器 SQL Prompt 5.3.4.1 Edition T-SQL智能感知分析器 完全破解+使用教程

原文:Red Gate系列之三 SQL Server 开发利器 SQL Prompt 5.3.4.1 Edition T-SQL智能感知分析器 完全破解+使用教程 Red Gate系列之三 SQL Server 开发利器 SQL Prompt 5.3.4.1 Edition T-SQL智能感知分析器 完全破解+使用教程 Red Gate系列文章: Red Gate系列之一 SQL Compare 10.2.0.1337 Edition 数据库比较工具 完全破解+使用教程 Red Gate系列之二

为自定义配置的编辑提供”智能感知”的支持

当我们在设计一个框架的时候,必然会涉及一系列的配置.为了让使用者更好地使用你提供的框架,让他们能够容易地维护这些配置是一项基本的要求.对于一些配置过于复杂的框架,比如EnterLib,比如WCF,往往会提供一个配置的工具.但是,不过这样的配置工具是否提供,手工编译配置文件是在所难免的.如果在通过VS编辑配置的时候,能够提供智能感知和提示性描述的支持,这无疑会使配置的编辑变得非常的容易.这里是一个简单的例子. 一.配置文件的结构 假设我们设计一个MessageGenerator的组件,用于生成程序

WiEngine+Eclipse+CDT+Sequoyah实现c++编程智能感知提示

经过一段时间的摸索,我初步肯定自己基于WiEngine平台和C++开发跨Android/iPhone游戏的最佳(至少目前)环境为: Eclipse+CDT+Sequoyah 第一,JAVA代码调试技术没有问题. 第二,有了CDT+Sequoyah,可以实现类似于VISUAL STUDIO 2010中的流行的智能感知提示.看下图: 起初,智能感知提示是没有实现的.也是花费了不少时间,才找到如下答案: Project->Properties->C/C++ General->Indexer,在