首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

Typescript keyof返回字符串数组

Typescript是一种静态类型的编程语言,它是JavaScript的超集,为JavaScript添加了静态类型检查和其他特性。keyof是Typescript中的一个操作符,用于获取一个类型的所有属性名组成的字符串数组。

具体来说,keyof操作符可以用于以下场景:

  1. 获取对象的属性名:通过使用keyof操作符,可以获取一个对象的所有属性名组成的字符串数组。例如,对于以下对象类型:
代码语言:typescript
复制
type Person = {
  name: string;
  age: number;
  gender: string;
};

type Keys = keyof Person; // "name" | "age" | "gender"
  1. 限制函数参数:通过使用keyof操作符,可以限制函数的参数只能是某个对象的属性名。例如,可以定义一个函数,接受一个对象和一个属性名作为参数,并返回该属性的值:
代码语言:typescript
复制
function getProperty<T, K extends keyof T>(obj: T, key: K): T[K] {
  return obj[key];
}

const person: Person = {
  name: "John",
  age: 30,
  gender: "male",
};

const name = getProperty(person, "name"); // "John"
const age = getProperty(person, "age"); // 30
  1. 创建类型安全的映射类型:通过使用keyof操作符,可以创建类型安全的映射类型。例如,可以定义一个将对象的属性都设置为可选的映射类型:
代码语言:typescript
复制
type Partial<T> = {
  [K in keyof T]?: T[K];
};

type PartialPerson = Partial<Person>;
// {
//   name?: string;
//   age?: number;
//   gender?: string;
// }

推荐的腾讯云相关产品和产品介绍链接地址:

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

TypeScript - keyof

TypeScript 中,keyof 关键字是一个有用的类型操作符,它用于获取一个类型所有公共属性键的联合(Union)。当你想要操作一个类型的键而不是它的值时,keyof 操作符非常有用。...; // string | "age" 在这个例子中,Person 接口有一个字符串索引签名,这意味着它可以有任意数量的字符串键。...keyof Person 将包含所有这些可能的键以及明确声明的属性键 "age"。 类型守卫和断言 keyof 可以用来创建类型守卫,确保某个键存在于对象中。...name'); // string const age = getProperty(person, 'age'); // number 在这个例子中,getProperty 函数接受一个对象和一个键,然后返回该键对应的值...泛型 K 被约束为 T 的键之一,这样 TypeScript 就可以确保键是有效的。 keyofTypeScript 提供的一个强大的工具,它允许你以类型安全的方式操作对象的键。

10210

TypeScript keyof 操作符

一、keyof 简介 TypeScript 允许我们遍历某种类型的属性,并通过 keyof 操作符提取其属性的名称。...keyof 操作符是在 TypeScript 2.1 版本引入的,该操作符可以用于获取某种类型的所有键,其返回类型是联合类型。...首先定义了 T 类型并使用 extends 关键字约束该类型必须是 object 类型的子类型,然后使用 keyof 操作符获取 T 类型的所有键,其返回类型是联合类型,最后利用 extends 关键字约束...操作符获取该类型的所有键, // 即字符串字面量联合类型 'red' | 'blue' type Colors = keyof typeof COLORS let color: Colors; color...、参考资源 keyof-and-lookup-types-in-typescript TypeScript - 类型操作符 typescriptlang - typescript-2-9 typescriptlang

8K40

TypeScript 演化史 — 第六章】对象扩展运算符和 rest 运算符及 keyof 和查找类型

那么如何在 TypeScript 中编写这个函数呢?先尝试一下: image.png 有了这两个类型注释,obj 必须是对象,key 必须是字符串。咱们现在已经限制了两个参数的可能值集。...keyof 操作符号 在 JS 中属性名称作为参数的 API 是相当普遍的,但是到目前为止还没有表达在那些 API 中出现的类型关系。 TypeScript 2.1 新增加 keyof 操作符。...索引类型查询 有了 keyof,咱们现在可以改进 prop 函数的类型注解。我们不再希望接受任意字符串作为 key 参数。...} TypeScript 现在以推断 prop 函数的返回类型为 T[K],这个就是所谓的 索引类型查询 或 查找类型。...方法返回一个元组数组,每个元组包含一个属性键和相应的值。

3.1K50

TypeScript 类型体操 - 基础操作

数组字符串、函数、索引类型等都可以用这种方式对原类型做变换产生新的类型。其中索引类型有专门的语法叫做映射类型,对索引做修改的 as 叫做重映射。...TypeScript 的高级类型支持类型参数,可以做各种类型运算逻辑,返回新的类型,和函数调用是对应的,自然也支持递归。 TypeScript 类型系统不支持循环,但支持递归。...比如数组长度不确定、字符串长度不确定、索引类型层数不确定等。...# 数值计算 TypeScript 类型系统中没有加减乘除运算符,但是可以通过构造不同的数组然后取 length 的方式来完成数值计算,把数值的加减乘除转化为对数组的提取和构造。...索引类型的索引为字符串字面量类型,而可索引签名不是,可以用这个特性过滤掉可索引签名。 keyof 只能拿到 class 的 public 的索引,可以用来过滤出 public 的属性。

1.8K60

TypeScript 演化史 -- 6】对象扩展运算符和 rest 运算符及 keyof 和查找类型

那么如何在 TypeScript 中编写这个函数呢?先尝试一下: 有了这两个类型注释,obj 必须是对象,key 必须是字符串。咱们现在已经限制了两个参数的可能值集。...keyof 操作符号 在 JS 中属性名称作为参数的 API 是相当普遍的,但是到目前为止还没有表达在那些 API 中出现的类型关系。 TypeScript 2.1 新增加 keyof 操作符。...索引类型查询 有了 keyof,咱们现在可以改进 prop 函数的类型注解。我们不再希望接受任意字符串作为 key 参数。...} TypeScript 现在以推断 prop 函数的返回类型为 T[K],这个就是所谓的 索引类型查询 或 查找类型。...方法返回一个元组数组,每个元组包含一个属性键和相应的值。

2.5K30

深入 TypeScript 高级类型和类型体操

然后类型计算逻辑就是判断 Arr 的 length 是否是 Len,如果是的话,就返回构造出的 Arr,不是的话就往其中添加一个元素继续构造。 这样,我们就递归的创建了一个长度为 Len 的数组。...所以,我们要递归的构造数组来计数,并且递归的构造字符串,然后判断数组长度达到目标就返回构造的字符串。...Count,就返回构造的字符串 ResStr,否则继续递归构造。...T[Key] : never }[keyof T]; 我们构造一个新的对象类型,通过 keyof 遍历对象的属性名,然后对属性值做判断,如果不是数字就返回 never,然后再取属性值。...: 可以做条件判断,常配合 extends 使用 通过递归可以实现循环 可以做对象的构造 {}、取属性名 keyof、取属性值 T[Key] 可以做字符串的构造 {a}{b},字符串的模式匹配来取子串

3.5K41

真实案例说明 TypeScript 类型体操的意义

TypeScript 类型系统支持类型编程,也就是对类型参数做一系列运算产生新的类型。比如这样: type isTwo = T extends 2 ?...把提取出来的每一个 a=1、b=2、c=3 这种字符串再做一次处理,把结果合并起来返回。...Key 和 Value 中,构造成索引类型返回, 如果模式匹配不满足,说明不是 = 分隔的字符串字面量类型,就返回 Record 代表任意索引类型。...通过映射类型的语法构造一个新的索引类型返回,Key 来自两者的合并,也就是 Key in keyof OneParam | keyof OtherParam。...[One, ...Other] : [One, Other]; 类型参数 One、Other 为待合并的两个值的类型,如果两个一样就返回其中一个,否则如果是数组就合并数组,也就是

96631

让你的TypeScript代码更优雅,这10个特性你需要了解下

自动推断数组类型 在下面的例子中,TypeScript 会自动推断 arr 的类型为 (number | string | boolean)[],因为数组中包含了数字、字符串和布尔值。...泛型函数的类型推断 在泛型函数中,TypeScript 可以根据传入的参数自动推断出类型。以下是一个简单的泛型函数 identity,它接收一个参数并返回相同的值。...三、巧用 TypeScript 模板字面量类型 模板字面量类型(Template Literal Types)是 TypeScript 提供的一种强大工具,让你可以通过字符串字面量来创建更加表达性和易于管理的字符串类型...1、类型谓词的基本用法 类型谓词的语法是 value is Type,用于函数的返回类型。当函数返回 true 时,TypeScript 会在其后的代码块中将变量的类型缩小到指定的类型。...如果是,它返回 true,并告诉 TypeScript value 是 string 类型。 2、类型谓词的应用 类型谓词在处理联合类型时特别有用。

6910

深入学习下 TypeScript 中的泛型

由于在语言对象的情况下 T 将 age 设置为数字并将 extensions 设置为字符串数组,因此,变量 ageAndExtensions 现在将被分配具有属性 age: number 和 extensions...假设您有一个存储限制,您只能存储所有属性都具有字符串值的对象。为此,您可以创建一个函数,它接受任何对象并返回另一个对象,该对象具有与原始对象相同的键,但所有值都转换为字符串。...T]: string }) } 在此代码中,stringifyObjectKeyValues 使用 reduce 数组方法迭代原始键数组,将值字符串化并将它们添加到新数组中。...type { [K in keyof T]: string } 创建一个新类型,它具有与 T 相同的键,但所有值都设置为字符串类型,这称为映射类型,本教程将在后面的部分中进一步探讨。...keyof T 运算符用于返回具有 T 中所有可用属性名称的联合。然后使用 K in 语法指定新类型的属性是返回的联合类型中当前可用的所有属性 T键。

38.9K30

掌握 TypeScript:20 个提高代码质量的最佳实践

