TypeScript keyof
keyof
是 TypeScript 中的一个关键字,用于获取一个类型的所有键(属性名)构成的联合类型。它主要用于在类型系统中引用对象类型的键。
以下是一些 keyof
的用法和示例:
1. 获取对象类型的键:
type Person = {
name: string;
age: number;
}; type KeysOfPerson = keyof Person; // KeysOfPerson 的类型为 "name" | "age"
在这个例子中,keyof Person
返回的是字符串字面量类型 "name" | "age"
,表示 Person
对象类型的所有键。
2. 用于函数参数类型的推断:
type Person = {
name: string;
age: number;
}; function getProperty<T, K extends keyof T>(obj: T, key: K): T[K] {
return obj[key];
} const person: Person = {
name: "John",
age: 30
}; const personName: string = getProperty(person, "name");
const personAge: number = getProperty(person, "age");
在这个例子中,K extends keyof T
表示 K
必须是类型 T
的键。这样,在函数中使用 T[K]
就能够获取对象 obj
中键为 key
的属性的类型。
3. 类型安全的属性访问:
type Person = {
name: string;
age: number;
}; function logProperty<T, K extends keyof T>(obj: T, key: K): void {
console.log(obj[key]);
} const person: Person = {
name: "John",
age: 30
}; logProperty(person, "name"); // 输出: John
logProperty(person, "age"); // 输出: 30
logProperty(person, "address"); // Error: "address" 不是 Person 的键
在这个例子中,使用 keyof
进行属性访问,使得在编译时就能够捕获可能的错误,例如尝试访问不存在的属性。
总的来说,keyof
是 TypeScript 中用于处理对象类型键的一种强大的工具,它在很多情况下能够提高代码的类型安全性。
TypeScript keyof的更多相关文章
- TypeScript keyof typeof All In one
TypeScript keyof typeof All In one keyof typeof refs https://www.typescriptlang.org/docs/handbook/re ...
- [TypeScript] Query Properties with keyof and Lookup Types in TypeScript
The keyof operator produces a union type of all known, public property names of a given type. You ca ...
- Angular2+typescript+webpack2(支持aot, tree shaking, lazy loading)
概述 Angular2官方推荐的应该是使用systemjs加载, 但是当我使用到它的tree shaking的时候,发现如果使用systemjs+rollup,只能打包成一个文件,然后lazy loa ...
- angular2 学习笔记 (Typescript)
1.接口奇葩验证 interface Abc { name : string } function abc(obj : Abc) { } let ttc = { name: "adad&qu ...
- TypeScript 零基础入门
前言 2015 年末看过一篇文章<ES2015 & babel 实战:开发 npm 模块>,那时刚接触 ES6 不久,发觉新的 ES6 语法大大简化了 JavaScript 程序的 ...
- TypeScript中的怪语法
TypeScript中的怪语法 如何处理undefined 和 null undefined的含义是:一个变量没有初始化. null的含义是:一个变量的值是空. undefined 和 null 的最 ...
- JavaScript 和 TypeScript 交叉口 —— 类型定义文件(*.d.ts)
在 <从 JavaScript 到 TypeScript 系列> 文章我们已经学习了 TypeScript 相关的知识. TypeScript 的核心在于静态类型,我们在编写 TS 的时候 ...
- vue.js 学习笔记3——TypeScript
目录 vue.js 学习笔记3--TypeScript 工具 基础类型 数组 元组 枚举 字面量 接口 类类型 类类型要素 函数 函数参数 this对象和类型 重载 迭代器 Symbol.iterat ...
- Typescript高级类型与泛型难点详解
最近做的TS分享,到了高级类型这一块.通过琢磨和实验还是挖掘出了一些深层的东西,在此处做一下记录,也分享给各位热爱前端的小伙伴. 其实在学习TS之前就要明确以下几点: 1. typescrip ...
- 如何编写 Typescript 声明文件
使用TypeScript已经有了一段时间,这的确是一个好东西,虽说在使用的过程中也发现了一些bug,不过都是些小问题,所以整体体验还是很不错的. TypeScript之所以叫Type,和它的强类型是分 ...
随机推荐
- 【笔记】Java相关大杂烩①
[笔记]Java相关大杂烩 Java 程序的执行流程是? *.java 文件-->*.class 文件-->类装载器-->字节码校验器-->解释器-->操作系统平台 Ja ...
- 力扣904(Java)-水果成篮(中等)
题目: 你正在探访一家农场,农场从左到右种植了一排果树.这些树用一个整数数组 fruits 表示,其中 fruits[i] 是第 i 棵树上的水果 种类 . 你想要尽可能多地收集水果.然而,农场的主人 ...
- 力扣59(java)-螺旋矩阵Ⅱ(中等)
题目: 给你一个正整数 n ,生成一个包含 1 到 n2 所有元素,且元素按顺时针顺序螺旋排列的 n x n 正方形矩阵 matrix . 输入:n = 3 输出:[[1,2,3],[8,9,4],[ ...
- 基于 PTS 压测轻松玩转问题诊断
简介:性能测试 PTS(Performance Testing Service)是具备强大的分布式压测能力的 SaaS 压测平台,可模拟海量用户的真实业务场景,全方位验证业务站点的性能.容量和稳定性 ...
- [FAQ] Vue iframe 的 src 是链接地址却加载了相对路径 ?
iframe 的 src 是链接, 但是加载的实际链接是相对路径,只有一种可能:链接地址不正确. 检查链接有没有少符号,常见错误:http//,http:/ Refer:Vue的iframe错误 Li ...
- [ML] 可视化编写运行 Python 脚本的工具 Jupyter
Jupyter 提供了可视化的编写和运行 python 程序的 Web 界面. https://jupyter.org/install 使用只需要两步: $ pip install jupyterla ...
- 关于Git和Svn的区别
关于Git 和 Svn 的选用,详细列出区别 Git 是分布式的,而 Svn 不是分布的; Git 把内容按元数据方式存储,而 SVN 是按文件; Git 没有一个全局版本号,而 SVN 有:目前为止 ...
- Stable Diffusion中的embedding
Stable Diffusion中的embedding 嵌入,也称为文本反转,是在 Stable Diffusion 中控制图像样式的另一种方法.在这篇文章中,我们将学习什么是嵌入,在哪里可以找到它们 ...
- 自制一个发送验证码的10秒倒计时js效果
<template> <div class="conten1"> <input class="code" ...
- 【详细教程】手把手教你开通YouTube官方API接口(youtube data api v3)
一.背景调查 1.1 youtube介绍 众所周知,youtube是目前全球最大的视频社交平台,该平台每天产生大量的视频内容,涵盖各种主题和类型,从音乐视频到教育内容,再到娱乐节目和新闻报道等.You ...