JavaScript 是于1996年被开发出来的,然后在1997年被提交给 ECMA 国际用于标准化工作,这导致了 ECMAScript 的诞生。同时,由于 JavaScript 与 ECMAScript 规范保持一致,所以可以说 JavaScript 是根据 ECMAScript 所实现的一个例子。因此令我们感到有趣的是:ECMAScript 是基于 JavaScript 的,而同时 JavaScript 又是基于 ECMAScript 的。
TypeScript是微软开发的一门脚本语言,它是JavaScript的超集,它遵循ES6语言规范。ES5,ES6都是脚本语言的规范,JavaScript和TypeScript是两种脚本语言。JavaScript实现了ES5,TypeScript实现了ES6
需要安装编译器compiler,来把TypeScript的代码转换成JavaScript的代码。因为现在很多浏览器都没有支持ES6规范,所以用ES6规范写出来的代码并不能在浏览器上跑。
安装npm install -g typescript 之后执行tsc -v看有没有安装成功
1、手动编译
首先找到TypeScript的安装目录,我的在”C:\Program Files (x86)\Microsoft SDKs\TypeScript\1.0“。
在 cmd输入命令:tsc 文件名.ts,回车编译。
2、设置自动编译
找到项目文件(*.csproj的文件),编辑打开,找到<Target Name="BeforeBuild">节点,在里面添加如下节点信息:
<Exec Command=""$(PROGRAMFILES)\Microsoft SDKs\TypeScript\1.0\tsc" @(TypeScriptCompile ->'"%(fullpath)"', ' ')" />
或
<Exec Command="tsc$(TypeScriptSourceMap) @(TypeScriptCompile ->'"%(fullpath)"', ' ')" />
3、解析编译
如果不想在项目中编译,这需要在页面添加<script src="typescript.js" />来编译。
typescript.js文件在 盘符/Program Files(x86)|Program Files/Microsoft SDKs/TypeScript/版本号/typescript.js 。
4、动态编译
在写完ts代码后,按下ctrl+s,右边视图区是出现对应编译后的js脚本。
4.1、找到项目文件,编辑打开
4.2、在<PropertyGroup>并行节点下,添加如下节点信息:
<PropertyGroup Condition="'$(Configuration)' == 'Debug'">
<TypeScriptTarget>ES5</TypeScriptTarget>
<TypeScriptRemoveComments>false</TypeScriptRemoveComments>
<TypeScriptSourceMap>true</TypeScriptSourceMap>
<TypeScriptModuleKind>AMD</TypeScriptModuleKind>
</PropertyGroup>
<PropertyGroup Condition="'$(Configuration)' == 'Release'">
<TypeScriptTarget>ES5</TypeScriptTarget>
<TypeScriptRemoveComments>true</TypeScriptRemoveComments>
<TypeScriptSourceMap>false</TypeScriptSourceMap>
<TypeScriptModuleKind>AMD</TypeScriptModuleKind>
</PropertyGroup>
<Import Project="$(VSToolsPath)\TypeScript\Microsoft.TypeScript.targets" Condition="Exists('$(VSToolsPath)\TypeScript\Microsoft.TypeScript.targets')" />
建议使用第4种编译方式,虽性能可能有些会下降,但编写完一段脚本后,按下ctrl+s,右侧js视图立马可以显示js脚本。这样有助于理解TS与JS之间的某种转换关系,也可以快速加深对TS语法的理解。