所在的位置: html >> html资源 >> 初识TypeScript

初识TypeScript

一、TypeScript概述

TypeScript是JavaScript的一个超集,支持ECMAScript6(ES6)标准。

TypeScript由微软开发的自由和开源的编程语言。

TypeScript设计目标是开发大型应用,它可以编译成纯JavaScript,编译出来的JavaScript可以运行在任何浏览器上。

语言特性

TypeScript是一种给JavaScript添加特性的语言扩展,其增加的功能包括:

类型批注和编译时类型检查

类型推断

类型擦除

接口

枚举

Mixin

泛型编程

名字空间

元组

Await

以下功能是从ECMA反向移植而来:

模块

lambda函数的箭头语法

可选参数以及默认参数

JavaScript与TypeScript的区别

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

TypeScript可处理已有的JavaScript代码,并只对其中的TypeScript代码进行编译。

二、TypeScript安装及环境验证

接下来介绍TypeScript环境的安装,我们需要使用到npm工具安装,npm是node的包管理器,在安装NodeJS时,会同时安装npm工具,关于NodeJS安装参考:

Windows下NodeJS的安装和验证

打开Windows下的命令提示符,输入命令

npminstall-gtypescript

进行typescript工具的安装

安装完成以后,接着输入命令

tsc-v

查看typescript编译器的版本信息

三、TypeScript初步入门使用

通常我们使用.ts作为TypeScript代码文件的扩展名,首先创建一个名为test.ts的文件,里面写上如下两行简单代码

letmsg="Hello,TypeScript";

console.log(msg);

输入命令

tsctest.ts

使用TypeScript编译器进行编译,此时在当前目录下(与test.ts同一目录)就会生成一个test.js文件

通过node命令来运行js脚本

nodetest.js

将会看到信息输出

四、TypeScript初步Web入门

创建一个名为demo.ts文件

类型注解

TypeScript里的类型注解是一种轻量级的为函数或变量添加约束的方式。

比如我们希望sayHello函数接收一个字符串参数。然后尝试把sayHello的调用改成传入一个数组,那么使用tsc编译就会报错

我们创建一个index.html文件,内容如下图所示:

用浏览器运行html网页,看到的内容如下:

以上基础的概念掌握后,剩下的就是熟悉具体的TypeScript语法,使用编程工具,比如VisualStudioCode等根据实际业务进行前端编程开发啦




转载请注明:http://www.aierlanlan.com/rzgz/2716.html

  • 上一篇文章:
  •   
  • 下一篇文章: