TypeScript
TypeScript是一种由微软开发的自由和开源的编程语言。它是JavaScript的一个超集,兼容JavaScript,可以载入JS代码然后运行。它与JavaScript相比进步的地方包括:加入注释,让编译器理解所支持的对象和函数,编译器会移除注释,不会增加开销。 而JavaScript只是一个脚本语言,并非设计用于开发大型 Web 应用,JavaScript 没有提供类和模块的概念,而TypeScript扩展实现了这些特性。
它扩展了 JavaScript 的语法,因此现有的JavaScript代码可与其代码一起工作无需任何修改,它通过类型注解提供编译时的静态类型检查。TypeScript可处理已有的JavaScript代码,并只对其中的TypeScript代码进行编译。
TypeScript 最大的特点就是类型化,因此才叫做TypeScript。比起弱类型的JavaScript,类型化的TypeScript显得更加容易维护。
要在应用中使用 TypeScript 必须先编译,编译的结果是生成 js 文件,你可通过TypeScript 编译器 tsc 命令来完成这个过程。如要编译test.ts(TypeScript文件的扩展名为.ts),可用如下命令:
tsc test.ts
编译完成后就会在当前目录生成名为test.js的文件。
注:不要将TypeScript看作是一门新的语言,它只是为了提升JavaScript代码质量的一个工具,最终TypeScript仍然要编译成JavaScript。
Hello World
前面我们介绍了什么是TypeScript,那我们就先来看一个经典的程序Hello World。代码如下:
<script type="text/typescript">
var hw:string="Hello World!"; //定义一个字符串变量
document.write(<h1>"+hw+"</h1>); //将结果显示在页面上,这句话是不是很熟悉呢。
</script>
看到这里同学们是不是感觉很熟悉,没有错,就是这样,我们可以把javascript的代码用到TypeScript里面运行。同学们也看到上面的代码是写在script标签中,注意其中的类型是typescript。如果想在页面上直接编译看到结果,还需要引用typescript.min.js与typescript.compile.min.js。如下代码:
<html>
<head>
<title>demo</title>
</head>
<body>
<script type="text/typescript">
// TypeScript代码
</script>
<script src="lib/typescript.min.js"></script>
<script src="lib/typescript.compile.min.js"></script>
</body>
</html>
对比
我们先写一个TypeScript的例子,如下代码,定义一个学生类(在后面的内容中介绍),然后调用:
class Student{
name:string;
age:number;
}
var s1=new Student();
s1.name="Jim";
s1.age=20;
document.write("name:"+s1.name+" age:"+s1.age);
我们再来看用TypeScript编译以后的JavaScript代码:
var Student = (function () {
function Student() {
}
return Student;
})();
var s1 = new Student();
s1.name = "Jim";
s1.age = 20;
document.write("name:" + s1.name + " age:" + s1.age);
通过对代码的对比,是不是感觉TypeScript代码更简洁,更好理解,更易于维护。是不是感觉与C#,Java,C++类似。