联合类型

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

语法: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. Mybatis下的SQL注入漏洞原理及防护方法

    目录 一.前言 二.SQL 注入漏洞原理 1.概述 2.漏洞复现 3.修复建议 三.Mybatis 框架简介 1.参数符号的两种方式 2.漏洞复现 四.Mybatis 框架下的 SQL 注入问题及防护 ...

  2. ubuntu 20.04 / 22.04 运行32位程序

    sudo dpkg --add-architecture i386 sudo apt install libc6:i386 libstdc++6:i386 sudo apt-get update su ...

  3. -webkit-box-orient:vertical 编译报错之autoprefixer问题

    由于各大浏览器的兼容问题,autoprefixer 插件 就可以帮我们自动补齐前缀.它和 less.scss 这样的预处理器不同,它属于后置处理器. 预处理器:在打包之前进行处理 后置处理器:在代码打 ...

  4. 第2-4-10章 规则引擎Drools实战(3)-保险产品准入规则

    目录 9.3 保险产品准入规则 9.3.1 决策表 9.3.2 规则介绍 9.3.3 实现步骤 9.3 保险产品准入规则 全套代码及资料全部完整提供,点此处下载 9.3.1 决策表 前面我们编写的规则 ...

  5. 从0到1学Python丨图像平滑方法的两种非线性滤波:中值滤波、双边滤波

    摘要:常用于消除噪声的图像平滑方法包括三种线性滤波(均值滤波.方框滤波.高斯滤波)和两种非线性滤波(中值滤波.双边滤波),本文将详细讲解两种非线性滤波方法. 本文分享自华为云社区<[Python ...

  6. 使用 BenchmarkDotNet 比较指定容量的 List 的性能

    我们之前提到 List 是 .NET 中常用的数据结构,其在存储大量数据时,如果能够指定它的初始化容量,就会有性能提升.这个优化的方法并不是很明显,因此本文将使用 BenchmarkDotNet 库, ...

  7. java中的杨辉三角

    本文主要介绍如何打印杨辉三角(直角三角形),如下图所示: 规律如下: 第一行全为1,对角线元素全为1,设i表示行标,j表示列标. arr[i][0] = 1; arr[i][i] = 1; 当i &g ...

  8. IdentityServer4 - v4.x .Net中的实践应用

    认证授权服务的创建 以下内容以密码授权方式为例. 创建模拟访问DB各数据源类 为模拟测试准备的数据源. /// 假设的用户模型 public class TestUser { public strin ...

  9. Java读取文件后文件被占用

    Java读取文件响应后文件一直被占用问题 原因: 由于是封装的函数,请求和响应对象都是 形参地址 虽然在此函数里关闭了输出流,但是由于有返回值,调用未结束,输出流无法提前关闭 解决: 1:调用函数后, ...

  10. 真正“搞”懂HTTP协议07之队头阻塞真的很烦人

    这一篇文章,我们核心要聊的事情就是HTTP的对头阻塞问题,因为HTTP的核心改进其实就是在解决HTTP的队头阻塞.所以,我们会讲的理论多一些,而实践其实很少,要学习的头字段也只有一个,我会在最开始就讲 ...