首页
学习
活动
专区
圈层
工具
发布

一起重学TypeScript

phone}` } console.log(getUsefInfo('张锋','天津南开区xx小区',188888888)) 4.4 接口可索引类型 在定义一个数组时,可以定义一个 索引类型接口,这样就约束了它必须传递哪些类型的值...五,泛型 接触过JAVA 的同学,应该对这个不陌生,非常熟了。 作为前端的我们,可能第一 次听这个概念。 通过 字面意思可以看出,它指代的类型比较广泛。...接口约束 通过定义接口, 泛型函数继承接口,则参数必须实现接口中的属性,这样就达到了泛型函数的约束 类约束 通过给类的泛型指定为另一个类,这样就规定了类泛型的类型都为另一个类 # 第一种 // 定义接口...标识符为 & , 当指定一个变量类型为 交叉类型时,那么它拥有交叉类型的所有属性,也就是并集。...装饰器工厂 (传参数) 12.2 类装饰器 类装饰器表达式会在运行时当作函数被调用,类的构造函数作为其唯一的参数。 使用场景:应用于类构造函数,可以用来监视,修改或替换类定义。

2.4K00

TypeScript学习指南(有PDF小书+思维导图)

五,泛型 接触过JAVA 的同学,应该对这个不陌生,非常熟了。 作为前端的我们,可能第一 次听这个概念。 通过 字面意思可以看出,它指代的类型比较广泛。...如果传入了一个 string 类型的参数,那么我们也不知道它返回啥类型。 泛型 :它可以使 返回类型 和 传入类型 保持一致,这样我们可以清楚的知道函数返回的类型为什么类型。...接口约束 通过定义接口, 泛型函数继承接口,则参数必须实现接口中的属性,这样就达到了泛型函数的约束 类约束 通过给类的泛型指定为另一个类,这样就规定了类泛型的类型都为另一个类 # 第一种 // 定义接口...标识符为 & , 当指定一个变量类型为 交叉类型时,那么它拥有交叉类型的所有属性,也就是并集。...装饰器工厂 (传参数) 12.2 类装饰器 类装饰器表达式会在运行时当作函数被调用,类的构造函数作为其唯一的参数。 使用场景:应用于类构造函数,可以用来监视,修改或替换类定义。

3.7K32
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    初探 TypeScript函数基本类型泛型接口类内置对象

    let myIdentity1:{ (arg:T):T} = identity 复制代码 可以使用带有调用签名的对象字面量来定义泛型函数,我们可以将对象字面量拿出来作为一个接口,将一个泛型参数当做整个接口的一个参数...new GeneriNumber() 复制代码 类有两个部分:静态部分和实例部分,泛型类指的实例部分,所以静态属性不能使用这个泛型类型,定义接口来描述约束条件 泛型约束 interface...someValue as string).length //一个为 `as` 语法 复制代码 2.使用索引签,对象赋值给另一个变量,对象字面量会被特殊对待而且会经过 额外属性检查,当将它们赋值给变量或作为参数传递的时候...readonly 关键字将属性设置为只读,只读属性必须在声明或者构造函数里被初始化 TypeScript 使用的是结构性类型系统,当我们比较两种不同的类型的时候,如果类型成员是兼容的,我们就认为他们类型是兼容的...作为其他派生类的基类使用,他们一般不会直接被实例化,抽象类中的抽象方法不包含具体实现并且必须在派生类中实现。

    8.2K31

    TypeScript

    ,表示这是一个抽象类 抽象类不能直接实例化,通常我们使用子类继承它,然后实例化子类 #访问限定符 public:成员默认的都是公共的,可以被外部访问(可以继承) private: 只能类的内部访问 (不可以继承...A 即可 #泛型 泛型(Generics)是指在定义函数、接口或类的时候,不预先指定具体的类型,而在使用的时候再指定类型的一种特性。...#泛型接口 可以为泛型提供一个用于约束参数/属性的类型的接口 interface Identities { value: V, message: M } function identity...这里我有意使用不同的变量名,以表明类型值沿链向上传播,且与变量名无关。 #泛型约束 确保属性存在 当我们在函数中获取length属性,在类型为number时,是没有length的,所以会报错。...先认识 keyof 操作符 #泛型参考文章 掘金-一文读懂 TypeScript 泛型及应用( 7.8K字) #tsconfig.json { "compilerOptions": {

    2.3K10

    你应该知道的TypeScript高级概念

    也就是说我们不能在声明的时候初始化,然后在构造函数中修改它,因为这样的话已经破坏了readonly。...泛型 泛型(Generics)是指在定义函数、接口或者类的时候, 不预先指定其类型,而是在使用是手动指定其类型的一种特性。 比如我们需要创建一个函数, 这个函数会返回任何它传入的值。...这时,我们可以的对泛型进行约束,对这个函数传入的值约束必须包含 length 的属性, 这就是泛型约束: interface lengthwise { length: number } function...length: 1}) // 1 loggingIdentity('str') // 3 loggingIdentity(6) // err 传入是参数中未能包含 length 属性 这样我们就可以通过泛型约束的方法对函数传入的参数进行约束限制...多个参数时也可以在泛型约束中使用类型参数 如你声明了一个类型参数, 它被另一类型参数所约束。现在想要用属性名从对象里湖区这个属性。

    69110

    TypeScript进阶(一)深入理解类和接口

    在本文中,我们将深入探讨 TypeScript 类和接口的各种特性,包括类的继承、抽象类、静态成员、接口、索引器以及 this 指向约束。...在上面的例子中,Dog 类继承了 Animal 类,并添加了自己特有的属性和方法。通过使用 super 关键字调用父类的构造函数,我们可以在子类中访问父类的属性和方法。...使用抽象类可以定义一些通用的行为和属性,并强制子类实现特定的方法。这样可以提高代码的可读性和可维护性,同时也能够避免一些潜在的错误。...greet() 函数接受一个参数,并使用该参数中的属性来打印问候语。 索引器 索引器允许我们通过索引来访问对象的属性。在 TypeScript 中,我们可以使用字符串或数字作为索引类型。...- 类 TypeScript基础(五)泛型 总结 -- 通过本文的介绍,我们深入理解了 TypeScript 类和接口的各种特性。

    78910

    深入学习下 TypeScript 中的泛型

    在今天的内容中,我们将尝试 TypeScript 泛型的真实示例,并探索它们如何在函数、类型、类和接口中使用。...您还将探索一个异步示例,了解何时将类型参数直接传递给您的泛型,以及如何为您的泛型类型参数创建约束和默认值。...,并使用该类型的数组 (User[]) 作为 ResultType 泛型参数的类型。...这意味着 TypeScript 会将数据识别为具有字符串类型的键和任意类型的值的对象,从而允许您访问其属性。 类型参数约束 在某些情况下,泛型类型参数需要只允许将某些形状传递给泛型。...将泛型与接口、类和类型一起使用 在 TypeScript 中创建接口和类时,使用泛型类型参数来设置结果对象的形状会很有用。 例如,一个类可能具有不同类型的属性,具体取决于传递给构造函数的内容。

    41.3K30

    深入学习下 TypeScript 中的泛型

    介绍泛型是静态类型语言的基本特征,允许开发人员将类型作为参数传递给另一种类型、函数或其他结构。...在今天的内容中,我们将尝试 TypeScript 泛型的真实示例,并探索它们如何在函数、类型、类和接口中使用。...您还将探索一个异步示例,了解何时将类型参数直接传递给您的泛型,以及如何为您的泛型类型参数创建约束和默认值。...这意味着 TypeScript 会将数据识别为具有字符串类型的键和任意类型的值的对象,从而允许您访问其属性。类型参数约束在某些情况下,泛型类型参数需要只允许将某些形状传递给泛型。...将泛型与接口、类和类型一起使用在 TypeScript 中创建接口和类时,使用泛型类型参数来设置结果对象的形状会很有用。 例如,一个类可能具有不同类型的属性,具体取决于传递给构造函数的内容。

    2.6K10

    一文搞懂TypeScript泛型,让你的组件复用性大幅提升

    我们将深入探讨在TypeScript中使用泛型的方法,展示如何在函数、类和接口中使用它们。我们将会讨论如何传递默认泛型值、多个值以及条件值给泛型。最后,我们还会讨论如何为泛型添加约束。...三、泛型接口的使用 泛型不仅限于函数和类,我们也可以在 TypeScript 中的接口内使用泛型。泛型接口使用类型参数作为占位符来表示未知的数据类型。...示例:泛型接口的使用 基本示例 假设我们有一个函数 currentlyLoggedIn,它接收一个对象并返回包含 online 状态的扩展对象。...四、为泛型传递默认值 在 TypeScript 中,我们可以为泛型传递默认类型值。这在某些情况下非常有用,例如当我们不希望强制传递函数处理的数据类型时。...我们可以添加条件并定义逻辑,以根据需求和具体情况进行调整。 七 、为泛型添加约束 泛型允许我们处理作为参数传递的任何数据类型。然而,我们可以为泛型添加约束,以将其限制为特定类型。

    2.6K10

    一份TypeScript高级类型入门手册,附大量代码实例,值得收藏

    Generic Types(泛型) 泛型类型是复用给定类型的一部分的一种方式。它有助于捕获作为参数传递的类型 T。 优点: 创建可重用的函数,一个函数可以支持多种类型的数据。...); // Output: "test" showType(1); // Output: 1 如何创建泛型类型:需要使用并将 T(名称可自定义)作为参数传递。...T, 并通过类型 T来约束接口内 name 的类型 注:泛型变量约束了整个接口后,在实现的时候,必须指定一个类型 因此在使用时我们可以将name设置为任意类型的值,示例中为字符串或数字 多参数的泛型类型...在代码中,它期望一个number作为类型,这就是为什么我们将 0、1 和 2 作为employees变量的键的原因。...我们将类型NonNullableType作为参数传递给NonNullable,NonNullable通过排除null和undefined来构造新类型。

    1.9K30

    一份TypeScript高级类型入门手册,附大量代码实例,值得收藏

    Generic Types(泛型) 泛型类型是复用给定类型的一部分的一种方式。它有助于捕获作为参数传递的类型 T。 优点: 创建可重用的函数,一个函数可以支持多种类型的数据。...); // Output: "test" showType(1); // Output: 1 如何创建泛型类型:需要使用并将 T(名称可自定义)作为参数传递。...T, 并通过类型 T来约束接口内 name 的类型 注:泛型变量约束了整个接口后,在实现的时候,必须指定一个类型 因此在使用时我们可以将name设置为任意类型的值,示例中为字符串或数字 多参数的泛型类型...在代码中,它期望一个number作为类型,这就是为什么我们将 0、1 和 2 作为employees变量的键的原因。...我们将类型NonNullableType作为参数传递给NonNullable,NonNullable通过排除null和undefined来构造新类型。

    1.9K40

    TypeScript面向对象编程详解

    3.1 抽象类 抽象类是一种不能直接实例化的类,它只能作为其他类的基类。抽象类可以包含抽象方法(没有实现的方法)和非抽象方法(有实现的方法)。子类必须实现父类中的所有抽象方法。...泛型类与泛型接口 泛型是TypeScript中的一个重要特性,它允许我们编写可以处理不同类型数据的代码,而不必为每种类型编写单独的代码。泛型类和泛型接口是使用泛型的常见方式。...在TypeScript中,我们可以使用泛型约束来限制泛型类型参数的范围。...**泛型类**:定义了一个抽象的泛型基类BaseRepository,它接受一个类型参数T,并约束T必须有一个id属性。 4....**合理使用泛型**: - 使用泛型提高代码的复用性 - 为泛型添加适当的约束 - 利用TypeScript内置的泛型工具类型 5.

    35110

    Typescript 使用日志(干货)

    泛型表示的是一个类型在定义时并不确定,需要在调用的时候才能确定的类型,主要包含以下几个知识点: •泛型函数•泛型类•泛型约束 T extends XXX 我们试想一下,如果一个函数,把传入的参数直接输出...MyClass { log(msg: T) { return msg; } } let my = new MyClass(); my.log(""); // 泛型约束...,但许多初学 Typescript 的同学觉得泛型很难,其实是因为泛型可以结合索引查询符 keyof、索引访问符 T[k] 等写出难以阅读的代码,我们来看一下。...•对象中的兼容•函数返回值兼容•函数参数列表兼容•函数参数结构兼容•类中的兼容•泛型中的兼容 在 Typescript 中是通过结构体来判断兼容性的,如果两个的结构体一致,就直接兼容了,但如果不一致,Typescript...泛型中的兼容 泛型中的兼容,如果没有用到 T,则两个泛型也是兼容的。

    2.9K10

    一份TypeScript高级类型入门手册,附大量代码实例,值得收藏

    Generic Types(泛型) 泛型类型是复用给定类型的一部分的一种方式。它有助于捕获作为参数传递的类型 T。 优点: 创建可重用的函数,一个函数可以支持多种类型的数据。...); // Output: "test" showType(1); // Output: 1 如何创建泛型类型:需要使用并将 T(名称可自定义)作为参数传递。...T, 并通过类型 T来约束接口内 name 的类型 注:泛型变量约束了整个接口后,在实现的时候,必须指定一个类型 因此在使用时我们可以将name设置为任意类型的值,示例中为字符串或数字 多参数的泛型类型...在代码中,它期望一个number作为类型,这就是为什么我们将 0、1 和 2 作为employees变量的键的原因。...我们将类型NonNullableType作为参数传递给NonNullable,NonNullable通过排除null和undefined来构造新类型。

    1.2K20

    TypeScript 学习笔记(一)

    ,数组类型有多种定义方式 1,类型 + 方括号( type [ ] ) 这种方式定义的数组项中不允许出现其他的类型 let list: number[] = [1, 2, 3]; 2,数组泛型 Array...symbol类型的值是通过Symbol构造函数创建的。 let sym1 = Symbol(); Symbols是不可改变且唯一的。...{ (x:T,y:T):T; } var add:Tadd = function(x:number,y:number):number { return x + y } 泛型约束...在函数内部使用泛型变量的时候,由于事先不知道它是哪种类型,所以不能随意的操作它的属性或方法 获取一个参数的长度: function getLength(arg:T):T { console.log...length,所以编译的时候报错了,这时候就可以使用泛型约束,使用 extends 约束泛型 必须符合 Ilength 的形状,也就是必须包含 length 属性: interface Ilength

    3.2K10

    C#-面向对象编程、接口、泛型

    :父类可以被子类替换掉 8 迪米特法则 : 类之间数据传递越少越好 C#中抽象类与接口 相同点: 1.可被继承, 不可被实例化,都是抽象的 不同: 1.抽象类可以继承类或接口 接口只能继承接口...泛型 将类型作为参数,在使用的时候再具体决定 泛型参数可以是多个,一般使用大写的T开头 反省参数一般可以使用在方法 类 委托等 namespace 泛型 { class Program...会有拆装箱操作 class MyStack2 { public void Push(T t) { } } 进行泛型约束: 约束条件为接口是,将泛型参数类型为接口或者接口的实现类...会有拆装箱操作 class MyStack2 { //将T约束为某一类型,或其子类型 public void Push(T t) where T:Card...{ } } 使用接口作为泛型约束的实例 对任意可比较类型数据进行升序排序(冒泡) class MyClass02 : IComparable { public

    1.1K20

    C# 学习笔记(9)—— 泛型

    字面意思上,泛型代表的就是 “通用类型”,它可以代替任意的数据类型,使类型参数化,从而达到只实现一个方法就可以操作多种数据类型的目的。泛型将方法实现行为与方法操作的数据类型分离,实现了代码重用。...根据泛型类型参数是否提供实际类型,又可把泛型分为两类: 未绑定的泛型:没有为类型参数提供实际类型 已构造的泛型:已指定了实际类型作为参数 已构造的泛型又可分为: 开放类型:包含类型参数的泛型 密封类型...:class,它确保传递的类型实参必须是引用类型 注意,约束的类型参数和类型本身没有关系,即在定义一个泛型结构体时,泛型类型一样可以被约束为引用类型。...、System.Enum和System.Void 2、值类型约束 值类型约束的表示形式为T:struct,它确保传递的类型实参时值类型(包括枚举),但这里的值类型不包括可控类型 public class...构造函数类型约束确保指定的类型实参有一个公共午餐构造函数的非抽象类型。

    52120

    【文末送书】Typescript 使用日志

    泛型表示的是一个类型在定义时并不确定,需要在调用的时候才能确定的类型,主要包含以下几个知识点: •泛型函数•泛型类•泛型约束 T extends XXX 我们试想一下,如果一个函数,把传入的参数直接输出...MyClass { log(msg: T) { return msg; } } let my = new MyClass(); my.log(""); // 泛型约束...,但许多初学 Typescript 的同学觉得泛型很难,其实是因为泛型可以结合索引查询符 keyof、索引访问符 T[k] 等写出难以阅读的代码,我们来看一下。...•对象中的兼容•函数返回值兼容•函数参数列表兼容•函数参数结构兼容•类中的兼容•泛型中的兼容 在 Typescript 中是通过结构体来判断兼容性的,如果两个的结构体一致,就直接兼容了,但如果不一致,Typescript...泛型中的兼容 泛型中的兼容,如果没有用到 T,则两个泛型也是兼容的。

    3.3K10
    领券