TypeScript 简介

原文链接: http://www.oschina.net/question/12_72250

你是否听过 TypeScript?

TypeScript 是微软开发的 JavaScript 的超集,TypeScript兼容JavaScript,可以载入JavaScript代码然后运行。TypeScript与JavaScript相比进步的地方 包括:加入注释,让编译器理解所支持的对象和函数,编译器会移除注释,不会增加开销;增加一个完整的类结构,使之更新是传统的面向对象语言。

为什么会有 TypeScript?

JavaScript 只是一个脚本语言,并非设计用于开发大型 Web 应用,JavaScript 没有提供类和模块的概念,而 TypeScript 扩展了 JavaScript 实现了这些特性。TypeScript 主要特点包括:

  • TypeScript 是微软推出的开源语言,使用 Apache 授权协议

  • TypeScript 是 JavaScript 的超集. 
  • TypeScript 增加了可选类型、类和模块
  • TypeScript 可编译成可读的、标准的 JavaScript
  • TypeScript 支持开发大规模 JavaScript 应用
  • TypeScript 设计用于开发大型应用,并保证编译后的 JavaScript 代码兼容性
  • TypeScript 扩展了 JavaScript 的语法,因此已有的 JavaScript 代码可直接与 TypeScript 一起运行无需更改
  • TypeScript 文件扩展名是 ts,而 TypeScript 编译器会编译成 js 文件
  • TypeScript 语法与 JScript .NET 相同
  • TypeScript 易学易于理解

