typeScript中特殊类型定义
// 工具类Partial,可以把定义的属性变成可选的,当然age?: number也可以解决
interface IStudent {
address: string
age: number
}
// 正常
const Tom:IStudent = {
address: '湖北',
age: 19
}
// 报错
const Jack:IStudent = {
address: '湖北'
}
// 解决
type OptionIStudent = Partial<IStudent> const Jack1:OptionIStudent = {
address: '湖北'
} // Partial底层实现
type Partial<T> = {
[P in keyof T]?: T[P]
}
// 描述函数类型
interface Isum {
(x: number, y: number): number
} const add:Isum = (num1, num2) => {
return num1 + num2
} add(2,3)
implements 实现的意思,主要用来给class定义约束
interface MusicInterface {
pay():void
}
// phone类如果没有pay方法会报错
class phone implements MusicInterface {
pay() {}
}
// 枚举,特点: 数字递增,反向映射
enum Direction {
Up,
Down,
Left,
Right
}
// 数字递增
console.log(Direction.Up); // 0
console.log(Direction.Down); // 1 // 反向映射
console.log(Direction[0]); // Up // 当然也可以自己定义递增的初始值
enum Direction1 {
Up = 2,
Down,
Left,
Right
}
console.log(Direction.Down); // 3 // 当然也可以定义字符串枚举
enum Direction2 {
Up = 'UP',
Down = 'DOWN'
}
// Ts高级类型
// | 指可以是其中一种类型 & 把类型合并成一个新的类型
// 联合类型
let num: number | string // 交叉类型
interface Student {
name: string
}
type Person = Student & { age:number } let alan: Person = {
name: 'alan',
age: 18
}
// 定义类型可以用type 和 interface
// 相同点是: 都可以定义对象或者函数类型,都允许继承
// 不同点是: interface是Ts的产物,用来定义对象类型,interface可以合并重复声明,type 不行
type是js的,可以用来定义基本类型,联合类型,交叉类型,元组,interface不行
// typeof类型判断和 as类型断言
function getLength(str: number | string): number {
// return str.length 会报错应为number类型没有length
if (typeof str === 'string') {
return str.length
}
return str.toString().length
} function getLength1(str: number | string): number {
const str1 = str as string
if (str1.length) return str1.length
const str2 = str as number
return str2.toString().length
}
// 字面量类型
type sex = '男' | '女'
// 泛型语法是<> 里面写类型参数,一般用<T>来标识,可以解决输入和输出一致的问题
function student<T>(name: T):T {
return name
}
const res: string = student('123')
const res1: Number = student(123) // 添加默认参数
interface IPay<T =string> {
(age:T): T
}
function pay<T>(age: T) {
return age
}
const mypay:IPay = pay
typeScript中特殊类型定义的更多相关文章
- 聊聊 TypeScript 中的类型保护
聊聊 TypeScript 中的类型保护 在 TypeScript 中使用联合类型时,往往会碰到这种尴尬的情况: interface Bird { // 独有方法 fly(); // 共有方法 lay ...
- TypeScript 中枚举类型的理解?应用场景?
一.是什么 枚举是一个被命名的整型常数的集合,用于声明一组命名的常数,当一个变量有几种可能的取值时,可以将它定义为枚举类型 通俗来说,枚举就是一个对象的所有可能取值的集合 在日常生活中也很常见,例如表 ...
- JavaScript 和 TypeScript 交叉口 —— 类型定义文件(*.d.ts)
在 <从 JavaScript 到 TypeScript 系列> 文章我们已经学习了 TypeScript 相关的知识. TypeScript 的核心在于静态类型,我们在编写 TS 的时候 ...
- 5种在TypeScript中使用的类型保护
摘要:在本文中,回顾了TypeScript中几个最有用的类型保护,并通过几个例子来了解它们的实际应用. 本文分享自华为云社区<如何在TypeScript中使用类型保护>,作者:Ocean2 ...
- TypeScript Type Compatibility(类型兼容)
TypeScript中的类型兼容是基于结构归类的.在普通分类的相比之下,结构归类是一种纯粹用于将其成员的类型进行关联的方法.思考下面的代码: interface Named { name: strin ...
- TypeScript Type Innference(类型推断)
在这一节,我们将介绍TypeScript中的类型推断.我们将会讨论类型推断需要在何处用到以及如何推断. 基础 在TypeScript中,在几个没有明确指定类型注释的地方将会使用类型推断来提供类型信息. ...
- Lua中的类型与值
[基础介绍] Lua是一种动态类型的语言.在语言中没有类型定义的语法,每个值都带有其自身的类型信息.在Lua中有8中基本类型,分别是: nil(空)类型 boolean(布尔)类型 number(数字 ...
- NodeJS类型定义方式
最近在学习nodejs,就是因为它比较轻便,并发量大,上手快.由于以前一直在做C#的后端,没有接触过javascript,所以还得慢慢学习之. nodejs所用的是javascript语言,它没有如C ...
- Golang通脉之类型定义
自定义类型 在Go语言中有一些基本的数据类型,如string.整型.浮点型.布尔等数据类型, Go语言中可以使用type关键字来定义自定义类型. type是Go语法里的重要而且常用的关键字,type绝 ...
- 在 Typescript 2.0 中使用 @types 类型定义
在 Typescript 2.0 中使用 @type 类型定义 基于 Typescript 开发的时候,很麻烦的一个问题就是类型定义.导致在编译的时候,经常会看到一连串的找不到类型的提示.解决的方式经 ...
随机推荐
- tasklist
tasklist是windows下列出进程信息的指令,可配合taskKill来关毕进程 https://learn.microsoft.com/zh-cn/windows-server/adminis ...
- VUE学习-表单输入绑定
表单输入绑定 v-model 可以用 v-model 指令在表单 <input>.<textarea> 及 <select> 元素上创建双向数据绑定. v-mode ...
- CodeGym自学笔记04——什么是编译器?
编译器 编程语言可以同时被人和编译器所理解.编译器是一个特殊的程序,它可将用编程语言编写的程序转换成一系列的机器代码. 程序员通常用编程语言来编写程序,然后运行编译器,将程序员编写的程序代码文件转换为 ...
- VSCode配置 关于丢失VSCode默认启动终端一事
在配置前端开发环境的时候碰到一个VSCode 的配置问题,在VSCode 中启用项目的时候,发现默认终端(PowerShell)是空的 项目无法启动,这时候需要自己选择终端 git Bash :自己安 ...
- JavaSE——.replace()方法替换内容
package com.zhao.stringtest; public class Test5 { //.replace()方法替换词汇 public static void main(String[ ...
- shell脚本自动过滤尝试多次连接ip并添加到系统黑名单
#!/bin/bash cat /var/log/secure|awk '/Failed/{print $(NF-3)}'|sort|uniq -c | awk '{{ print $2 " ...
- js复选框,三层结构
最终实现效果如下 html+css如下 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 < ...
- React-Navigation 5.x 的 demo案例
一. stack路由结构的一些效果 (1)横向过渡动画 (2)整个选项卡样式修饰 最终实现效果:动态图 以上两个功能实现都很简单,我测试时,关注了一个问题,navigation 丢失.stackNav ...
- MOBI 】逆流而上的我:重塑心理韧性,在逆境中实现自我超越【早稻田大学名誉教授、哈佛大学客座研究
书本详情 标题:逆流而上的我:重塑心理韧性,在逆境中实现自我超越[早稻田大学名誉教授.哈佛大学客座研究员加藤谛三的年度心理学温情巨作!掌握心理韧性,每个人都是生活的修行者!] | 加藤谛三 |年份:2 ...
- 12组-Beta冲刺-3/5
一.基本情况 队名:字节不跳动 组长博客:https://www.cnblogs.com/147258369k/p/15599024.html Github链接:https://github.com/ ...