针对 JavaScript 上面的问题,聪明的同学就想那我们就给 JavaScript 加个类型吧,和 Java 一样,能够对变量的类型进行定义,这个想法就是 TypeScript 的类型系统, 在很大程度上弥补了 从 TypeScript 的名字就可以看出来,「类型」是其最核心的特性,TypeScript 也主要致力于解决 JavaScript 的类型混乱问题。 TypeScript 是静态类型 类型系统按照「类型检查的时机」来分类,可以分为下面 2 种 动态类型 静态类型 动态类型是指在运行时才会进行类型检查,这种语言的类型错误往往会导致运行时错误。 TypeScript 在运行前需要先编译为 JavaScript,而在编译阶段就会进行类型检查,所以 TypeScript 是静态类型,这段 TypeScript 代码在编译阶段就会报错了: let foo 大部分 JavaScript 代码都只需要经过少量的修改(或者完全不用修改)就变成 TypeScript 代码,这得益于 TypeScript 强大的[类型推论][],即使不去手动声明变量 foo 的类型
系列安排: 上帝视角看 TypeScript[1](已发布) TypeScript 类型系统(就是本文) types 和 @types 是什么? 除了修复日常的 bug 之外,TypeScript 也在不断发布新的功能,比如最新 4.0.0 beta 版本的**标签元祖**[3] 的功能就对智能提示这块很有用。 明白了 JavaScript 和 TypeScript 类型的区别和联系之后,我们就可以来进入我们本文的主题了:「类型系统」。 总之,我们使用 Typescript 的主要目的仍然是要它的静态类型检查,帮助我们提供代码的扩展性和可维护性。因此 Typescript 需要维护一套完整的类型系统。 「类型系统包括 1. 总结 本文主要讲了 Typescript 的类型系统。Typescript 和 JavaScript 的类型是很不一样的。
基础类型 TypeScript 支持与 JavaScript 几乎相同的数据类型,此外还提供了实用的枚举类型方便我们使用。 这些浮点数的类型是 number。 除了支持十进制和十六进制字面量,TypeScript还支持ECMAScript 2015中引入的二进制和八进制字面量。 第一种,可以在元素类型后面接上 [],表示由此类型元素组成的一个数组: let list: number[] = [1, 2, 3]; let list1: string[] = ['1', '2', 第二种方式是使用数组泛型,Array<元素类型>: let list2: Array<number> = [1, 2, 3] console.log(list2) 元组 Tuple 元组类型允许表示一个已知元素数量和类型的数组 类型推断 类型推断: TypeScript会在没有明确的指定类型的时候推测出一个类型 有下面2种情况: 定义变量时赋值了, 推断为对应的类型.
TypeScript 是 JavaScript 的一个超集,添加了类型系统和编译期错误检查等功能 => 静态类型检查。 类型指的是一组具有相同特征的值。 静态类型系统描述了运行程序时的值的形状和行为。 TypeScript 支持块级类型声明,即类型可以声明在代码块(用大括号表示)里面,只在当前代码块有效。 动态类型 pk 静态类型 JavaScript 动态类型语言,没有使用限制。 let test = 'ligang' test = 33 TypeScript 静态类型语言,引入了类型系统。 let test: string = 'ligang' test = 33 // 不能将类型“number”分配给类型“string” 特性 JavaScript TypeScript 类型系统 动态类型 未来兼容性 随着 ECMAScript 的更新而更新 需要更新 TypeScript 以支持新特性 TypeScript 本身不执行任何代码,只是添加了一个类型系统,用于在编译时提供类型安全和错误检查
一.类型推断 赋值推断 类型推断机制减轻了强类型带来的语法负担,例如: let x = 3; // 等价于 let x: number = 3; 编译器能够根据变量初始值3推断出变量类型是number ,具体如下: 变量或(类)成员初始值 参数默认值 函数返回值 这3类值都能提供直接的类型信息,进而确定目标类型。 语句 二.子类型兼容性 TypeScript的13种基本类型中,类型层级关系如下: ? ),反过来的话是安全的,因为返回值类型相同,参数绰绰有余,msg的类型也兼容(string是any的子类型) 具体的,TypeScript类型系统对函数类型的兼容性判定规则如下: 参数:要求对应参数的类型兼容 ,因此为了保持类型系统简单,有的语言也认为类型构造器不变,虽然这样可能会违反类型安全 特殊地,TypeScript里的函数类型是双变的,例如: interface Comparer<T> { compare
theme: nico 现代JavaScript高级小册 深入浅出Dart 现代TypeScript高级小册 类型系统层级 TypeScript 的类型系统是强类型和静态类型的,这为开发者提供了强大的类型检查和类型安全保障 为了更好地理解 TypeScript 的类型系统,本文将全面介绍其类型系统层级,包括顶层类型(Top Type)和底层类型(Bottom Type),以及在这个层次结构中如何处理和操作各种类型。 理解 TypeScript 的类型系统层级有助于我们更好地使用和掌握 TypeScript,写出更健壮、可维护的代码。 1. 3. 对比:顶层类型 vs 底层类型 顶层类型和底层类型是 TypeScript 类型系统的两个重要组成部分,它们各自扮演着不同的角色。 理解 TypeScript 的类型系统层级有助于我们编写更健壮、可维护的 TypeScript 代码。尽管 any 类型提供了很大的灵活性,但是它的滥用可能会削弱 TypeScript 的类型安全性。
[TypeScript] 前言 在初步学习了 TypeScript 的变量声明后,对它的静态类型检查功能简直是爱不释手,但同时也发现一个问题:在正常的开发中,一个变量的类型有时可能不仅仅只限于 number 到底该怎样限制 res 的类型,让它同时满足 number 和 string 的类型检查呢?这就涉及到我们今天要学的 TypeScript 的另一种类型声明——联合类型。 基本语法如下: let tag:Type1|Type2|Type3 其中使用“|”分隔的三种类型代表变量 tag 可被赋值的类型范围。 在给 res 赋值为 12 后,TypeScript 推断 res 的类型为 number,number 类型不存在 .length 属性,所以报错。 总结 以上就是 TypeScript 联合类型的相关知识,总结起来就是: 联合类型包含了变量可能的所有类型; 对联合类型变量赋值为联合类型之外的值,会产生报错; 在不能确定联合类型变量的最终类型之前,只能访问联合类型所共有的属性和方法
第一种是元素类型后面接上 [],表示由此类型元素组成的一个数组: let arr: number[] = [1, 2, 3, 4]; // 如果在数组中加入其他元素会报错 第二种是使用数组泛型定义数组: let arr1: any[] = [1, "2", 3, "4"]; // 这个数组中可以假如任意类型的元素 元组 Tuple 元组类型允许表示一个已知元素数量和类型的数组,各元素的类型不必相同。 let arr2:[number, string, number] = [1,"2",3]; // 若果写成 [1,2,3] 会报错 元素是严格规定了数组的长度和每个位置的元素类型,并且在赋值时需要严格对应 ("编程三昧"); } 扩展 1、TypeScript 会根据你给变量的初始值判断默认类型。 总结 以上就是 TypeScript 中的基础数据类型介绍,总结起来就是: 在变量(函数的括号)后面添加冒号,后面跟上期望的类型,即可限制类型的前后一致性; 如果没有显式的添加类型限制,TypeScript
当我们在TypeScript中声明变量但没有明确指定其类型时,TypeScript会尝试根据变量的值进行类型推断。这样可以帮助我们避免手动指定所有类型,使代码更简洁,同时也提供了更好的类型安全性。 TypeScript 推断 y 为 string 类型let z = true; // TypeScript 推断 z 为 boolean 类型在这个例子中,我们没有显式地给变量x、y和z指定类型,TypeScript 数组类型推断let numbers = [1, 2, 3]; // TypeScript 推断 numbers 为 number[] 类型let names = ["Alice", "Bob", "Charlie "]; // TypeScript 推断 names 为 string[] 类型TypeScript会检查数组中所有元素的类型,并根据元素类型推断出数组的类型。 } 类型TypeScript会根据对象字面量中的键值对进行类型推断。
类型守卫在前几篇介绍了断言,在使用断言时我们已经确定了变量的类型,确定该类型时一定存在(否则则会欺骗编译,运行时报错),那么为什么还要类型守卫呢? 因为类型断言还是需要借助类型守卫的,类型守卫主要是用来判断未知类型是不是所需要的类型。 console.log('A' + val.a) }}3、instanceof-类型分类场景下的身份确认为什么用instanceof呢? 这种写法称作类型谓词,使用类型谓词的函数称为类型谓词函数,该函数的返回值必须的boolean类型。 (1)函数参数形式函数中的参数类型为多个类型,通过is关键字自定义类型,将函数参数精确到某种类型,然后再执行相应的逻辑。
当我们使用TypeScript编写代码时,类型声明是非常重要的,它帮助我们定义变量、函数、类等的类型,从而提供更好的代码提示、类型检查和代码可读性。 以下是关于TypeScript类型声明的详细内容:基本类型声明在TypeScript中,我们可以使用以下关键字来声明基本类型:let num: number = 42;let str: string = "Hello";let bool: boolean = true;let arr: number[] = [1, 2, 3];let tuple: [string, number] = ["hello (Type Assertion)类型断言允许我们手动指定变量的类型,并告诉TypeScript编译器我们知道更多关于变量的类型信息。 : number; readonly id: number;}以上是关于TypeScript类型声明的一些重要内容。通过合理使用类型声明,我们可以增强代码的可读性、类型安全性和可维护性。
TypeScript 基础类型 TypeScript 包含的数据类型如下表: 数据类型 关键字 描述 任意类型 any 声明为 any 的变量可以赋予任意类型的值。 **注意:**TypeScript 和 JavaScript 没有整数类型。 ---- Any 类型 任意值是 TypeScript 针对编程时类型不明确的变量使用的一种数据类型,它常用于以下三种情况。 Null 和 Undefined 是其他任何类型(包括 void)的子类型,可以赋值给其它类型,如数字类型,此时,赋值后的类型会变成 null 或 undefined。 而在TypeScript中启用严格的空校验(--strictNullChecks)特性,就可以使得null 和 undefined 只能被赋值给 void 或本身对应的类型,示例代码如下: // 启用
一、TypeScript 的安装及使用 1、安装 npm i typescript -g // ts 全局包 npm i ts-node -g // 使用 ts-node 直接运行 ts 文件 2、使用 将 TypeScript 转换为 JavaScript 代码: tsc test.ts 使用 node 命令来执行 test.js 文件: $ node test.js 二、TypeScript 基础类型 1、任意类型 any 声明为 any 的变量可以赋予任意类型的值 let any1: any = 4 console.log(any1); // 4 any1 = false console.log // 八进制 console.log(decLiteral, hexLiteral, binaryLiteral, octalLiteral) // 输出 // 6 61453 10 484 3、 // 在元素类型后面加上 [] let arr: number[] = [1, 2, 3]; // 或者使用数组泛型 let arr: Array<number> = [1, 2, 3]; 6、元组
数学理论与计算机的发展是相辅相成的,底部类型在计算机科学中也有一定的应用场景。 在子类型系统中,底部类型是所有类型的子类型。(但是,相反情况并非如此,所有类型的子类型不一定是底部类型。) 它与顶端类型(它跨越系统中的所有可能值)和单元类型(恰好具有一个值)形成对比。 底部类型通常用于以下作用: 表示函数或运算有所不同,换句话说,就是不会将结果返回给调用方。 二、never 类型 在 TypeScript 中,never 类型表示的是那些永不存在的值的类型。 而任意类型与 never 类型联合,则不会影响原有的类型: type T3 = number | never; // number type T4 = string | never; // string 同样,对于上面的运算结果,我们可以这样理解:若 type T = T3 | T4,则 T3 或 T4 类型的值可以赋给 T 类型的变量。
在 JavaScript 中是没有元组的,元组是 TypeScript 中特有的类型,其工作方式类似于数组。 元组可用于定义具有有限数量的未命名属性的类型。每个属性都有一个关联的类型。 针对这种情形,在 TypeScript 中就可以利用元组类型可选元素的特性来定义一个元组类型的坐标点,具体实现如下: type Point = [number, number?, number?] 在该函数的第一行中,我们把 args 元组中保存的值解构赋值给 arg1、arg2 和 arg3 这三种不同类型的变量,最后我们分别输出三个变量的值。 = [number, number, number]; const drawPoint = (...point3D: Point3D) => { console.log(point3D); }; 六、只读的元组类型 TypeScript 3.4 还引入了对只读元组的新支持。我们可以为任何元组类型加上 readonly 关键字前缀,以使其成为只读元组。
[类型+方括号] 在我们创建数组的时候同样我们可以定义数组内数据的类型,如下所示 var arr:number[]=[1,2,3] var arr2:string[]=["1","2","3"] var arr3:any[]=[1,"2",true] 泛型Array<T> 如下代码所示我们可以以泛型的方式进行创建数组 var arrType:Array<number>=[1,2,3] var arrType1 :Array<string>=["1","2","3"] var arrType2:Array<any>=["1",2,true] 接口形式 interface IArr{ [index:number ]:number } var arrType3:IArr=[1,2,3] 通过如上代码我们限制了值只能为number类型 当然我们也可以约束我们数组里面为我们的对象,我们可定义一个泛型的数组如下所示. age:number } var arrType5:Array<IArrStudent>=[{ name:"Mr.A",age:18},{ name:"Mr.B",age:20}] 同样在这类型加方括号的形式也可以描述
一、交叉类型(Intersection types)什么事交叉类型呢?简单来说就是通过&符号将多个类型进行合并成一个类型,然后用type来声明新生成的类型。 这里分两种情况,如果同名属性的类型相同则合并后还是原本类型,如果类型不同,则合并后类型为never2.基本数据类型交叉any和number交叉结果是any类型,any和boolean交叉结果是any类型 A = number & 1; //1type B = 'maoxiansheng' & string; //'maoxiansheng'type C = boolean & true; //true3. ,当键的类型是不同的字面量类型,则交叉后类型为never类型。 二、联合类型(Union types)联合类型和交叉类型比较相似,联合类型通过|符号连接多个类型从而生成新的类型。它主要是取多个类型的交集,即多个类型共有的类型才是联合类型最终的类型。
TypeScript 中使用联合类型经常会有下面的错误出现: ? ? 这时就需要用到类型保护,类型保护允许你使用更小范围下的对象类型,常见的类型保护如下: 一、类型断言的类型保护 ? 二、in 语法的类型保护 ? 三、typeof 类型保护 先来看另一种常见的错误: ? ? 通过 typeof 类型保护: ? 四、instanceof 类型保护 ?
前言本文主要讲解TypeScript的基本数据结构,主要包括JS基本数据类型以及TS特有的数据类型。 1,'b','c']let arrC:(string|number)[] = [1,1]//或者这样声明let arrD: Array<string | number> = [1, 12, 'a'](3) ,即必须具有初始化表达式(3)异构含义:枚举类型包括字符串类型和数字类型注意:含有字符串值成员的枚举中不允许使用计算值,具体意思就是当枚举对象中存在有value是字符串的枚举成员的时候,不能将其他枚举成员的 注意以下是错误用法,因为含有字符串值成员的枚举中不允许使用计算值enum Enum {A,B = 3*6,C = 'C',D = 'd',E = 9,F}(4)枚举成员的值的两种形式-计算值和常量枚举对象中成员的 类型的变量,报错,因为unknown类型只能赋值给unknown、anylet testValue3: boolean = unknownValue;//报错虽然可以对unknown类型的变量进行任意赋值
条件类型(Conditional Types)是TypeScript中一种强大的类型系统特性,它允许我们根据类型关系来推断和选择类型。 X : Y这表示如果类型T可以赋值给类型U,则条件类型为X,否则为Y。 ,它检查类型T是否为number类型。 根据条件的结果,返回不同的字符串类型。分布式条件类型条件类型还可以在联合类型上使用,这称为分布式条件类型。当我们传入一个联合类型的参数时,条件类型会遍历每个成员,并根据条件进行推断。 条件类型是TypeScript类型系统的一个重要部分,它允许我们在类型级别上进行条件分支和类型选择。通过巧妙地组合泛型、联合类型和条件类型,我们可以定义出非常复杂且强大的类型。