这意味着,如果你声明一个变量为字符串类型,TypeScript 将确保分配给该变量的值确实是字符串而不是数字,例如。这有助于您及早发现错误,并确保您的代码按照预期工作。...例如,在以下代码片段中,TypeScript 会自动推断 name 变量的类型为字符串: let name = "John"; 类型推断在处理复杂类型或将变量初始化为从函数返回的值时特别有用。...运算符 keyof 运算符是 TypeScript 的一个强大功能,可以创建一个表示对象键的类型。...最佳实践 14:“只读”和“只读数组” 当在 TypeScript 中处理数据时,你可能希望确保某些值无法更改。这就是“只读”和“只读数组”的用武之地。...例如,你可以使用 infer 关键字为返回特定类型数组的函数创建更精确的类型: type ArrayType = T extends (infer U)[] ?

4K30

TS 类型体操:图解一个复杂高级类型

之前我们零散地了解了一些 TypeScript 类型体操的套路,但是没有综合练习下,今天就来做个高难度的体操,它会综合运用模式匹配、构造、递归等套路,对提升类型编程水平很有帮助。...我们要实现的高级类型如下: 它的类型参数是参数字符串 query string,会返回解析出的参数对象,如果有同名的参数,会把值做合并。...比如提取 a=b 中的 a 和 b: 这种模式匹配的套路在数组字符串、函数等类型中都有很多应用。...结下来把它合并成一个就可以了,合并的时候如果有相同的 key 的值,要放到数组里。...合并的时候,如果两者一样就返回任意一个,如果不一样,就合并到数组返回,也就是 [One, Other]。如果本来是数组的话,那就是数组的合并 [One, ...Other]。

46110

探索TypeScript的映射类型,从简单到高级的7个实例

keyof 操作符:keyofTypeScript中的一个操作符,它返回一个类型的所有属性名的联合类型。...比如,keyof { name: string, age: number } 返回 'name' | 'age'。 in 操作符:in 用于遍历类型的每个属性。...定义User类型 首先,我们定义一个User类型,其中包含三个属性:name(字符串类型)、age(数字类型)和email(字符串类型)。...在JavaScript中,map函数用于遍历数组并对每个元素执行指定操作。同样,在TypeScript中,映射类型可以遍历类型的每个属性并对其进行转换。...掌握这一技巧可以让你在开发TypeScript应用时更加灵活地处理类型转换问题。 四、将属性设为只读 在TypeScript中,有时我们需要将某个类型的所有属性设为只读。

9210

深入理解 TypeScript 中的 Keyof 运算符,让你的代码更安全、更灵活!

keyof 运算符是在 TypeScript 2.1 版本中引入的。这个关键字已经成为 TypeScript 中高级类型的基石,并在代码中经常使用。...keyof T 返回的是字符串字面量类型的联合。字面量指的是赋值给常量变量的固定值。由于 K 是一个字符串字面量类型,我们使用 extends 关键字对 K 进行约束。...索引操作符 obj[key] 返回属性所具有的相同类型。...函数 sampleStringPair 接受两个参数:property(类型为 keyof stringMapDemo)和 value(字符串类型),并返回一个 stringMapDemo 类型的对象。...结束 TypeScriptkeyof 运算符虽然小巧,但却是 TypeScript 机制中不可或缺的一环。

8210

分享 40 道关于 Typescript 的面试题及其答案

答案:TypeScript 中的静态类型可以在开发过程中指定变量、函数参数和返回值的数据类型。这有助于及早捕获与类型相关的错误,从而提高代码质量和可维护性。...答案:TypeScript 中的“keyof”关键字是一个类型运算符,它返回表示对象键的文字类型的联合。它允许您对对象键执行类型安全操作。...答案:TypeScript 中的模板文字类型允许您使用模板文字语法来操作类型中的字符串。它们提供了一种基于字符串模式创建复杂类型的方法。...答案:TypeScript 中的“as const”断言用于推断数组和对象的文字类型。它告诉编译器该值应被视为常量,而不是扩展到其基本类型。...在此示例中,NameType 类型被推断为字符串,因为 name 变量具有字符串值。

47530

TypeScript进阶 之 重难点梳理

这个索引签名表示了当用number去索引StringArray时会得到string类型的返回值。 Typescript支持两种索引签名:字符串和数字。...可以同时使用两种类型的索引,但是数字索引的返回值必须是字符串索引返回值类型的子类型。 这是因为当使用number来索引时,JavaScript会将它转换成string然后再去索引对象。...假设 T 是一个类型,那么keyof T产生的类型就是 T 的属性名称字符串字面量类型构成的联合类型(联合类型比较简单,和交叉类型对立相似,这里就不做介绍了)。 「注意!...注意,如果 T 是带有字符串索引的类型,那么keyof T是 string或者number类型。..." or "age" 结合以上泛型解释,再看形参 K[] 即为 只能包含"name" or "age"的数组 再看返回值 T[K][] 后面的[]是数组的意思。

3.8K20
领券