从两个角度理解 TypeScript 中的类型是什么?

更新日期: 2020-02-03 阅读: 2.2k 标签: 类型

TypeScript中的类型是什么?本文中描述了两种有助于理解它们的观点。


每个角度三个问题

以下三个问题对于理解类型如何工作非常重要,并且需要从两个角度分别回答。

myVariable 具有 MyType 类型是什么意思?

let myVariable: MyType = /*...*/;

SourceType 是否可以分配给 TargetType?

   let source: SourceType = /*...*/;
   let target: TargetType = source;

TypeUnion 是如何从 Type1,Type2 和 Type3 派生的?

type TypeUnion = Type1 | Type2 | Type3;


观点1:类型是值的集合

从这个角度来看,类型是一组值:

如果 myVariable 的类型为 MyType,则意味着所有可以分配给 myVariable 的值都必须是 MyType 集合的元素。

SourceType 可分配给 TargetType ,SourceType 是 TargetType 的子集。结果所有能被 SourceType 接受的值也被 TargetType 接受。

类型 Type1、Type2 和 Type3 的类型联合是定义它们集合的集合理论 union。


观点2:类型兼容性关系

从这个角度来看,我们不关心值本身以及在执行代码时它们是如何流动的。相反,我们采取了更加静态的观点:

源代码中包含 location,每个 location 都有一个静态类型。在支持 TypeScript 的编辑器中,如果将光标悬停在 location 上方,则可以看到该 location 的静态类型。

当源 location 通过分配、函数调用等连接到目标 location 时,则源 location 的类型必须与目标 location 的类型兼容。 TypeScript 规范通过所谓的类型关系定义类型兼容性。

类型关系分配兼容性定义什么时候把源类型 S 分配给目标类型 T:

S 和 T 是相同的类型。
S 或 T 是 any 类型。

让我们考虑以下问题:

如果将 myVariable 的静态类型分配给 MyType,则 myVariable 的类型为 MyType。

如果 SourceType 是兼容分配的,则可以将它们分配给 TargetType。

通过类型关系apparent 成员定义类型 union 的工作方式。

TypeScript 类型系统的一个有趣特征是,同一变量在不同位置可以具有不同的静态类型:

const arr = [];
// %inferred-type: any[]
arr;

arr.push(123);
// %inferred-type: number[]
arr;

arr.push('abc');
// %inferred-type: (string | number)[]
arr;


名义类型系统与结构类型系统

静态类型系统的职责之一是确定两种静态类型是否兼容:

实际参数的静态类型 U(例如,通过函数调用提供)

对应形式参数的静态类型 T(在函数定义中指定)

这通常意味着检查 U 是否为 T 的子类型。大致有两种检查方法:

名义类型系统中,两个静态类型如果具有相同的标识(“名称”)则相等。如果明确声明了它们的子类型关系,则一种类型是另一种类型的子类型。

名义类型的语言为 C ++、Java、C#、Swift 和 Rust。

结构类型系统中,两个静态类型具有相同的结构(如果它们具有相同的名称和相同的类型)则相等。如果 U 具有 T 的所有部分(可能还有其他),并且 U 的每个部分具有 T 的相应部分的子类型,则类型 U 是另一种类型 T 的子类型。

具有结构化类型的语言为 OCaml/ReasonML、Haskell 和 TypeScript。

以下代码在名义类型系统中会产生类型错误(A 行),但在 TypeScript 的结构类型系统中是合法的,因为类 A 和类 B 具有相同的结构:

class A {
  name = 'A';
}
class B {
  name = 'B';
}
const someVariable: A = new B(); // (A)

TypeScript 的 interface 在结构上也可以正常工作 —— 不必为了匹配而实现它们:

interface Point {
  x: number;
  y: number;
}
const point: Point = {x: 1, y: 2}; // OK
作者:Dr. Axel Rauschmayer
翻译:疯狂的技术
原文:https://2ality.com/2020/02/


本文内容仅供个人学习、研究或参考使用,不构成任何形式的决策建议、专业指导或法律依据。未经授权,禁止任何单位或个人以商业售卖、虚假宣传、侵权传播等非学习研究目的使用本文内容。如需分享或转载,请保留原文来源信息,不得篡改、删减内容或侵犯相关权益。感谢您的理解与支持!

链接: https://fly63.com/article/detial/8104

相关推荐

Js如何将String转化为Int

字符串到整型的一个转换,在面试过程中或者在工作中都会频繁遇到,那么string到js怎么转换呢 ?parseInt方法在format\'00\'开头的数字时会当作2进制转10进制的方法进行转换

Typescript内置类型与自定义类型

大家用过 Typescript 都清楚,很多时候我们需要提前声明一个类型,再将类型赋予变量。例如在业务中,我们需要渲染一个表格,往往需要定义:

Js实现base64,file和blob相互转换

JavaScript实现base64,file和blob相互转换:base64转为Blob;Blob转为base64;base64转换为file;js图片转换为base64;在Java中base64和File相互转换

Js的6种基本数据类型

在JS中一共有六种数据类型 String:字符串 Number:数值 Boolean:布尔值 Null:空值 Undefined:未定义 Object:对象 ,其中String,Number,Boolean,Null,Undefined属于基本数据类型而Object属于引用数据类型

JavaScript判断字符串是否为数字类型

JavaScript中有Number.isInteger可以判断一个字符串是否为整数。不过目前JS没有内置的函数来判断一个数字是否为包含小数的数字:

TypeScript never 类型

在类型理论(数学逻辑中的一种理论)中, 底部类型 是没有值的类型。也称为零或空类型,有时用 falsum(⊥)表示。 数学理论与计算机的发展是相辅相成的,底部类型在计算机科学中也有一定的应用场景。

JS数据类型转换表

下表显示了将不同的JavaScript值转换为Number,String和Boolean的结果:注意:引号(\\\"\\\")中的值表示字符串值。在红色的值是程序员可能不希望被转换为的值。

Js的typeof返回哪些数据类型?

JavaScript中的数据类型:值类型(基本类型):字符串(String)、数字(Number)、布尔(Boolean)、对空(Null)、未定义(Undefined)、Symbol。引用数据类型:对象(Object)、数组(Array)、函数(Function)。

为你的 JavaScript 项目添加智能提示和类型检查

近在做项目代码重构,其中有一个要求是为代码添加智能提示和类型检查。智能提示,英文为 IntelliSense,能为开发者提供代码智能补全、悬浮提示、跳转定义等功能,帮助其正确并且快速完成编码。

JS中的布尔 数字 字符串

JS中所有的值都可以转换成布尔类型 使用Boolean()或者 !!(两个感叹号),JS中所有的值都可以转换成数字类型,使用Number()或+。数字类型转换场景目的只有一个,用于计算,将后台传递的数据,从字符串转换为数字并参与计算

点击更多...

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!