TypeScript—基础数据类型 JavaScript 的类型分为两种:基础数据类型和对象类型 (1)布尔值类型 布尔值是最基础的数据类型,在 TypeScript 中,使用 boolean 定义布尔值类型...null表示对象值缺失,undefined 用于初始化变量为一个未定义的值。...Array 对象的构造函数接受以下两种值:表示数组大小的数值。初始化的数组列表,元素使用逗号分隔值。...reduceRight() 将数组元素计算为一个值(从右到左)。 reverse() 反转数组的元素顺序。 shift() 删除并返回数组的第一个元素。...TypeScript—类 TypeScript 是面向对象的 JavaScript。类描述了所创建的对象共同的属性和方法。
我们使用数组来存储相同类型的值,数组是有序和索引的值集合 索引从 0 开始,即第一个元素的索引为 0,第二个元素的索引为 1,依此类推 image.png 4、什么是 any 类型,何时使用 ?...有时你想将值存储在变量中,但事先不知道该变量的类型 当你没有明确提供类型时,TypeScript假定变量是any类型,并且编译器无法从周围的上下文中推断出类型 例如,该值来自 API 调用或用户输入。...它们类似于数组,有时也称为关联数组 但是,数组使用数字来索引值,而对象允许使用任何其他类型作为键 image.png 9、如何在 TypeScript 中指定可选属性 ? 通过添加 ?...对象类型可以具有零个或多个可选属性,在属性名称之后 image.png 10、说说枚举在 TypeScript 中是如何工作的 ?...枚举允许我们创建命名常量,这是一种为数字常量值赋予更友好名称的简单方法 枚举由关键字 enum 定义,后跟其名称和成员。 image.png 11、什么是参数解构 ?
,我们可以知道数字枚举除了支持 从成员名称到成员值 的普通映射之外,它还支持 从成员值到成员名称 的反向映射: enum Direction { NORTH, SOUTH, EAST,...而数字枚举如果没有显式设置值时,则会使用默认规则进行初始化。 3.常量枚举 除了数字枚举和字符串枚举之外,还有一种特殊的枚举 —— 常量枚举。...它是使用 const 关键字修饰的枚举,常量枚举会使用内联语法,不会为枚举类型编译生成任何 JavaScript。...在 JavaScript 中是没有元组的,元组是 TypeScript 中特有的类型,其工作方式类似于数组。 元组可用于定义具有有限数量的未命名属性的类型。每个属性都有一个关联的类型。...类 11.1 类的属性与方法 在面向对象语言中,类是一种面向对象计算机编程语言的构造,是创建对象的蓝图,描述了所创建的对象共同的属性和方法。
使用枚举可以清晰地表达意图或创建一组有区别的用例。 TypeScript 支持数字的和基于字符串的枚举。...在 JavaScript 中是没有元组的,元组是 TypeScript 中特有的类型,其工作方式类似于数组。 元组可用于定义具有有限数量的未命名属性的类型。每个属性都有一个关联的类型。...使用元组时,必须提供每个属性的值。...十一、TypeScript 类 11.1 类的属性与方法 在面向对象语言中,类是一种面向对象计算机编程语言的构造,是创建对象的蓝图,描述了所创建的对象共同的属性和方法。...与常规属性(甚至使用 private 修饰符声明的属性)不同,私有字段要牢记以下规则: 私有字段以 # 字符开头,有时我们称之为私有名称; 每个私有字段名称都唯一地限定于其包含的类; 不能在私有字段上使用
TypeScript 是什么 TypeScript 是一种由微软开发的自由和开源的编程语言。它是 JavaScript 的一个超集,而且本质上向这个语言添加了可选的静态类型和基于类的面向对象编程。...TypeScript 扩展了 JavaScript 的句法,所以任何现有的 JavaScript 程序可以不加改变的在 TypeScript 下工作。...在一个字符串枚举里,每个成员都必须用字符串字面量,或另外一个字符串枚举成员进行初始化。...: number; } 只读属性用于限制只能在对象刚刚创建的时候修改其值。...TypeScript Class 在面向对象语言中,类是一种面向对象计算机编程语言的构造,是创建对象的蓝图,描述了所创建的对象共同的属性和方法。
我们使用枚举值的元素值时,就像访问对象的属性一样,你可以使用’.‘操作符和’[]’两种形式访问里面的值,这和对象一样。...,可以使用计算值和常量。...会把我们定义的枚举值的字段名分别作为对象的属性名和值,把枚举值的字段值分别作为对象的值和属性名,同时添加到对象中。...,因为字符串枚举不能使用常量或者计算值,所以也不能使用其他枚举值中的成员。...所以 TypeScript 在 1.4 新增 const enum(完全嵌入的枚举),在之前讲的定义枚举的语句之前加上const关键字,这样编译后的代码不会创建这个对象,只是会从枚举里拿到相应的值进行替换
一、如何在 window 对象上显式设置属性 对于使用过 JavaScript 的开发者来说,对于 window.MyNamespace = window.MyNamespace || {}; 这行代码并不会陌生...如果枚举中某个成员的值使用显式方式赋值,但后续成员未显示赋值, TypeScript 会基于当前成员的值加 1 作为后续成员的值。...从成员名称到成员值 的普通映射之外,它还支持 从成员值到成员名称 的反向映射。...另外,对于纯字符串枚举,我们不能省略任何初始化程序。而数字枚举如果没有显式设置值时,则会使用默认值进行初始化。...与常规属性(甚至使用 private 修饰符声明的属性)不同,私有字段要牢记以下规则: 私有字段以 # 字符开头,有时我们称之为私有名称; 每个私有字段名称都唯一地限定于其包含的类; 不能在私有字段上使用
对象字面量的惰性初始化 在 JavaScript 中,像这样用字面量初始化对象的写法十分常见: let foo = {}; foo.bar = 123; foo.bas = 'Hello World';...,为避免object.p找不到属性,可以尝试使用 object['p']即对象的数组取值写法, 2....: string; [propName: string]: any; } 使用 [propName: string] 定义了任意属性取 string 类型的值。...也可以这么写 let lisi: Person = { name: 'lisi', age: 20 } 这个功能在有些地方很有用,比如一个组件的config对象类型。可允许传入任意名称的属性。...当然属性值得是字符串。 3. 枚举类型 当我们需要定义一组有共同特点的变量,可以使用枚举类型。
,因为它们与属性名称相关:Symbol.asyncIterator; TypeScript 手册使用以大写字母开头的驼峰式名称。...1.3 引用枚举成员名称 与 JavaScript 对象类似,我们可以使用方括号来引用包含非法字符的枚举成员: enum HttpRequestField { 'Accept', 'Accept-Charset...二、指定枚举成员值 TypeScript 区分了三种指定枚举成员值的方式: 使用字面量进行初始化: 隐式指定; 通过数字字面量或字符串字面量。 常量枚举成员通过可在编译时计算其结果的表达式初始化。...计算的枚举成员可通过任意表达式初始化。...TypeScript 将枚举编译为 JavaScript 对象。
,因为它们与属性名称相关: Symbol.asyncIterator; TypeScript 手册使用以大写字母开头的驼峰式名称。...1.3 引用枚举成员名称 与 JavaScript 对象类似,我们可以使用方括号来引用包含非法字符的枚举成员: enum HttpRequestField { 'Accept', 'Accept-Charset...二、指定枚举成员值 TypeScript 区分了三种指定枚举成员值的方式: 使用字面量进行初始化: 隐式指定; 通过数字字面量或字符串字面量。 常量枚举成员通过可在编译时计算其结果的表达式初始化。...计算的枚举成员可通过任意表达式初始化。...TypeScript 将枚举编译为 JavaScript 对象。
如果你仅仅是想TypeScript生效的话,你只需要tsconfig.json文件中包含一个空JSON对象,但是,如果你需要TypeScript编译器的有不同的行为(比如在特定的输出目录中输出编译后的JavaScript...当你想一组具有关联性的描述名称的不同值,枚举就很有用处了。 默认,为枚举分配从0开始的值,接下来的值为(上一个枚举值)加1。...基本类型推断 TypeScript可以在变量初始化期间,设置默认参数以及确定函数返回值时推断类型。...最佳通用类型推断 从多种可能的类型中推断类型时,TypeScript使用最佳通用类型算法来选择适用于所有其他候选类型的类型。...(list)是由number或null类型组成的,因此TypeScript只希望number或null类型的值加入数组。
在 TypeScript 中,我们支持和 Javascript 几乎一样多的类型,并且新增了实用的枚举类型。...Boolean 布尔值 最基础的数据类型就是简单的 true(真)/false(假) ,在 Javascript 和 TypeScript (以及其他语言)中被称作是 "boolean(布尔值)"。...Array 数组 TypeScript 和 Javascript 一样,允许你使用数组。数组类型的定义可以有两种写法。...Enum 枚举 TypeScript拓展了JavaScript原生的标准数据类型集,增加了枚举类型(enum)。...举例来说,如果我们有一个值为2,但我们不确定这个数值对应枚举类型中的哪个元素,那我们可以直接查找这个数值对应的名称: enum Color {Red = 1, Green, Blue}; var colorName
前言 也许前端的同学会问JavaScript从诞生至今都没有枚举类型,我们不是都活得挺好的吗?为什么TypeScript需要引入枚举类型呢?...TypeScript的枚举和后端的真不一样 后端的同学对枚举绝对是不会陌生的(除非是Pyton/Nodejs后端的同学啦),虽然TypeScript是JavaScript的超集,但最终需要编译为JavaScript...必须为枚举成员设置初始化器; 1.2. 初始化器不支持自动增长; 1.3. 不支持反向映射。 而计算和常量成员其实就是上述两种枚举类型中初始化器的细分特性罢了。...先说说结论: 使用enum的场景: 1.1. 需要使用反向映射时; 1.2. 需要编译后的JavaScript代码保留对象.属性或对象[属性]形式时。...所谓外部枚举,即使我们为了在TypeScript开发环境下,更好地使用某些已采用JavaScript编写的库,而被迫为其编写的枚举类型声明。
TypeScript 的出现极大的解决了上面的问题,TypeScript -- 一个 JavaScript 的超集,它作为一门编译型语言,提供了对类型系统和最新 ES 语法的支持,使得我们可以在享受使用...在现代 JavaScript 世界中,已经有很多大型库在使用 TypeScript 重构,包括前端三大框架:React、Vue、Angular,还有知名的组件库 antd,material,在很多公司内部的大型业务应用也在用...string 原始类型,最后一个属性为 boolean 类型,所以我们为了给 单个对象元素进行类型注解,我们使用了 interface 。...数字枚举 上面我们的 UserId 中几个枚举值其实都对应着相应的数字,比如 UserId.tuture 它的值是数字 0 ,UserId.mRcfps 它的值是数字 1 ,以此类推,后面的几个枚举值分别是数字...)和枚举(Enum),接口主要是对对象等多属性元素进行类型注解,而枚举是 TS 中独有的一个概念,在 JS 中没有,主要用于帮助定义一系列命名常量,常用于给一类变量做类型注解,它们的值是一组值里面的某一个
loggedMethod 的第二个参数被称为“ context 对象”,它包含一些关于如何声明装饰方法的有用信息——比如它是 #private 成员还是静态成员,或者方法的名称是什么。...除了元数据之外,方法的 context 对象还有一个有用的函数:addInitializer。这是一种挂接到构造函数开头的方法(如果使用静态方法,则挂接到类本身的初始化)。...在某些情况下,这个值是不可能计算出来的——例如,枚举成员可以通过函数调用进行初始化。...TypeScript 5.0 通过为每个计算成员创建唯一的类型,设法将所有枚举转换为联合枚举。这意味着现在可以缩小所有枚举的范围,并将其成员作为类型引用。...TypeScript 的 JavaScript emit 策略也有另外几层复杂性——省略导入并不总是由如何使用 import 驱动的,它通常还会参考值的声明方式。
虽然typescript现在无法直接解决性能上的问题,因为typescript最终是编译成javascript代码的,但是现在已经有从typescript编译到WebAssembly的工具了:https...如果给变量赋予与其声明类型不兼容的值,就会有报错提示。 例如: Array 数组类型 在typescript中,有两种声明数组类型的方式。...never表示的是函数永远不会正常返回,所以不可能有值。 enum 枚举类型 使用枚举类型可以为一组数值赋予友好的名字。...: number; } const square: SquareConfig = { color: 'red', }; 只读属性: 一些对象属性只能在对象刚刚创建的时候修改其值。...可索引类型: 可索引类型,实际就是声明对象的索引的类型,与对应值的类型。接口支持两种索引类型,一种是number,一种是string,通过可索引类型可以声明一个数组类型。
中使用类,提供了创建具有属性和方法的对象的方式。...回答: 类型推断是TypeScript自动根据变量的值确定其类型的能力。这表明你不总是必须显式地提到类型,因为TypeScript通常可以从分配的值中推断出类型。...TypeScript中的接口是什么,为什么要使用它们? 回答: 接口定义对象的结构。它们指定对象应该具有的属性的名称和类型。使用接口可以清楚地说明对象应该具有的形状,促进一致性,避免潜在的错误。...能否解释TypeScript中枚举的作用? 回答: 枚举,缩写为enumerations,允许你创建一组具有命名常量值的常量。这有助于通过使用有意义的名称替换魔术数字,使你的代码更具可读性。...类可以具有属性和方法,提供了一种组织和结构化代码的方式,更容易以面向对象的方式创建和管理对象。解释TypeScript中类型别名的概念。 回答: 类型别名允许你为现有类型创建一个新的名称。
构造函数 Constructor: 构造函数在对象实例化时被调用,用于初始化对象的属性 b. 属性 Properties: 类中可以定义各种属性,这些属性用于存储对象的状态 c....在构造函数中使用 super 在子类的构造函数中使用super用于调用父类的构造函数。这是必须的,因为子类可能需要执行一些额外的初始化工作,而父类的构造函数通常包含了一些基础的初始化逻辑。...Dog 类的静态方法,并在其中调用了父类的静态方法 枚举 Enum 是一种用于命名一组命名常量的数据类型 数字枚举 默认情况下,数字枚举的值从 0 开始自增,也可以手动指定枚举值。...,可以通过值获取名称,也可以通过名称获取值。...(directionValue); // 3 常量枚举 通过使用const关键字,可以将枚举声明为常量枚举,常量枚举在编译阶段会被删除,只留下使用到的值,这可以减小代码体积,但失去了动态特性。
,你可以为原始类型的变量重新分配一个新值,但不能像更改对象、数组和函数一样更改它的值。...中的对象 TypeScript 中的对象必须拥有所有正确的属性和值类型: // 使用特定的对象类型注释声明一个名为 person 的变量 let person: { name: string;...因此,TypeScript 知道的唯一属性返回对象的 id。 那么,我们怎么将任意对象传递给 addID,而且仍然可以告诉 TypeScript 该对象具有哪些属性和值?...枚举是 TypeScript 给 JavaScript 带来的一个特殊特性。...例如,与在代码中使用非描述性数字不同,枚举通过描述性常量使代码更具可读性。 枚举还可以防止错误,因为当你输入枚举的名称时,智能提示将弹出可能选择的选项列表。
领取专属 10元无门槛券
手把手带您无忧上云