TypeScript—详解、小案例(配合源代码)

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

目录

1、TypeScript介绍

2、TypeScript优势

3、TypeScript常用类型

4、代码案例

4.1 字符串、数字、布尔

4.2 interface 接口

4.3 class类

4.4 class类-实现接口

4.5  class类-继承

5、总结


1、TypeScript介绍

图 1.1 TypeScript介绍
上图中展示的是TypeScript和JS之间的关系,即两者之间是包含的关系
图 1.2 TypeScript运行

上图中展示的是TypeScript运行,需要TSC转为JS文件才能运行。

这就需要在电脑中安装TSC文件。安装命令是 npm install -g typescript

2、TypeScript优势

图 2.1 TypeScript优势

上图中展示了TS语言的优势,总结一下,就是在开发过程中,开发工具可以提示语法错误。

3、TypeScript常用类型

图 3.1 TypeScript常用类型
上图中展示的是TS的常见数据类型
图 3.2 TypeScript类型标注位置
上图中展示是TypeScript类型标注位置,对变量、参数、函数返回值

4、代码案例

4.1 字符串、数字、布尔

图 4.1 字符串、数字、布尔

上图中展示的是字符串类型、布尔类型、数字类型和字面量类型的使用方法,其中字面量类型类似于枚举类型。

4.2 interface 接口

图 4.2 interface 接口

上图中展示的是TypeScript的 interface 接口类型。

4.3 class类

图 4.3 class类
上图中展示的是TypeScript的 class类型,这里的class和Java中的类相似,可以在类里面定义属性、函数。

4.4 class类-实现接口

图 4.4 class类-实现接口
上图中展示的在class类中实现接口,可以看到这里还是和JAVA语言是很相似的

4.5  class类-继承

图 4.5 class类-继承
上图中展示的是class类中的继承关系,即通过extends实现继承关系

5、总结

  • 6
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值