TypeScript系列之-理解TypeScript类型系统画图讲解

TypeScript的输入输出

如果我们把 Typescript 编译器看成一个黑盒的话。其输入则是使用 TypeScript 语法书写的文本或者文本集合

输出是编译之后的 JS 文件 和 .d.ts 的声明文件

其中 JS 是将来需要运行的文件(里面是没有ts语法,有一个类型擦除的操作),而 .d.ts 声明文件则是 ts 文件中的类型声明,这个类型声明就是你在 ts 文件声明的类型和 TypeScript 类型推导系统推导的类型。当然你也可以自己写 .d.ts 声明文件。

TypeScript作用

  1. 来自知乎网友的回答

至于说什么类型提示,其实很鸡肋,代码整体读熟了,这个提示有啥用?如果没读熟,ts也帮不了你。为了个提示,我写一堆interface,还有一大堆文件。。。真的是为了拉屎,现场盖厕所一样。

我这只是为了喷那些活动页也特么要上ts的项目。至于复杂分层多的项目,ts是有必要的。

----。。。。

  1. 提供了丰富的类型系统,比如interface,type......
  2. 提供了类型操作 API。TypeScript 不但提供内置类型,用户也可以利用集合操作和泛型对类型操作从而生成新的类型

  1. 对每一种类型的属性和方法都进行了定义(也就是类型检查作用)。
  2. 提供了模块系统(module,namespace)
  3. 提供了更加方面的 API,比如 class(这在 ES6 class 出来之前尤其好用),装饰器等

。。。。。。。

TypeScript 编译器原理

这块我自己一脸懵逼,先放着。。。。。

类型系统

变量类型和值类型

  • JavaScript 中的类型其实是值的类型。实际上不仅仅是 JavaScript,任何动态类型语言都是如此,这也是动态类型语言的本质。
  • Typescript 中的类型其实是变量的类型。实际上不仅仅是 Typescript,任何静态类型语言都是如此,这也是静态类型语言的本质。

在 JavaScript 中,一个变量可以是任意类型 ,对于 Typescript 来说,一个变量只能接受和它类型兼容的类型的值

let a = 1
let a = 'das'
let a = []
//js中变量可以任意赋值
let a: number = 1;
a = "lucifer"; // error
a = 2222; // ok 智能赋值数字

从集合的角度理解TS数据类型

TypeScript 只检查 Shape,即类型定义的约束条件,听起来和集合(Set)这一概念颇为相像。从集合的角度能更深层次地理解 TypeScript 的类型。

如上number可以看作所有数字的并集,string可以看作所有字符串的并集

补充:number 和 Nunmber 区别

平常我们js会看到两种数字类型number和Number,它们之间的区别是什么如下:

如上number表示的是二进制的数据结构,而Number表示的是封装的对象。但我们平时用let a = 45;也可以用a.toFixed(2)呀!其中js帮你把number转换成Number,调用完toFixed后又给你返回数字,该过程叫包装对象

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

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

相关文章

【保姆级】国内Onlyfans如何订阅?OnlyFans订阅保姆级指南

​ 一、 Onlyfans介绍 OnlyFans是一个创立于2016年的在线平台和应用程序,它集结了众多来自健身、音乐、艺术等领域的内容创作者,呈现了他们精彩纷呈的作品。该平台颠覆了传统商业模式,为创作者提供了一个展示独特内容的舞台,用户…

【报错】Python3.9及以上相对路径导入文件夹方式

Python3.9及以上相对路径导入文件夹 python跨文件夹调用别的文件夹下的py文件或参数方式 5.7. 包相对导入 相对导入使用前缀点号。 一个前缀点号表示相对导入从当前包开始。 两个或更多前缀点号表示对当前包的上级包的相对导入,第一个点号之后的每个点号代表一级…

学python能赚钱吗???

python爬虫去哪接单 python爬虫接单的方式有两种 一,接定制需求的单子 爬虫定制的需求其实很多,比如 “爬取某某电商网站的评论”,这类需求一般是按照爬取数据量的大小来收费,价格不会太高,正常500的样子。 常见的…

个推助力小米汽车APP实现智能用户触达,打造智能出行新体验

4月3日,小米SU7首批交付仪式在北京亦庄的小米汽车工厂总装车间举行,全国28城交付中心也同步开启首批交付。随着小米SU7系列汽车的正式发售和交付,小米汽车APP迎来了用户体量的爆发式增长。 小米汽车APP是小米汽车官方推出的手机应用&#xff…

linux编辑技巧

vim的模式 正常模式:用于导航和打开文件。编辑模式:用于输入文本。可视模式:用于选择文本块进行操作。命令模式:执行命令的强大方式。 正常模式 移动 hjkl上下左右^开头 $结尾gg/G 文件开头或结尾 ctrlo返回ctrlu ctrlf&#xff…

复试专业课问题

1、数据结构:详细描述归并排序的过程 归并排序是用分治思想,分治模式在每一层递归上有三个步骤: 分解(Divide):将n个元素分成个含n/2个元素的子序列。解决(Conquer):用…

