广告
返回顶部
首页 > 资讯 > 前端开发 > VUE >TypeScript中实用类型有哪些
  • 740
分享到

TypeScript中实用类型有哪些

2024-04-02 19:04:59 740人浏览 独家记忆
摘要

这篇文章给大家分享的是有关typescript中实用类型有哪些的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。实用类型TypeScript 原生提供了几个有用的实用类型来帮助我们进

这篇文章给大家分享的是有关typescript中实用类型有哪些的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。

实用类型

TypeScript 原生提供了几个有用的实用类型来帮助我们进行一些常见的类型转换。这些实用类型是全局可用的,它们都使用了泛型。

下面这7个是我经常用到的。

1. Pick<Type, Keys>

Pick会从 Type 中挑选属性集 Keys 来创建一个新的类型,Keys 可以是一个字符串字面或字符串字面的联合。Keys 的值必须是 Type 的键,否则TypeScript编译器会抱怨。当你想通过从有很多属性的对象中挑选某些属性来创建更轻的对象时,这个实用类型特别有用。

type User = {
  name: string
  age: number
  address: string
  occupation: string
}

type BasicUser = Pick<User, "name" | "age">

// type BasicUser = {
//   name: string;
//   age: number;
// }

2. Omit<Type, Keys>

OmitPick相反。 Keys 不是说要保留哪些属性,而是指要省略的属性键集。 当我们只想从对象中删除某些属性并保留其他属性时,这个会更有用。

type User = {
  name: string
  age: number
  address: string
  occupation: string
}

type BasicUser = Omit<User, "address" | "occupation">

// type BasicUser = {
//   name: string;
//   age: number;
// }

3. Partial<Type>

Partial 构造了一个类型,其所有的类型属性都设置为可选。当我们在编写一个对象的更新逻辑时,这个可能非常有用。

type User = {
  name: string
  age: number
  address: string
  occupation: string
}

type PartialUser = Partial<User>

// type PartialUser = {
//   name?: string;
//   age?: number;
//   address?: string;
//   occupation?: string;
// }

4. Required<Type>

RequiredPartial相反。它构造了一个类型的所有属性都是必填的类型。它可以被用来确保在一个类型中没有可选属性出现。

type PartialUser = {
  name: string
  age: number
  address?: string
  occupation?: string
}

type User = Required<PartialUser>

// type User = {
//   name: string;
//   age: number;
//   address: string;
//   occupation: string;
// }

5. Readonly<Type>

Readonly 构建了一个类型,其类型的所有属性被设置为只读。重新分配新的值 TS 就会报错。

type User = {
  name: string
  age: number
  address: string
  occupation: string
}

type ReadOnlyUser = Readonly<User>

const user: ReadOnlyUser = {
  name: "小智",
  age: 24,
  address: "厦门",
  occupation: "大迁世界"
}

user.name = "王大冶"
// Cannot assign to 'name' because it is a read-only property.

6. ReturnType<Type>

ReturnType 从一个函数类型的返回类型构建一个类型。当我们处理来自外部库的函数类型并希望基于它们建立自定义类型时,它是非常有用的。

import axiOS from 'axios'

type Response = ReturnType<typeof axios>

function callapi(): Response{
  return axios("url")
}

感谢各位的阅读!关于“TypeScript中实用类型有哪些”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,让大家可以学到更多知识,如果觉得文章不错,可以把它分享出去让更多的人看到吧!

--结束END--

本文标题: TypeScript中实用类型有哪些