语法特性

  • 类 Classes

  • 接口 Interfaces
  • 模块 Modules 
  • 类型注解 Type annotations
  • 编译时类型检查 Compile time type checking 
  • Arrow 函数 (类似 C# 的 Lambda 表达式)

JavaScript 的 TypeScript 的区别

TypeScript 是 JavaScript 的超集,扩展了 JavaScript 的语法,因此现有的 JavaScript 代码可与 TypeScript 一起工作无需任何修改,TypeScript 通过类型注解提供编译时的静态类型检查。TypeScript 可处理已有的 JavaScript 代码,并只对其中的 TypeScript 代码进行编译。

编辑器支持

Visual Studio 2012 支持 TypeScript 模块/语法高亮,这个需要安装 TypeScript 插件。而类似 Sublime Text, Vim and Emacs 编辑器支持语法高亮。 在 VS 2012 编辑器中,还提供了重构和 Go To Definition 等功能。

注意: TypeScript 不依赖任何 IDE,你可在任何应用中自行将 TypeScript 编译成 JavaScript。

如何获取

可通过以下两个方法来安装 TypeScript:

注意: 需要关闭其他应用程序来避免安装时的一些问题。

下面是通过 MSI 文件安装时的界面:

如果你只是想先看看 TypeScript 而已,可 click here.

如何编译 TypeScript

要在应用中使用 TypeScript 必须先编译,编译的结果是生成 js 文件,你可通过 TypeScript 编译器 tsc 来完成这个过程。

如果你在 Visual Studio 2012 中使用 TypeScript,它会自动将 ts 文件编译成 js 文件。

TypeScript 编译器模板被安装在如下路径:

C:\Program Files (x86)\Microsoft SDKs\TypeScript\0.8.0.0

或者是:

C:\Program Files\Microsoft SDKs\TypeScript\0.8.0.0

要编译 TypeScript 文件,可使用如下命令:

tsc filename.ts

一旦编译成功,就会在相同目录下生成一个同名 js 文件,你也可以通过命令参数来修改默认的输出名称。

如果你希望 TypeScript 被自动编译,你可以了解下 Sholo.TypeScript.Build , Web Essentials 2012.

TypeScript 项目/文件 模板

一旦你在 Visual Studio 2012 上安装了插件,你会获得如下模板:

HTML Application with TypeScript 

MVC – TypeScript Internet Application

TypeScript File 

首个用 TypeScript 编写的 HTML 应用

现在我开始用 TypeScript 创建一个简单的 HTML 应用。

首先通过 File -> New-Project 新建项目:


输入必要信息,点击 Ok 按钮,创建后项目模板如下:

我们将看到 app.js 依赖于 app.ts,默认的 app.ts 文件包含类和构造函数等等,如下图:

TypeScript 文件将会被编译为 JavaScript (app.js),下面是编译后的 JavaScript 代码:

然后我们可以在页面中引用 JavaScript

当你构建或者重新构建项目时,你将看到提示是否重新编译 TypeScript 的信息:

如果在 .??proj 文件中有如下内容将会被自动编译:

当你运行此应用时会在页面上显示当前的日期和时间

你也可以在线玩玩:Playground

更多阅读资料

总结

这篇文章中我们简单的介绍了如何使用 TypeScript,希望你能喜欢或者觉得对你有帮助。

英文原文OSCHINA原创翻译

时间: 2024-10-12 04:18:55

TypeScript 简介的相关文章

Learining TypeScript (一) TypeScript 简介

Learining TypeScript (一) TypeScript 简介 一.TypeScript出现的背景    2 二.TypeScript的架构    2 1.    设计目标    2 2.    TypeScript组件    4 三.TypeScript语言特性    4 1.类型    7 2.变量.基本类型和运算符    8 3.流程控制语句    12 4.函数    12 5.类    13 6.接口    14 7.命名空间    15 四.小结    16 一.Typ

转载:TypeScript 简介与《TypeScript 中文入门教程》

简介 TypeScript是一种由微软开发的自由和开源的编程语言.它是JavaScript的一个超集,而且本质上向这个语言添加了可选的静态类型和基于类的面向对象编程.安德斯·海尔斯伯格,C#的首席架构师,已工作于TypeScript的开发. TypeScript扩展了 JavaScript 的句法,所以任何现有的JavaScript程序可以不加改变的在TypeScript下工作.TypeScript是为大型应用之开发而设计,而编译时它产生 JavaScript 以确保兼容性. TypeScrip

typescript简介

微软作为编译器狂魔一直有一个心病,就是改良JavaScript这种语法超级烂又很多人用的编程语言,于是TypeScript诞生了 先做个对比吧:   TS JS 语法严谨性 严谨 宽松 静态性 静态 动态 适合开发规模 大型 小型 支持类型 基本类型.泛型.implements 都不支持 下面来把ts的特点逐一介绍: 1.类型 常见的ts类型:string.number.boolean.undefined.null.void.any.enum.Array.object.Never ts引入了类型

第一章 Typescript 介绍

Typescript 介绍 一.Typescript 简介 Typescript 是微软开发的 Javascript 的超集,Typescript 兼容 Javascript,可以载入 Javascript 代码然后运行. 二.Typescript 与 Javascript 比较 Typescript 与 Javascript 相比,进步的地方包括:加入注释,让编译器理解所支持的对象和函数,编译器会移除注释,不会增加开销:增加一个完整的类结构,使之更新是传统的面向对象语言. 三.语法特性 基础类

TypeScript + node.js + github.api, 实现github快速找到目标用户

一.TypeScript简介 1.定义 (1)Typescript = JavaScript + type + ( some other stuff ) (2)Typescript需要先被编译成Javascript,而后才能使用 2.demo 安装typescript: npm install typescript –g tsc index.ts index.ts: var fn = () => ‘response’ command line: tsc init 修改tsconfig.json的

基于TypeScript的FineUIMvc组件式开发(简介)

不熟悉FineUI的可以访问其官方网站(http://www.fineui.com),在这里我从我的个人角度说一下FineUI,FineUI有多个版本,但主要基于2种架构,一种是基于Asp.net WebForm,别一种是基于Asp.net Mvc. 在WebForm版本下,虽然FineUI是一个前端构架,但在一些常规简单项目中几乎不用写JS代码,除了首次请求页面,后续的操作都是基于Ajax的,而JS代码都是由服务器端动态生成,并放到客户端执行,这也是FineUI的一大特点.了解WebForm的

TypeScript系列1-1.5版本新特性

1. 简介 随着PC端快速向移动端迁移,移动(体验)优先的概念也越来越响.由于ReactJS目前移动端仅仅支持iOS,因此移动端Web开发框架只能选择: AngularJS/Angula2 + Ionic框架 + Cordova.想要学习好Angula2以及阅读其代码, 就必须了解和学习TypeScript,也因此需要学习好ES6以及Web Component.近期将开始学习TypeScript语言. 下面先看看TypeScript语言的发展: 鉴于JavaScript这种脚本语言很难应用于大规

TypeScript环境搭建

环境搭建 本篇将简单介绍一下TypeScript,并记录开发环境的搭建.使用Visual Studio Code进行一个简单的Demo开发过程. 第一部分.简介 TypeScript是一种由微软开发的自由和开源的编程语言.是JavaScript的一个超集.它在保留JavaScript语言本身特性的基础上添加了大量静态语言具有的一些特性,包括但不限于以下几点: 可选的静态类型 枚举.接口和类 命名空间 模块 Lambda表达式 编译时类型检查 在2013年6月微软正式发布了0.9版.之后在不断更新

Egret 学习之简介,环境搭建及命令行语法 (一)

1,简介 1)egret是一个开源免费的游戏框架,它使用TypeScript脚本语言进行开发:当游戏完成最终的打包后,可以将程序转换为h5游戏,实现跨平台性:它基于BSD(Berkly Software Distribution 伯克利软件发行)协议: 2)它不仅是基于h5的游戏引擎,还提供了很多辅助游戏开发的工具.准确的来说egret是一套游戏开发的 解决方案.既可以使用该引擎开发h5游戏,并运行到手机和PC端的浏览器中,同时也可以使用egret来搭建游戏开发工作流: 2,安装过程: 到官网下