联合类型

在实际开发中,我们接收的变量可能不是一个固定的数据类型,而是动态的多个数据类型,此时用单个固定的数据类型去接收很明显是不行的,为了解决这种可能会接收多个不同数据类型的变量就需要用到联合类型。联合类型表示取值可以为多种类型中的一种。

语法:let 变量名 : 数据类型 | 数据类型2 = 值

let str : string | number = '世界现代设计史'
console.log(str); // 世界现代设计史
str = 100
console.log(str); // 100
// str = true // 报错

在函数中使用联合类型

// 该函数可以传入数字类型和字符串类型,返回值为字符串类型
const getString = (str:number|string):string =>{
// return str // 打印100 报错 返回的类型必须是字符串
return str.toString() // 转字符串,返回字符串类型
}
console.log(getString(100));

类型断言

类型断言也就是告诉编译器,我知道自己是什么类型,也知道自己在干什么。

类型断言的语法:

1、<类型>变量名 (<number[]>val)

2、变量名 as 类型 (val as number[])

类型断言也就是在编译的时候断定这个值是什么类型的,如果是的话就做什么操作。

let val : number[] = [100,200,300]
// 如果val存在,那么它是一个数组类型的,输出val.length
console.log((val as number[]).length); // 打印 3

可以通过类型断言来做对应的操作,比如遍历一个数组:

let val : number[] = [100,200,300]
// 如果val存在,那么它是一个数组,遍历数组
(<number[]>val).forEach(el=>{
console.log(el); // 打印 100,200,300
})

类型断言可以多重嵌套,比如双重类型断言

如果 val 存在,那么它是any类型的,如果val存在并且是any类型的,它则是number[]类型的,打印数组的长度

console.log(((val as any) as number[]).length);
// 打印 3

类型推断

类型推断: 在没有明确指定类型的时候,推测出一个类型。

声明一个变量,这个变量没有定义数据类型,系统会根据变量的值自动推断它是什么类型,并且以此类型为规范。

// 在没有明确指定类型的时候推测出一个类型
let txt = 100 // 推断 number类型
// txt = '东方不败' // 赋值 string类型 报错
console.log(txt); // 打印 100

如果声明的变量没有赋值,那么这个变量为any类型,any类型的变量可以是任何数据类型。

let txt2   // 变量声明了没赋值 any类型
txt2 = 200
txt2 = '世界现代设计史'
console.log(txt2);

案例源码:https://gitee.com/wang_fan_w/ts-seminar

如果觉得这篇文章对你有帮助,欢迎点亮star

【TS】联合类型--类型断言--类型推断的更多相关文章

  1. TS数据类型:类型别名/联合类型/字面量类型/类型推论等纲要

    在学C/C++  Java等强类型语言时,变量类型是唯一的,需要先指定.PHP JavaScript等弱类型语言时,无需指定变量类型 但是,TypeScript里面的联合类型 (Union Type) ...

  2. TS学习随笔(二)->类型推论,联合类型

    这篇内容指南:        -----类型推论  -----联合类型 类型推论 第一篇中我们看了TS的基本使用和基本数据类型的使用,知道了变量在使用的时候都得加一个类型,那我们可不可以不加呢,这个嘛 ...

  3. TS学习笔记----(一)基础类型

    布尔值: boolean let isDone: boolean = false; 数字: number 和JavaScript一样,TS里的所有数字都是浮点数. 支持十进制和十六进制字面量,TS还支 ...

  4. TypeScript 类型推导及类型兼容性

    类型推导就是在没有明确指出类型的地方,TypeScript编译器会自己去推测出当前变量的类型. 例如下面的例子: let a = 1; 我们并没有明确指明a的类型,所以编译器通过结果反向推断变量a的类 ...

  5. typescript枚举,类型推论,类型兼容性,高级类型,Symbols(学习笔记非干货)

    枚举部分 Enumeration part 使用枚举我们可以定义一些有名字的数字常量. 枚举通过 enum关键字来定义. Using enumerations, we can define some ...

  6. TypeScript 之 基础类型、高级类型

    基础类型:https://m.runoob.com/manual/gitbook/TypeScript/_book/doc/handbook/Basic%20Types.html 高级类型:https ...

  7. scala学习笔记-类型参数中协变(+)、逆变(-)、类型上界(<:)和类型下界(>:)的使用

    转载自  fineqtbull   http://fineqtbull.iteye.com/blog/477994 有位je上的同学来短信向我问起了Scala类型参数中协变.逆变.类型上界和类型下界的 ...

  8. "元素隐式具有 “any” 类型,因为类型“Shared”没有索引签名"问题解决思路

    最近在构建一个typescript项目时如下代码在项目框架里vscode报错元素隐式具有 "any" 类型,因为类型“Shared”没有索引签名;很有意思的是当我们单独的把这段代码 ...

  9. [C语言]进阶|结构类型: 枚举, 结构, 类型定义

    --------------------------------------------------------------------- 枚举: // main.c #include <std ...

  10. 【Go入门教程3】基本类型 和 高级类型

    基本类型 Go 有很多预定义类型,这里简单地把它们分为 基本类型 和 高级类型.Go 的基本类型并不多,而且大部分都与整数相关,如下表所示: 名 称 宽度(字节) 零 值 说 明 bool 1 fal ...

