原文: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. 前端Json 增加,删除,修改元素(包含json数组处理)

    一:基础JSON对象  二:JSON数组数据 以下为增删修改方法: <!DOCTYPE html> <html lang="en"> <head> ...

  2. Docker Compose文件详解 V2

    Compose file reference 语法: web:      build: ./web      ports:      - "5000:5000"      volu ...

  3. LeetCode——1305. 两棵二叉搜索树中的所有元素

    给你 root1 和 root2 这两棵二叉搜索树. 请你返回一个列表,其中包含 两棵树 中的所有整数并按 升序 排序.. 示例 1: 输入:root1 = [2,1,4], root2 = [1,0 ...

  4. 解决ubuntu16.04启动时长时间陷入紫屏

    今天我的ubuntu系统进不去,一启动就陷入紫屏的死循环中,重装了两遍系统还是一样进不去,后来上网查找了各种解决办法,网上都说是显卡的问题,我也不懂什么意思.试了几种方法,终于解决了这个问题,在这里记 ...

  5. AtCoder Grand Contest 033

    为什么ABC那么多?建议Atcoder多出些ARC/AGC,好不容易才轮到AGC…… A 签到.就是以黑点为源点做多元最短路,由于边长是1直接bfs就好了,求最长路径. #include<bit ...

  6. 4418开发板基于Linux-c测试程序的编译和运行

    基于iTOP4418开发板的Linux-c的测试程序iTOP-4418 开发板可以运行的文件系统很多,在具体的文件系统上实现特定功能前,可以使用 Linux-c 程序来测试硬件以及驱动.而且这些程序很 ...

  7. 吴裕雄--天生自然python机器学习:使用Logistic回归从疝气病症预测病马的死亡率

    ,除了部分指标主观和难以测量外,该数据还存在一个问题,数据集中有 30%的值是缺失的.下面将首先介绍如何处理数据集中的数据缺失问题,然 后 再 利 用 Logistic回 归 和随机梯度上升算法来预测 ...

  8. intel windows caffe加速

    网址: https://github.com/BeFreeRoad/intel_caffe_windows 将intel caffe从linux平台移植到windows平台. 性能: 在虚拟机上测试可 ...

  9. 客户端和后台交互日期注意点 sqlite日期字段使用Date类型的情况下

    不要直接传递时间类型 一般把时间格式化字符串后传递 不要传递Date().getTime() 毫秒数  非要使用的话需要在后台处理 传递的毫秒数 - TimeZone.getDefault().get ...

  10. 简单Arp欺骗

    title date layout tags 简单arp欺骗 2018-05-08 post Python #-*- coding:utf-8 -*- from scapy.all import Et ...