now,我们来看一看TS里面的断言,听起来很上档次啊,其实看完你就发出惊叹,这就是断言啊

类型断言

  类型断言(Type Assertion)可以用来手动指定一个值的类型

  语法  

  <类型>值

   或者

  值 as 类型

  注意:在 tsx 语法(React 的 jsx 语法的 ts 版)中必须用后一种。

例子:将一个联合类型的变量指定为一个更加具体的类型

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

function getLength(something: string | number): number {
return something.length;
} // index.ts(2,22): error TS2339: Property 'length' does not exist on type 'string | number'.
// Property 'length' does not exist on type 'number'.

而有时候,我们确实需要在还不确定类型的时候就访问其中一个类型的属性或方法,比如:

function getLength(something: string | number): number {
if (something.length) {
return something.length;
} else {
return something.toString().length;
}
} // index.ts(2,19): error TS2339: Property 'length' does not exist on type 'string | number'.
// Property 'length' does not exist on type 'number'.
// index.ts(3,26): error TS2339: Property 'length' does not exist on type 'string | number'.
// Property 'length' does not exist on type 'number'.

上例中,获取 something.length 的时候会报错。

此时可以使用类型断言,将 something 断言成 string

function getLength(something: string | number): number {
if ((<string>something).length) {
return (<string>something).length;
} else {
return something.toString().length;
}
}

类型断言的用法如上,在需要断言的变量前加上 <Type> 即可。

注意:类型断言不是类型转换,断言成一个联合类型中不存在的类型是不允许的

function toBoolean(something: string | number): boolean {
return <boolean>something;
} // index.ts(2,10): error TS2352: Type 'string | number' cannot be converted to type 'boolean'.
// Type 'number' is not comparable to type 'boolean'.

TS学习随笔(六)->断言的更多相关文章

  1. TS学习随笔(一)->安装和基本数据类型

    去年学过一段时间的TS,但由于在工作中不常用.就生疏了,最近项目要求用TS,那我就再回去搞搞TS,写一篇记录一下自己学习TS的进度以及TS知识点 首先,关于TS的定义我就不在这描述了,想看百度一下你就 ...

  2. TS学习随笔(七)->声明文件

    now我们来看一看TS怎么声明文件, 在JS里面我们经常会使用各种第三方类库,引入方式也不太相同,常见的就是在HTML中通过script标签引入,然后就可以使用全局变量$或者jQuery了 我们通常这 ...

  3. TS学习随笔(三)->接口

    终于来到了比较重要的知识,接口,有多重要呢,反正是很重要好啵 在 TypeScript 中,我们使用接口(Interfaces)来定义对象的类型. 那什么是接口呢,在面向对象语言中,接口(Interf ...

  4. TS学习随笔(四)->数组的类型

    少侠们,今天我们继续来搞一搞TS 今天我们要来看一看TS中数组的定义是个什么鬼样子 数组的类型: 在 TypeScript 中,数组类型有多种定义方式,比较灵活.下面我们来看看有哪些定义方法 「类型 ...

  5. android 学习随笔六(网络要求及配置)

    android在4.0之后已经不允许在主线程执行http请求了. 主线程阻塞,应用会停止刷新界面,停止响应用户任何操作,耗时操作不要写在主线程   只有主线程才能修改UI ANR异常:Applicat ...

  6. TS学习随笔(五)->函数

    这篇文章我们来看一下TS里面的函数 函数声明 在 JavaScript 中,有两种常见的定义函数的方式——函数声明(Function Declaration)和函数表达式(Function Expre ...

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

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

  8. android 项目学习随笔六(网络缓存)

    1. 对SharePreference的封装 import android.content.Context; import android.content.SharedPreferences; /** ...

  9. Typescript 学习笔记六:接口

    中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...

随机推荐

  1. monaco editor + vue的配置

    monaco editor是vscode的御用编辑器. 功能非常强大,使用方便轻巧,对js\ts等等语言支持都良好,能方便的扩展以支持其他语言或者自定义的特性. 夸了这么多,这里只说它一个问题: 这货 ...

  2. [SQL]LeetCode175. 组合两个表 | Combine Two Tables

    Table: Person +-------------+---------+ | Column Name | Type | +-------------+---------+ | PersonId ...

  3. [Swift]LeetCode225. 用队列实现栈 | Implement Stack using Queues

    Implement the following operations of a stack using queues. push(x) -- Push element x onto stack. po ...

  4. [Swift]LeetCode897. 递增顺序查找树 | Increasing Order Search Tree

    Given a tree, rearrange the tree in in-order so that the leftmost node in the tree is now the root o ...

  5. win10安装ubuntu16.04及后续配置

    原文地址:https://www.jianshu.com/p/842e36a8255c UEFI 模式下win10安装ubuntu16.04双系统教程 - baobei0112的专栏 - CSDN博客 ...

  6. markdown反射型xss漏洞复现

    markdown xss漏洞复现 转载至橘子师傅:https://blog.orange.tw/2019/03/a-wormable-xss-on-hackmd.html 漏洞成因 最初是看到Hack ...

  7. 听说,霸都.NET技术社区准备搞线下聚会了?

    嗨,你听说了没有?霸都.NET技术社区准备搞线下聚会了! 啥时候的事情啊? 最近才知道的消息啊! 那你是从哪里知道的消息呢? .NET Core项目实战交流群(637326624)啊! 那这次合肥.N ...

  8. 初探Java设计模式4:JDK中的设计模式

    JDK中设计模式 本文主要是归纳了JDK中所包含的设计模式,包括作用和其设计类图.首先来个总结,具体的某个模式可以一个一个慢慢写,希望能对研究JDK和设计模式有所帮助.一.设计模式是什么(1)反复出现 ...

  9. Chapter 5 Blood Type——6

    "Yes — giving up trying to be good. I'm just going to do what I want now, and let the chips fal ...

  10. Asp.Net SignalR Hub类中的操作详解

    Hub类中的操作 在服务端我们要通过Hub类做一系列操作,下面就说说我们都可以做什么操作 客户端的发送消息操作 调用所有的客户端的helloClient方法 Clients.All.helloClie ...