随机推荐

  1. win 10 玩红警/黑边,不能全屏,闪退

    win 10玩红警黑边问题 1.下载ddraw.dll,放在游戏目录 下载链接:ddraw.dll 如果提示 选择保留就行了 2.Win 键+S键,搜索注册表,打开这个 进去按这个路径    计算机\ ...

  2. editorial 专栏

    社论 22.10.1 solution for pl_er 密码是我的名字的拼音 全小写无空格 社论 22.10.2 solution for Simu. 密码是联考密码 社论 22.10.4 sol ...

  3. 【Shell案例】【tail/head/sed、echo $res ·· cat和管道】2、打印文件的最后5行

    描述经常查看日志的时候,会从文件的末尾往前查看,于是请你写一个 bash脚本以输出一个文本文件 nowcoder.txt中的最后5行示例:假设 nowcoder.txt 内容如下: #include& ...

  4. 【Zookeeper】结构、应用、安装部署与参数、客户端命令行操作、API应用、内部原理(选举机制、写数据、监听器)

    一.Zookeeper入门 1.概述 分布式服务管理框架(存储和管理数据) Zookeeper=文件系统+通知机制 2.特点 主从集群 半数以上,正常工作 请求顺序执行 数据更新具有原子性 3.数据结 ...

  5. 秒级查询之开源分布式SQL查询引擎Presto实操-上

    @ 目录 概述 定义 概念 架构 优缺点 连接器 部署 集群安装 常用配置说明 资源管理安装模式 安装命令行界面 基于Tableau Web 连接器 使用优化 数据存储 查询SQL优化 无缝替换Hiv ...

  6. 常用BOM操作 DOM操作 事件 jQuery类库

    目录 BOM操作 常用BOM操作 三种弹出框 alert confirm prompt 定时任务 setTimeout 循环定时 setInterval DOM操作 查找标签 直接查找 间接查找 操作 ...

  7. PTA散列表平方探测法解决冲突

    PTA散列表平方探测法解决冲突 核心问题   当所有的位置都被填上了,且不能插入关键词,要进入死循环了怎么办? 题目   本题的任务很简单:将给定的无重复正整数序列插入一个散列表,输出每个输入的数字在 ...

  8. Django静态文件配置、form表单、request对象、连接数据库、ORM

    目录 静态文件配置 静态文件相关配置 1.接口前缀 浏览器停用缓存 2.接口前缀动态匹配 form表单 action 控制数据提交的地址 method 控制数据提交的方法 请求方法补充 get: 朝服 ...

  9. 多线程爬取wallhaven

    前言 最近整理自己的项目时,发现之前自己写的爬取wallhaven网站顿时有来的兴趣决定再写一遍来回顾自己以前学的知识 网站地址:"https://wallhaven.cc/" 1 ...

  10. 【转载】EXCEL VBA 通过VBA中的Union合并多个Range选择区域

    在Excel中,Union的功能是合并两个或两个以上的选择区域,合并成为一个更大的区域. 所合并的多个选择区域,这些选择区域,可以是不连续的,也可以是连续的.一般情况下,要使用Union,可通过如下来 ...