TypeScript学习起步

最新推荐文章于 2023-06-21 09:02:53 发布

H小志

最新推荐文章于 2023-06-21 09:02:53 发布

阅读量822

点赞数

分类专栏： TypeScript 文章标签： typescript

本文链接：https://blog.csdn.net/xiaozhi_2016/article/details/64443007

版权

TypeScript 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

TypeScript是一种由微软开发的支持ES6标准的编程语言,它是Angular2的开发语言,是javascript的超集。TypeScript扩展了Javascript的语法，任何已

经存在的Javascript程序可以不加任何改动的在TypeScript的环境下运行。TypeScript只是向Javascript添加了一些新的遵循ES6规范的语法以及基于类

的面向对象编程的特性。它可以编译成纯Javascript，可以在任何浏览器，任何计算机和任何操作系统上运行，并且是开源的。

ES5 ES6 JavaScript TypeScript间的关系

ES是客户端脚本语言的规范，ES5、ES6是这个规范不同的版本，JavaScript和TypeScript是两种客户端脚本语言，JavaScript实现了ES5规范，

TypeScript实现了ES6规范。

TypeScript相对于JavaScript的优势

1. TypeScript支持ES6规范

ES6规范在2015年发布，它指出了未来一段时间内客户端脚本语言的发展方向。也就是说TypeScript语法在未来一段时间内将成为客户端脚本语言的主流语法。

2. 强大的IDE支持

强大的IDE支持主要体现在三个特性上：

<1>. 类型检查：在TypeScript里面是允许你为变量指定类型的，比如声明了一个字符串变量，那么当我为变量制定一个数字类型的值的时候，IDE会做出类型检查，会告诉你这

里可能有错误。这个特性会减少在开发阶段犯错误的几率。

<2>. 语法提示：在IDE里编写TypeScript的代码时，IDE会根据你当前所处的上下文把你能用的类、变量、方法和关键字都提示出来，我们只要直接去选就可以了。这个特性会

大大提高开发效率。

<3>. 重构：可以很方便的去修改你的变量、方法的名字或者是文件的名字。当我们做了这些修改的时候，IDE会自动帮你吧引用的变量或者调用这个方法的代码自动帮你修改

掉。这个特性可以提高开发效率，提高代码质量。

推荐WebStorm开发TypeScript程序，查看《使用WebSorm开发TypeScript的设置》。

3. Angular2的开发语言

最新的Angular2就是由TypeScript写成的，所以熟悉TypeScript对学习Angular有很大帮助。

搭建TypeScript开发环境

有两种主要的方式安装TypeScript工具

通过npm(Node.js包管理器)
安装TypeScript的Visual Studio插件

这里只讲述通过npm的方式安装TypeScript:

1.安装npm

$ curl http://npmjs.org/install.sh | sh
$ npm --v
4.4.1

2.安装TypeScript npm包

$ npm install -g typescript

安装完成后我们就可以使用 TypeScript 编译器，名称叫 tsc，可将编译结果生成 js 文件。

要编译 TypeScript 文件，可使用如下命令：

tsc filename.ts

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

为目标但ES5也是受支持的一个选项。TypeScript增加了对ECMAScript 6标准所建议的特性的支持。

创建Hello World示例

首先，创建一个index.html文件：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>Learning TypeScript</title>
	</head>
	<body>
		<script src="js/hello.js"></script>
	</body>
</html>

创建hello.ts文件，*.ts是TypeScript文件的后缀，向hello.ts文件添加如下代码：

alert('hello world in TypeScript!');

接下来，打开命令行，使用tsc命令编译hello.ts文件：

$ tsc hello.ts

此时，在相同目录下就会生成一个hello.js文件，然后在浏览器中打开index.html输出结果如下：

H小志

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
TypeScript学习起步

在学习TypeScript之前，首先要了解TypeScript与JavaScript的不同。TypeScript是微软公司于2012年发布（用以替代JavaScript）的一门语言，提供了类、模块和接口来帮助构建组件，帮助开发人员编写和维护应用程序。TypeScript是一个应用程序级的JavaScript开发语言。TypeScript是JavsScript类型的超集，它可以编译成纯J
复制链接

扫一扫