原文:TypeScript基本知识点整理

零、序言

  联合类型表示一个变量值可以是几种类型之一,我们可以使用 “|” 来分割每个类型;

  联合类型的变量在被赋值时,会根据类型推断的规则推断出一个类型;

  如果一个值是联合类型,我们只能访问联合类型的所有类型中共有的属性/方法;

let ddd : string | number
ddd = 'nihao'
console.log(ddd.length) //ddd被推断成了 string,访问它的 length 属性不会报错
console.log(`联合类型${ddd}`) ddd = 255
console.log(`联合类型${ddd}`)
console.log(ddd.length)//报错 ddd被推断成了 number,访问它的 length 属性时就报错了 //ddd = false err
//console.log(`联合类型${ddd}`) err

一、访问联合类型的属性或者方法

  当 TypeScript 不确定一个联合类型的变量到底是哪个类型的时候,我们只能访问此联合类型的所有类型里共有的属性或方法:

function f11(name : string, age : string | number) {
console.log(age.length)//报错
}
f11('ljy', '21') 报错:Property 'length' does not exist on type 'string | number'.Property 'length' does not exist on type 'number'.

在上例中,length 不是 string 和 number 的共有属性,故会报错。

function f12(name : string, age : string | number) {
console.log(age.toString())
}
f12('ljy', 21)

toString() 是共有的,故不会报错。

Typescript - 联合类型的更多相关文章

  1. Typescript使用字符串联合类型代替枚举类型

    TypeScript宗旨 我觉得Typescript的宗旨是 任何一个 TypeScript 程序,在手动删去类型部分,将后缀改成 .js 后,都应能够正常运行.Typescript是javascri ...

  2. Typescript基础类型

    1.布尔值__boolean 2.数字__number----除了支持十进制和十六进制字面量,Typescript还支持ECMAScript 2015中引入的二进制和八进制字面量. 3.字符串__st ...

  3. C# vs TypeScript - 高级类型

    总目录 从C#到TypeScript - 类型 从C#到TypeScript - 高级类型 从C#到TypeScript - 变量 从C#到TypeScript - 接口 从C#到TypeScript ...

  4. 从C#到TypeScript - 高级类型

    C# vs TypeScript - 高级类型 上一篇讲了基础类型,基本上用基础类型足够开发了,不过如果要更高效的开发,还是要看下高级类型,这篇和C#共同点并不多,只是延用这个主题. 联合类型 可以从 ...

  5. Typescript高级类型与泛型难点详解

    最近做的TS分享,到了高级类型这一块.通过琢磨和实验还是挖掘出了一些深层的东西,在此处做一下记录,也分享给各位热爱前端的小伙伴.   其实在学习TS之前就要明确以下几点:   1. typescrip ...

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

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

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

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

  8. typescript基础类型(学习笔记非干货)

    布尔值 Boolean let isDone:boolean=false; 数字 Number let decLiteral:number=6; let hexLiteral:number=0xf00 ...

  9. TypeScript 基本类型(一)

    1.boolean 布尔值 true/false let isDone: boolean = false; 2.number 数字:和JavaScript 一样,TypeScript 里的所有数字都是 ...

随机推荐

  1. deque & list

    deque 双向队列 它也是采用动态数组的方式来管理的提供了随机数组 和vector的区别 1.deque头尾两端可以开放,能够进行快速的插入和删除(vector只能在尾部进行快速的插入和删除) 2. ...

  2. HTML学习的一些笔记

    为什么会出现HTML这个标记语言 超文本标记语言 HyperText Markup Language HTML是超文本标记语言,标准通用标记语言的一个应用. "超文本"就是指页面内 ...

  3. C和C++的区别,有你不知道的

    c和c++可以说现在都是比较流行的,但是两者到底有什么联系和区别吗,这是学习c和c++最需要注意的,不要把两者搞混了,我们先开始就来看一下c和c++有什么联系,这两者可以这样说:C++是C的超集,兼容 ...

  4. 1.Jenkins基本安装及插件离线安装

    Jenkins基本安装 Jenkins官方地址:https://jenkins.io/zh/,下载最新版本,需要依赖对应的jdk版本才可以正常运行. dockerfile文件构建docker镜像 FR ...

  5. Mongo学习记录

    引子 最近做项目利用mongo记录的日志做数据统计.着了非关系型数据库的迷,于是乎买了本<MongoDB实战>学习了一番.记录一下学习笔记,共享之. 准备 我在自己的Linux服务器上装了 ...

  6. windows10使用npm安装vue、vue-cli

    从网上下载了一个免费的vue.js前端模板,准备和Django整合出一个项目出来,然后发现前端代码都是.vue文件,已经整合过.html,很容易,感觉这个.vue的前端稍微复杂一些 本文主要参考博客及 ...

  7. maven多模块profiles的石使用

    另外参考:https://blog.csdn.net/linhao19891124/article/details/73872303 maven中指定build一个project中几个特定的子modu ...

  8. Python_运维中常用的20个库和模块

    1.psutil是一个跨平台库(https://github.com/giampaolo/psutil)能够实现获取系统运行的进程和系统利用率(内存,CPU,磁盘,网络等),主要用于系统监控,分析和系 ...

  9. 网络流dinic板子

    bool bfs(){ memset(deep,0,sizeof(deep)); queue<int>que; que.push(s); deep[s]=1; while(!que.emp ...

  10. 郑宇以城市计算研究膺选 MIT 科技创新35俊杰 (TR35)

    MIT 科技创新35俊杰 (TR35)"> 编者按:<MIT Technology Review>于8月22日发布了令人瞩目的2013年全球杰出青年创新者(MIT TR35 ...