Q shen
分享
展开
-
TypeScript 装饰器:完整指南
属性描述符 Dead Simple Chat 提供 Javascript Chat API 和 SDK,可在几分钟内将应用内聊天添加到您的 React 应用程序。就像一个程序可能会依赖其他类的方法或属性一样,这可能是装饰器的一个用例,它们提供了一种维护代码并提高可读性的简单方法。然后我们记录一个之前的属性名称,然后我们调用该originalMethod函数,然后我们记录之后的属性名称。装饰器是很棒的功能,许多库都是由装饰器组成的,比如 react 和 angular。args属性接受 n 个参数。原创 2023-06-11 12:08:53 · 202 阅读 · 0 评论 -
21. Typescript - 提示和技巧 - 剩余参数和剩余参数
在这个例子中,我们用固定数量的元素调用了“multiply”方法,在第一种情况下是 3 个,在第二种情况下是 4 个。但在某些情况下,我们不知道元素的正确数量,也许它们在一个数组中。此功能允许我们将此参数列表标识为数组类型,这样我们就可以让我们的消费者使用他需要的正确数量的项目来调用该方法,并且我们可以更轻松地操作这些参数。如您所见,现在消费者可以随心所欲地调用“multiply”方法,并且我们的代码在所有情况下都能正确响应。我觉得这两个功能真的很强大,可以帮助你操作大量的参数,让你的代码简单灵活。原创 2023-06-04 14:58:07 · 53 阅读 · 0 评论 -
20. Typescript - 提示与技巧 - 高级类型
此实用程序允许您从函数类型中提取this 参数,或者如果函数类型没有 this 参数则为未知。此实用程序允许您构造一个由构造函数类型的实例类型组成的类型。此实用程序允许您将只读修饰符添加到您的类型的所有属性。此实用程序允许您将可选修饰符添加到类型的所有属性。此实用程序允许您将一种类型的属性映射到另一种类型。此实用程序允许您删除类型的所有属性的可选修饰符。此实用程序允许您从联合类型中删除未定义和空类型。此实用程序允许您从联合类型中删除某些类型。此实用程序允许您从联合类型中获取某些类型。原创 2023-06-04 14:58:51 · 44 阅读 · 0 评论 -
19. Typescript - 提示与技巧 - 映射类型
现在让我们添加两个简单的位来将我们的类型转换为新的“不同”类型。映射类型允许您从类型中添加 (+) 或删除 (-) 只读修饰符,还可以添加 (+) 或删除 (-) 可选修饰符。映射类型是操纵我们类型的强大功能,typescript 团队使用它们向我们公开一些高级类型,但这是未来帖子的主题。如您所见,映射类型是由定义的键及其值组成的类型,但是当我们想与泛型类型开玩笑时,映射类型的力量就消失了。在某些情况下,我们需要操作某些类型来创建新类型。在这个简单的示例中,我向您展示了如何使用映射类型复制相同的对象。原创 2023-06-03 14:10:45 · 43 阅读 · 0 评论 -
18. Typescript - 提示与技巧 - 推断关键字
相反,在 UnboxingString 中,UnboxingArray 无法推断元素的类型,因为类型不扩展数组,因此它返回字符串类型。如您所见,在 UnboxingArray 类型中,我们可以检测 T 类型是否扩展了数组,如果是,我们可以推断元素类型,否则我们返回 T 类型。在此示例中,您可以注意到,如果 T 类型扩展了一个函数,则 ReturnType 会推断函数结果的类型,否则它会返回 never 类型。有时,我们需要获取数组的值类型或获取函数的返回类型。如果你喜欢我的文章,记得关注获取更多的信息。原创 2023-06-03 14:08:56 · 46 阅读 · 0 评论 -
17. Typescript - 提示与技巧 - 条件类型
在此示例中,您可以看到 AllCandies 类型如何创建一个新类型 (Candies),该类型由所有包含 candy 属性且值为 true 的 HalloweenTricksAndSweets 组成。在此示例中,我们将参数的类型作为字符串返回,但我想重点关注 TypeName 类型。在这种情况下,条件基于参数的类型,但我的目标是向您展示您可以检查类型是否符合某些条件并采取相应的行动。我认为这个有趣的例子最能表达条件类型的潜力,它可以帮助您更好地理解它可以带来的所有好处。原创 2023-06-03 14:07:26 · 54 阅读 · 0 评论 -
16. Typescript - 提示与技巧 - Type Guard
如果结果为真,则形状参数对应于 is 关键字右侧指示的类型,否则,它对应于另一种类型。在这里,我们在 if 条件中检测形状的类型,但打字稿允许我们创建一个特殊的函数来识别一个类型是否属于特定类型。创建这些函数是为了拥有类型保护,帮助编译器、智能感知和我们理解对象的正确类型。在这种情况下,在 area 方法中,我们需要检测形状的类型以返回正确的结果。为了向您展示这个功能的实际效果,可以用这种方式重写前面的示例。在某些情况下,我们需要检测对象的类型才能正确实现我们的方法。原创 2023-06-03 14:07:23 · 50 阅读 · 0 评论 -
15. Typescript - 提示与技巧 - 断言函数
如果您看到示例中我创建方形字段的部分,您会注意到方形字段的类型是{ kind: string;完成此转换是因为如果代码通过“ensureSquare”函数,您可以确定“square”字段的类型为 Square。相反,在示例的第二部分中,“rectangle”字段在运行时会抛出错误,“ensureSquare”函数之后的代码将永远不会执行。如您所见,在此示例中,assert 函数检测该人是否已定义,如果该人未定义,则 assert 函数将抛出错误并显示您传入参数的消息。原创 2023-06-03 14:05:17 · 50 阅读 · 0 评论 -
14. Typescript - 提示与技巧 - 从不打字
在 area 方法的末尾,您可以看到代码如何将形状分配给类型为_never 的字段“exhaustiveCheck”。在这个简单的示例中,您可以看到“throwException”方法如何从不允许执行 console.log 的代码。在这种情况下,“throwException”方法返回never类型,因为该方法不返回任何值但抛出错误。正如你所理解的,这个类型标识了一段永远不会被执行的代码或者代表了一个不应该存在的状态。圈子类型的评论是我自愿留下的,所以我可以告诉你永不类型的力量。原创 2023-06-03 14:02:29 · 30 阅读 · 0 评论 -
13. Typescript - 提示与技巧 - 非空断言运算符
为了解决这个问题,打字稿语言向我们公开了“非空断言操作”(!该运算符告诉编译器该字段不是空的或未定义的,而是已定义的。在某些情况下,您有一个在方法中初始化的字段,如果您按照代码流程进行操作,您可以确定该字段已初始化但打字稿无法理解。在这种情况下,您可以看到打字稿编译器如何不理解“person”字段不为空但它已被初始化。如果你喜欢我的文章,记得关注获取更多的信息。如您所见,在这种情况下,代码没有错误,编译成功结束。前面的例子可以这样复习。原创 2023-06-03 13:58:18 · 57 阅读 · 0 评论 -
12. Typescript - 提示与技巧 - 元组
如果您尝试将第二个元素设置为与数字、字符串或布尔值不同的类型,打字稿编译器会引发错误。在这种情况下,您可以看到 point 类型是如何由两个类型为 number 的元素组成的固定数组组成的。您可以看到打字稿如何检测此约束,并且当您尝试使用字符串类型的第二个元素创建一个点或尝试创建一个包含 3 个元素的点时,它会引发错误。元组类型是一种强大的类型,可帮助您识别数组中元素的类型,您可以创建特殊类型,其中数组元素可以具有不同的类型。元组类型允许您用固定数量的元素表示一个数组,这些元素的类型是已知的,但不必相同。原创 2023-06-03 13:56:21 · 41 阅读 · 0 评论 -
11. Typescript - 提示与技巧 - 只读数组
在这种情况下,sortAndReverse方法像第一个示例一样返回结果“[5,4,2,1]”,但更重要的是最终控制台日志返回“[1,4,5,2]”, “列表”数组的初始值。如果在这种情况下,您尝试删除“切片”方法,您会看到打字稿如何指示错误(类型“readonly number[]”上不存在属性“sort”),它可以帮助您防止奇怪的副作用.在这个愚蠢的例子中,您可以看到一些数组方法如何产生一些副作用。sort 和 reverse 方法返回一个包含结果的新数组,但它们也会更改初始数组。原创 2023-06-03 13:54:04 · 45 阅读 · 0 评论 -
10. Typescript - 提示与技巧 - 只读修饰符
不幸的是,在这些情况下,我们花费了大量时间来寻找谁更改了该属性的值。今天,我想向您展示一种特殊的修改器,可以帮助您防止出现此问题并节省您的时间。readonly 修饰符帮助您防止有人可以更改您的属性,因此,对象的属性只能在对象初始化时设置。在此示例中,您可以看到在第一种情况下如何更改属性“x”和“y”的值;相反,在第二种情况下,您不能更改属性,因为它们被标记为只读。如您所见,readonly 修饰符可以防止属性值的更改并使您的代码免于烦人的错误。如果你喜欢我的文章,记得关注获取更多的信息。原创 2023-06-03 13:51:50 · 37 阅读 · 0 评论 -
9. Typescript - 提示与技巧 - 索引签名
您必须记住的一件重要事情是,可以使用 for-in 循环或 Object.keys 方法迭代这些对象的键。在这种情况下,UserDictionary是一种特殊类型,其中用户名是对象的键,用户数据是值。这种类型非常强大,因为它允许消费者在知道键的情况下直接访问数据,并且它允许存储特定键的唯一值。如果你喜欢我的文章,记得关注获取更多的信息。使用索引签名,我们可以创建特殊类型,其中键可以是字符串或数字。在某些情况下,我们需要创建一些特殊类型,如字典。欢迎大家回来,今天我要讲的是“索引签名”。原创 2023-06-03 13:51:03 · 60 阅读 · 0 评论 -
8. Typescript - 提示与技巧 - 可选修饰符
在此示例中,我们可以看到可选修饰符的作用,“phone”属性被标记为可选,因此在“person1”对象中我们可以避免设置“phone”属性。为了在打字稿中做到这一点,我们有一个名为“可选”的特殊修饰符,它由问号 (?在这些情况下,我们需要确定可选属性和必需属性,以便消费者知道什么是必需的,什么不是。如果你喜欢我的文章,记得关注获取更多的信息。我们可以看到在第一个示例中我们如何避免设置电话参数,因为它是可选的。如果我们有一个或多个可选参数,这个修饰符也可以用在函数的参数中。有时我们的对象具有一些可选属性。原创 2023-06-03 13:49:34 · 70 阅读 · 0 评论 -
7. Typescript - 提示与技巧 - 任何与未知
如果你使用这种类型,编译器不会检查你的代码,权力在你手中,但权力越大,责任越大。在这种情况下,编译器不会检查您的代码,但您的代码可能存在错误;Unknown 类型是 typescript 中的另一种特殊类型,它类似于Any类型,但它可以帮助我们在构建时防止错误。这种类型不会停止编译器检查,但它可以帮助我们检查我们的类型以防止运行时出现错误。相反,在第三行中,我将布尔类型设置为数字类型,并在下一行中将此值加三。在此示例中,我们可以看到使用未知类型而不是任何类型的强大功能。原创 2023-06-03 13:47:57 · 46 阅读 · 0 评论 -
6. Typescript - 提示与技巧 - 这个参数
为此,我们需要将“this”上下文声明为函数的第一个参数,这样 typescript 会检测到“this”类型,这有助于我们防止错误和错误。如果我们构建并运行此代码,控制台日志的结果将为“NaN”,因为在 pow 方法中,字段“this.number”的值未定义。当我们尝试调用方法“basePow.pow(2)”时,打字稿语言检测到错误,在这种情况下,当我们尝试构建代码时,构建失败。注意,如果您在 true 的严格模式下构建此代码,编译器会在构建时检测到问题,因此构建失败。但现在我解释解决方案。原创 2023-06-03 13:45:08 · 36 阅读 · 0 评论 -
5. Typescript - 提示与技巧 - 重载函数
正如我们所见,“反向”函数有两个签名,一个获取一个字符串并返回一个字符串作为结果,第二个获取一个字符串数组并返回一个字符串数组作为结果。正如我们所见,参数类型是包含字符串或字符串数组(签名参数中类型的组合)的文字类型,我们可以对结果类型进行相同的考虑。要在打字稿中使用此功能,我们必须声明此函数的所有签名,最后,我们必须编写一个包含所有这些签名的函数。这个函数的特殊性在于它必须包含先前签名的所有可能实现。在函数实现中,我们在运行时检测参数的类型,并根据我们重载的函数操纵参数返回正确的类型。原创 2023-06-03 13:43:50 · 50 阅读 · 0 评论 -
4. Typescript - 提示与技巧 - 并集和交集
在这个例子中,我们可以看到联合类型是如何创建 Pet 类型的;此方法是两种初始类型中唯一存在的方法:Fish 和 Cat。在这种情况下,填充可以是数字或字符串,编译器会检测您是否设置了不同的类型;在某些情况下,我们必须组合不同的类型来创建新类型,或者有时我们有可能属于不同类型的参数。Typescript 为我们提供了两个强大的功能:并集(|) 和交集(&)。如果你喜欢我的文章,记得关注获取更多的信息。联合类型描述的值可以是多种类型之一。交集类型将多种类型组合为一种。原创 2023-06-03 13:44:20 · 177 阅读 · 0 评论 -
3. Typescript - 提示与技巧 - keyof
如果你喜欢我的文章,记得关注获取更多的信息。我们怎么看这个运算符更强大,它可以帮助我们创建新的严格类型或新的严格方法。该运算符帮助我们提取对象的属性,例如Literal-types。这个运算符可以帮助我们创建应该依赖于其他类型的新方法;而且还可以从其他类型创建新类型,例如。今天要说的是keyof运算符。原创 2023-06-03 13:42:45 · 58 阅读 · 0 评论 -
2. Typescript - 提示与技巧 - 文字类型
您可以从不同的类型(例如布尔值、数字和字符串)创建文字类型,您也可以将不同的类型组合在一起。在这种情况下,文字类型还会为您的字段创建类型保护,因此编译器可以检测到您的错误或打字错误。如果你喜欢我的文章,记得关注获取更多的信息。此功能允许您创建一组关系值。今天我向您展示文字类型。原创 2023-06-03 12:50:20 · 38 阅读 · 0 评论 -
1.Typescript - 提示与技巧 - typeof
我开始这个系列是因为每天我在 typescript 文件中看到太多的any类型,所以我想帮助开发人员更好地学习 typescript 语言。在类型中可以看到最大的优势:函数、空值、对象。一点序言,typeof 也是一个 javascript 运算符,但是有了 typescript,它就有了超能力。我们如何看待一些事情是奇怪的:例如,当我们得到一个空变量的类型时,javascript 返回一个对象类型。在此示例中,我们可以看到如何从复杂对象中提取简单类型。在开始之前,我想解释一下我为什么开始这个系列。原创 2023-06-03 12:50:07 · 55 阅读 · 0 评论