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. Ubuntu VIM下实现python自动缩进

    1.打开vimrc文件 sudo vi /usr/share/vim/vimrc 2.添加 set filetype=python au BufNewFile,BufRead *.py,*.pyw s ...

  2. http://www.layui.com/doc/modules/laydate.html实时通信\日期、==插件

    8520**ali chengyouli http://www.layui.com/doc/modules/laydate.html实时通信\日期.==插件

  3. MySQL 5.7 忘记密码

    MySQL 5.7 忘记Root密码 用管理员身份运行cmd.然后使用命令进行: 1.打开MySQL>bin文件夹 >cd C:\mysql\mysql5.7.14\bin 2.停止mys ...

  4. 动态规划----最长递增子序列问题(LIS)

    题目: 输出最长递增子序列的长度,如输入 4 2 3 1 5 6,输出 4 (因为 2 3 5 6组成了最长递增子序列). 暴力破解法:这种方法很简单,两层for循环搞定,时间复杂度是O(N2). 动 ...

  5. HTTP协议概念与特点,HTTP的状态码,HTTPS是什么?

    很多人在打开网页的时候,在浏览器地址栏里都会看到http  ,在Java WEB里,HTTP也是个重点内容,今天我们就来详细了解和学习HTTP . HTTP是Hyper Text Transfer P ...

  6. [Swift]LeetCode995. K 连续位的最小翻转次数 | Minimum Number of K Consecutive Bit Flips

    In an array A containing only 0s and 1s, a K-bit flip consists of choosing a (contiguous) subarray o ...

  7. Hystrix概念设计

    1. Hystrix概念设计 1.1. 大纲 1.2. 基本的容错模式 1.3. 断路器模式 1.4. 舱壁隔离模式 1.5. 容错理念 凡事依赖都可能失败 凡事资源都有限制 网络并不可靠 延迟是应用 ...

  8. vue-textarea 自适应高度

    需求简介 一个搜索页面,上面输入框,下面列表展示搜索到的结果. 重点是:产品要求搜索框默认显示一行,当输入的文字超过一行时,输入框的高度会随着改变,直到输入完毕. 解决思路设想 本想利用textare ...

  9. Python Matplotlib.pyplot plt 中文显示

    话不多说,上代码 # -*- coding: UTF-8 -*- import matplotlib.pyplot as plt from matplotlib.font_manager import ...

  10. 【Maven】---Nexus私服配置Setting和Pom

    maven---nexus私服配置setting和pom 上一遍博客已经在linux服务器上,搭建好nexus私服了,博客地址:Linux搭建Nexus3.X私服 现在就需要配置setting.xml ...