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文件目录

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

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

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

tsd智能感应

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


本文转自破狼博客园博客,原文链接:http://www.cnblogs.com/whitewolf/p/tsd-javascript-Intelli-sense.html,如需转载请自行联系原作者

目录
相关文章
|
5天前
|
设计模式 前端开发 JavaScript
揭秘!前端大牛们如何巧妙利用JavaScript,打造智能交互体验!
【10月更文挑战第30天】前端开发领域充满了无限可能与创意,JavaScript作为核心语言,凭借强大的功能和灵活性,成为打造智能交互体验的重要工具。本文介绍前端大牛如何利用JavaScript实现平滑滚动、复杂动画、实时数据更新和智能表单验证等效果,展示了JavaScript的多样性和强大能力。
18 4
|
3月前
|
机器学习/深度学习 存储 前端开发
实战揭秘:如何借助TensorFlow.js的强大力量,轻松将高效能的机器学习模型无缝集成到Web浏览器中,从而打造智能化的前端应用并优化用户体验
【8月更文挑战第31天】将机器学习模型集成到Web应用中,可让用户在浏览器内体验智能化功能。TensorFlow.js作为在客户端浏览器中运行的库,提供了强大支持。本文通过问答形式详细介绍如何使用TensorFlow.js将机器学习模型带入Web浏览器,并通过具体示例代码展示最佳实践。首先,需在HTML文件中引入TensorFlow.js库;接着,可通过加载预训练模型如MobileNet实现图像分类;然后,编写代码处理图像识别并显示结果;此外,还介绍了如何训练自定义模型及优化模型性能的方法,包括模型量化、剪枝和压缩等。
49 1
|
3月前
|
API UED 开发者
如何在Uno Platform中轻松实现流畅动画效果——从基础到优化,全方位打造用户友好的动态交互体验!
【8月更文挑战第31天】在开发跨平台应用时,确保用户界面流畅且具吸引力至关重要。Uno Platform 作为多端统一的开发框架,不仅支持跨系统应用开发,还能通过优化实现流畅动画,增强用户体验。本文探讨了Uno Platform中实现流畅动画的多个方面,包括动画基础、性能优化、实践技巧及问题排查,帮助开发者掌握具体优化策略,提升应用质量与用户满意度。通过合理利用故事板、减少布局复杂性、使用硬件加速等技术,结合异步方法与预设缓存技巧,开发者能够创建美观且流畅的动画效果。
77 0
|
4月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的智能小程序商城附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的智能小程序商城附带文章源码部署视频讲解等
31 3
|
4月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的智能化智能化电子相册附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的智能化智能化电子相册附带文章源码部署视频讲解等
34 1
|
5月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp小程序的智能停车计费系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp小程序的智能停车计费系统附带文章源码部署视频讲解等
35 1
|
4月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的农业信息智能化种植系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的农业信息智能化种植系统附带文章源码部署视频讲解等
67 0
|
5月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp小程序的智能菜谱推荐系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp小程序的智能菜谱推荐系统附带文章源码部署视频讲解等
69 0
基于springboot+vue.js+uniapp小程序的智能菜谱推荐系统附带文章源码部署视频讲解等
|
5月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp小程序的智能小程序商城附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp小程序的智能小程序商城附带文章源码部署视频讲解等
32 2
|
4月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp小程序的智能水果销售系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp小程序的智能水果销售系统附带文章源码部署视频讲解等
21 0