Vue - 你知道Vue组件之间是如何进行数据传递的吗

难度级别:中级及以上 提问概率:85% 这道题还可以理解为Vue组件之间的数据是如何进行共享的,也可以理解为组件之间是如何通信的,很多人叫法不同,但都是说的同一个意思。我们知道,在Vue单页面应用项目中,所有的组件都是被嵌套在App.vue内…

swampCTF 2024

swampCTF 2024 MISC Discord Challenge swampCTF{w3lc0m3_t0_th3_swamp} What the Form google form不停重定向,直接F12看一下。flag就在前端。 swampCTF{F0rm5_K33p5_D4T4_H1dd3n} OSINT Lost in Space 图片是旅行者2号,问距离地球多少个天文单…

python中的垃圾回收机制

Python中的垃圾回收(Garbage Collection,简称GC)机制是一个自动内存管理过程,它负责在对象不再被使用时释放内存资源。Python的垃圾回收主要依赖于引用计数(Reference Counting)来跟踪和回收不再使用的对象…

windows下python3安装rolabelimg或者labelimg2标注斜框

1.前言 大家常用labelimg标注物体,但当目标物体是倾斜角度时,labelimg标注时会把不属于物体的一大片区域也标注,这样标注效果不大好,那么有什么工具可以标注倾斜的矩形框呢,本篇通过介绍安装rolabelimg或者labelimg2&…

创建型模式--3.工厂模式 【人造恶魔果实工厂2】

1. 简单工厂模式的弊端 在上一节简单工厂模式中,创建了一个工厂类,用于生产需要的对象,但是这种方式有一个弊端,它违反了设计模式中的开放-封闭原则,先来看相关的代码: // 恶魔果实工厂类 enum class Typ…

初识虚拟机:探索数字世界的神奇工具

前言 在计算机科学领域,虚拟机是一种强大而神奇的工具,它可以让我们在一台计算机上同时运行多个操作系统,仿佛创造了一个独立的数字世界。本文将带你深入探索虚拟机,帮助你更好地理解这个让计算机变得更加灵活多样的工具。 什么…

使用美化方法设计项目主窗体(二)

使用美化方法设计项目主窗体 分析效果图的实现 效果图: 新建 Windows 窗体 新窗体命名:FrmMain.cs修改窗体的位置:StartPosition:CenterScreen窗体的无边框设计:FormBorderStyle:none修改窗体的大小&a…

Go语言并发(一)——goroutine与Waitgroup

协程 前言 在很多语言中都会提到并发的概念, 例如python, Java,C等等,一般来说 都会 使用多线程或多进程来 实现并发调度,但是多线程/进程 一般会耗费大量内存, 而在go 语言中我们可以使用协程来达到并发调度的目的&…

高级优化理论与方法(七)

高级优化理论与方法(七) Solving Linear EquationsCase 2TheoremKaczmarzs AlgorithmTheoremExample PseudoinverseDefinitionSpecial Case 1Special Case 2 Properties of PseudoinverseLemma 1: Unique pseudoinverseLemma 2: Full Rank Factorization…

Pytorch实用教程:Pytorch中model.eval()和torch.no_grad()的作用及用法

文章目录 1. model.eval()为什么需要 .eval() 方法?使用 .eval() 方法示例 注意事项 2. torch.no_grad()为什么需要 torch.no_grad()?使用 torch.no_grad()示例场景注意事项 1. model.eval() model.eval() 在 PyTorch 中是一个重要的方法,用…

MySQL8.3.0 主从复制方案(master/slave)

一 、什么是MySQL主从 MySQL主从(Master-Slave)复制是一种数据复制机制,用于将一个MySQL数据库服务器(主服务器)的数据复制到其他一个或多个MySQL数据库服务器(从服务器)。这种复制机制可以提供…

如何让阿里云AI001号员工帮我写代码(含IDEA插件使用)

国内首个AI程序员入职阿里云:专属工号AI001,KPI是一人写完公司20%代码。 不管是真是假,AI 程序员发展的趋势是无法改变的,小米汽车发布会上,雷军说到小米汽车工厂的自动化率达到90%以上,有些车间甚至100%的…

手术麻醉系统源码 医疗信息管理系统源码C#.net6.0+ vs2022,vscode+BS网页版 手麻系统源码

手术麻醉系统源码 医疗信息管理系统源码C#.net6.0 vs2022,vscodeB/S网页版 手麻系统源码 手术麻醉管理系统是应用于医院手术室、麻醉科室的计算机软件系统。该系统针对整个围术期,对病人进行全程跟踪与信息管理,自动集成病人HIS、LIS、RIS、PACS信息&…

jdk8新特性 方法引用

简介 lambda表达式是用来简化匿名内部类的方法引用 使用来简化 lambda表达式的 方法引用的标志 两个冒号 静态方法 静态方法 class CompareByAge {public static int compare(Student o1, Student o2) {return o1.getAge() - o2.getAge();} }静态方法引用 Arrays.sort(students…