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、总结

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/805818.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Web路径专题

文章目录 1.资源定位1.前置条件上下文路径设置 2.上下文路径介绍重点说明 3.资源定位方式资源路径 上下文路径 资源位置a.html定位C.java定位 4.浏览器和服务器解析的区别1.浏览器解析/(地址变化)2.服务器解析/(地址不变) 5.带/…

git学习 1

打开自己想要存放git仓库的文件夹,右键打开git bush,用git init命令建立仓库 用 ls -a(表示全都要看,包括隐藏的)可以看到git仓库 也可以用 git clone 接github链接(点code选项里面会给链接,结尾是git的那个&#xf…

OpenHarmony南向开发实例:【智能可燃气体检测系统】

样例简介 本项目是基于BearPi套件开发的智能可燃气体检测Demo,该系统内主要由小熊派单板套件和和MQ5可燃气体检测传感器组成。 智能可燃气体检测系统可以通过云和手机建立连接,可以在手机上控制感应的阈值,传感器感知到的可燃气体浓度超过阈…

C++ | Leetcode C++题解之第12题整数转罗马数字

题目: 题解: const string thousands[] {"", "M", "MM", "MMM"}; const string hundreds[] {"", "C", "CC", "CCC", "CD", "D", "DC&qu…

azkaban的写法

先创建一个.job文件和一个.sql文件 sql语法写到一个test名字的文件里,之后job写法如下: typecommand commandhive -f test6.sql 一定要严格写,不管是字母还是空格,单引号中就是sql文件的名字 然后将它们一块打包,启动…

ubuntu系统逻辑卷Logical Volume扩容根分区

Linux LVM详解 https://blog.csdn.net/qq_35745940/article/details/119054949 https://blog.csdn.net/weixin_41891696/article/details/118805670 https://blog.51cto.com/woyaoxuelinux/1870299 LVM(Logical Volume Manager)逻辑卷管理&#xff0c…

贪心算法|452.用最少数量的箭引爆气球

力扣题目链接 class Solution { private:static bool cmp(const vector<int>& a, const vector<int>& b) {return a[0] < b[0];} public:int findMinArrowShots(vector<vector<int>>& points) {if (points.size() 0) return 0;sort(p…

rk3588开发板上安装ssh服务

目的&#xff1a;实现远程访问和控制&#xff0c;其他主机远程控制rk3588 方法及操作步骤&#xff1a; 1&#xff09;安装&#xff1a;sudo apt install openssh-server 2&#xff09; 查看运行状态 sudo systemctl status ssh 其它主机远程连接该开发板的ip和端口22即可

urwid,一个好用的 Python 库!

更多资料获取 &#x1f4da; 个人网站&#xff1a;ipengtao.com 大家好&#xff0c;今天为大家分享一个好用的 Python 库 - urwid。 Github地址&#xff1a;https://github.com/urwid/urwid Urwid 是一个功能强大的 Python 库&#xff0c;用于创建基于文本的用户界面&#xf…

[23年蓝桥杯H题] 合并石子

问题描述 在桌面从左至右横向摆放着 N 堆石子。每一堆石子都有着相同的颜色&#xff0c;颜 色可能是颜色 0 &#xff0c;颜色 1 或者颜色 2 中的其中一种。 现在要对石子进行合并&#xff0c;规定每次只能选择位置相邻并且颜色相同的两堆 石子进行合并。合并后新堆的相对位置保…

unipush+个推实现消息推送

1.注册个推平台的帐号个推&#xff0c;专业的数据智能服务商-为垂直领域提供数据智能解决方案 2.应用列表中选择新增应用/服务 3.填写下应用信息4.创建好应用后在manifest.json中的sdkConfigs配置上写入appid、appkey、appsecret "sdkConfigs" : {"ad" :…

【Keil5-Boot和APP配置】

Keil5-Boot和App配置 ■ Keil5-Boot和APP配置■ 一&#xff1a;sct文件 sct文件配置■ 二&#xff1a;发布版本不需要在 C/C&#xff0c;Asm&#xff0c;Linker&#xff0c;中添加 CMDDEBUG 宏定义。■ 三&#xff1a;Debug版本需要在Linker添加 --pd"-DCMDDEBUG" 才…

windows版本-idea中下载的java版本在哪

1、点击idea的file-projectStructure 进入&#xff1a; 通过电脑目录进入该目录 找到bin目录&#xff0c;copy该目录地址 copy下来之后设置到系统环境变量中

脑电放大 LM386

LM386介绍 LM386 是一种音频集成功放&#xff0c;具有自身功耗低、电压增益可调整电源电压范围大、外接元件少和总谐波失真小等优点&#xff0c;广泛应用于录音机和收音机之中。 电源电压 4-12V 或 5-18V(LM386N-4);静态消耗电流为 4mA;电压增益为20-200dB;在引脚1和8开路时&a…

scan纯享代码 java

scan纯享代码 java 1 scan用法2 next3 nextLine 1 scan用法 在录入中间有回车的字符串的时候&#xff0c;不要使用next&#xff08;&#xff09;和nextLine&#xff08;&#xff09;的配合&#xff01;&#xff01; scan用法 Scanner scannernew Scanner(System.in); String…

【通信原理笔记】【三】模拟信号调制——3.5 角度调制(FM、PM)与其频谱特性

文章目录 前言一、相位与频率二、PM和FM的数学表示三、FM的频谱四、FM信号的带宽——卡松公式总结 前言 在之前介绍的几种调制方式中&#xff0c;我提到信噪比时计算的是用户解调后的信噪比&#xff0c;然而在北邮通信原理课中考虑的是解调器输入的信噪比&#xff0c;即考虑的…

python 图片 中文识别 pytesseract

python 图片 中文识别 pytesseract 参考链接 https://blog.csdn.net/weixin_47754149/article/details/125651707 微信 中 长截图&#xff0c;然后传到 电脑上面 安装 方法 https://digi.bib.uni-mannheim.de/tesseract/ tesseract-ocr-w64-setup-5.3.3.20231005.exe 安装的…

linux常用目录结构(目录命令)--6986字详谈

前面与大家讨论了linux的发展与由来&#xff08;这一块挺多的&#xff0c;小编还没有编写完成&#xff0c;希望大家理解&#xff09;&#xff0c;紧接着谈到了vmware安装及运行所存在的故障&#xff08;鉴定错误&#xff0c;虚拟机没有网&#xff0c;蓝屏等常见现象的总结及处理…

【vim 学习系列文章 20 -- a:mode 的值有哪些?】

请阅读【嵌入式开发学习必备专栏 之 Vim】 文章目录 a:mode 的值有哪些?举例Vim 底部状态栏设置 a:mode 的值有哪些? 在 Vim 脚本语言中&#xff0c;a:mode 常常用于函数内部&#xff0c;以获取该函数被调用时 Vim 正处于的模式。它主常用于那些可以从不同模式下被调用的函数…

what is tty?

waht is tty? 黑话&#xff1a;TTY 为什么使用Linux的时候CtrlC就会终止一个命令运行,ta是如何设置的? stty -a 桌面切换 CTRL ALT F1 – 锁屏 CTRL ALT F2 – 桌面环境 CTRL ALT F3 – TTY3 CTRL ALT F4 – TTY4 CTRL ALT F5 – TTY5 CTRL ALT F6 – TTY6