本文链接: https://www.lsjlt.com/news/97120.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • TypeScript中实用类型有哪些
    这篇文章给大家分享的是有关TypeScript中实用类型有哪些的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。实用类型TypeScript 原生提供了几个有用的实用类型来帮助我们进...
    99+
    2022-10-19
  • TypeScript的类型有哪些
    这篇文章主要介绍“TypeScript的类型有哪些”,在日常操作中,相信很多人在TypeScript的类型有哪些问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”TypeScri...
    99+
    2022-10-19
  • TypeScript基本类型有哪些
    今天小编给大家分享一下TypeScript基本类型有哪些的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希望大家阅读完这篇文章后有所收获,下面我们一起来...
    99+
    2022-10-19
  • TypeScript常见类型有哪些
    小编给大家分享一下TypeScript常见类型有哪些,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!常见类型(Everyday Types)类型可以出现在很多地方,...
    99+
    2023-06-29
  • TypeScript高级类型有哪些
    本篇内容介绍了“TypeScript高级类型有哪些”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!Inter...
    99+
    2022-10-19
  • TypeScript高级类型有哪些及怎么用
    本篇内容主要讲解“TypeScript高级类型有哪些及怎么用”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“TypeScript高级类型有哪些及怎么用”吧!前言对于有 javascript 基础的...
    99+
    2023-06-05
  • TypeScript接口和类型有哪些区别
    今天小编给大家分享的是TypeScript接口和类型有哪些区别,相信很多人都不太了解,为了让大家更加了解,所以给大家总结了以下内容,一起往下看吧。一定会有所收获的哦。目录接口(interface)类型(type)interface vs t...
    99+
    2023-07-06
  • TypeScript中class类型实例讲解
    目录class类型构造函数class类的继承可见修饰符只读修饰符总结class类型 TypeScript支持ES引入的class关键字,并为其添加了类型注解和其他语法(例如:可见性修...
    99+
    2022-12-30
    typescript class类型参数 typescript的类型 typescript class
  • Typescript中string类型怎么用
    这篇文章给大家分享的是有关Typescript中string类型怎么用的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。string字符串类型,和javascript一样,可以使用双...
    99+
    2022-10-19
  • Typescript中any类型怎么用
    小编给大家分享一下Typescript中any类型怎么用,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!any可以指定任何类型的值...
    99+
    2022-10-19
  • Typescript中enum类型怎么用
    小编给大家分享一下Typescript中enum类型怎么用,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!enumenum类型是对...
    99+
    2022-10-19
  • Typescript中tuple类型怎么用
    小编给大家分享一下Typescript中tuple类型怎么用,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!tuple元组类型,允...
    99+
    2022-10-19
  • Typescript中object类型怎么用
    小编给大家分享一下Typescript中object类型怎么用,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!object对象类型...
    99+
    2022-10-19
  • Typescript中never类型怎么用
    这篇文章将为大家详细讲解有关Typescript中never类型怎么用,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。nevernever是其他类型(包括null和unde...
    99+
    2022-10-19
  • Typescript中number类型怎么用
    这篇文章主要为大家展示了“Typescript中number类型怎么用”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“Typescript中number类型怎么用...
    99+
    2022-10-19
  • Typescript中boolean类型怎么用
    这篇文章主要为大家展示了“Typescript中boolean类型怎么用”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“Typescript中boolean类型怎...
    99+
    2022-10-19
  • Typescript中array类型怎么用
    小编给大家分享一下Typescript中array类型怎么用,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!array数组类型,跟...
    99+
    2022-10-19
  • javascript中有哪些类型
    这篇“javascript中有哪些类型”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“jav...
    99+
    2022-10-19
  • Hibernate中有哪些类型分类
    本篇文章给大家分享的是有关Hibernate中有哪些类型分类,小编觉得挺实用的,因此分享给大家学习,希望大家阅读完这篇文章后可以有所收获,话不多说,跟着小编一起来看看吧。1. 实体(Entities)和值(values)为了理解很多与持久化...
    99+
    2023-06-17
  • Java中有哪些引用类型
    Java中有哪些引用类型?针对这个问题,这篇文章详细介绍了相对应的分析和解答,希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。强引用强引用是最常用的引用类型,如下所示,new Object()会创建一个Object对象并存储在堆...
    99+
    2023-06-14
软考高级职称资格查询
推荐阅读
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作