javascript中有7种数据类型,分别是:boolean,number,string,null,undefined和object,以及在es6中新增的一种类型 symbol。而typescript又在此基础上增加了一些类型,接下来一个个来看。

元组

元组类型允许表示一个已知元素数量和类型的数组,各元素的类型不必相同,例如:

let a: [string, number]

a = ['hello', 1] 

a=[1,'hello'] //Error Type 'number' is not assignable to type 'string'...

a=['hello'] //Error Property '1' is missing in type '[string]' but required in type '[string, number]'.

a=['hello',1,1] //Error Type '[string, number, number]' is not assignable to type '[string, number]'.

上面定义了一个长度为2的元组,且每个元素的类型是固定的,当赋值时,各个位置上的元素类型都要对应,元素个数也要一致,不然会报编译错误。

关于赋值时超出所定义的长度的问题,这在2.6版本之前是被允许的,即上面 a=['hello,1,1] 这样在2.6版本之前是可行的,此时 [string, number,number]会被当作 [string,number]的子类型处理,如果想在2.6之后的版本也达到这样的效果,可以定义接口:

interface StrNumTuple extends Array<string | number> {
0: string;
1: number;
length: 2; // using the numeric literal type '2'
}

参考:https://www.tslang.cn/docs/release-notes/typescript-2.7.html

我们也可以对元组上的单个元素赋值:

let a: [string, number]

a = ['hello', 1]

a[1] = 3

因为位置 1 上的类型是数字,所以可以重赋值为3

当我们访问元组中元素时,会对我们在元素上做的操作进行检查:

let a: [string, number]

a = ['hello', 1]

a[0].split('')
a[1].split('') //Error Property 'split' does not exist on type 'number'.

1位置上是数字类型,所以不可以使用split方法。

枚举

enum类型是对JavaScript标准数据类型的一个补充。像C#等其它语言一样,使用枚举类型可以为一组数值赋予友好的名字。例如我们要定义一组角色,每个角色用一个数字代表,就可以用枚举类型来定义:

enum Roles {
ADMIN,
EDITOR,
USER
}
let role: Roles = Roles.USER
console.log(role) //

枚举里的每个值都有编号,默认从0开始,依次排列,所以上面例子里打印了2。你也可以修改编号,比如你希望编号从3开始,就可以定义为:

enum Roles {
ADMIN = 3,
EDITOR,
USER
}
let role: Roles = Roles.USER
console.log(role) //

当然你也可以为每个值都赋予不同的,不按顺序排列的值:

enum Roles {
ADMIN = 3,
EDITOR = 7,
USER = 1
}
let role: Roles = Roles.USER
console.log(role) //

我们除了可以通过名字得到值,也可以通过值得到名字:

enum Roles {
ADMIN = 3,
EDITOR = 7,
USER = 1
}
// 注意这里指定为string类型,名字是string类型
let role: string = Roles[3]
console.log(role) // ADMIN

Any

顾名思义,使用这个类型定义后,变量可以是任意值,这跟直接使用原生javascript开发是一样的。当我们不清楚某一变量会是什么类型时,可以使用any类型来通过编译

let a: any = 'hello'

a = 1
a = false
a = [1, 2]

如上代码,使用any定义类型后,可以任意类型赋值。

有时候用在数组定义上可能是很有用的

let arr: any[] = [1, 'hello', false]

arr[0] = 'hi'

可以看到使用any类型时会让编码变得很灵活,但是这就失去了使用typescript的意义,毕竟我们就是要摆脱这种灵活才选择用typescript的。所以尽量能不用any就不用any吧。

Void

某种程度上来说,void类型像是与any类型相反,它表示没有任何类型。 当一个函数没有返回值时,你通常会见到其返回值类型是 void

function fn(): void {
console.log('hello world')
}

声明一个void类型的变量没有什么大用,因为你只能为它赋予 undefined 和 null(这里是中文官网文档说的)

let a: void = undefined

let b: void = null // Type 'null' is not assignable to type 'void'.

确实可以赋值为 undefined,但是赋值为 null 时报错了,我以为是文档写错了,但去看了英文文档后发现是这样的:

要想赋值为 null 时不报错,在tsconfig.json文件里找到  strictNullChecks 选项,去掉注释,值改为false,保存后重编译就没问题了。

Never

never表示的是哪些用不存在的值的类型。它可以是那些总会抛出异常或者根本不会有返回值的函数表达式的返回值类型,也可以是变量的类型,此时变量被永不为真的类型保护所约束。

function error():never{
throw new Error('异常')
}

上面函数总是抛出异常,所以它的返回值类型是never,表示永远不会有返回值

function func():never{
while(true){}
}

这段代码里的函数也是永远没有返回值,返回值类型也是never。它与void类型不一样,函数若是不想返回值需要指定void类型,未指定的都必须有返回值。

typescript中新增的基本数据类型的更多相关文章

  1. 关于typescript之定义变量和数据类型那点事

    变量和数据类型 JavaScript虽说深受万千程序员喜爱,却有着对于企业大规模开发很难管理的缺陷.这时候,TypeScript的优势便体现出来.接下来,我们会先接触在TypeScript中定义变量相 ...

  2. typeScript中的数据类型

    /* typeScript中的数据类型 typescript中为了使编写的代码更规范,更有利于维护,增加了类型校验,在typescript中主要给我们提供了以下数据类型 布尔类型(boolean) 数 ...

  3. javascript中的真假值、数据类型判断以及+的特殊用法

    一.javascript中的假值 jQuery中拥有一组数量奇大的假值,包括 0,NaN(非数),''(空字符串),false,null,undefined 这些值在if判断中全部等于假,但这些值彼此 ...

  4. TypeScript 中的方法重载

    方法重载(overload)在传统的静态类型语言中是很常见的.JavaScript 作为动态语言, 是没有重载这一说的.一是它的参数没有类型的区分,二是对参数个数也没有检查.虽然语言层面无法自动进行重 ...

  5. Typescript 学习笔记二:数据类型

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

  6. javascript中五种基本数据类型

    前言: JavaScript中有五种基本数据类型(也叫做简单数据类型)分别为:undefined.null.bolean.number.string:另外还含有一种复杂的数据类型:object. 深入 ...

  7. TypeScript入门二:基本数据类型

    浅析基本数据类型 TypeScript类型解析 一.浅析基本数据类型 首先有一个问题TypeScript是一门编译型语言?还是解释性语言?显然已经不能被这两个分类来区分,TypeScript的并不是为 ...

  8. JavaScript 、TypeScript 中的 Boolean

    boolean 是 JavaScript 中一种有趣的原始数据类型.在TypeScript中,非严格模式下("strictNullChecks": false),它总共允许4个值 ...

  9. typescript 中的 infer 关键字的理解

    infer 这个关键字,整理记录一下,避免后面忘记了.有点难以理解呢. infer infer 是在 typescript 2.8中新增的关键字. infer 可以在 extends 条件类型的字句中 ...

随机推荐

  1. 11.EL(表达式语言)

    一.EL概述 EL(Expression Language,表达式语言)是JSP2.0 中引入的新内容.通过EL可以简化在JSP中对对象的引用,从而规范页面代码,增加程序的可读性和可维护性. 1.EL ...

  2. POI2012 BEZ-Minimalist Security | noi.ac #537 Graph

    题目链接:戳我 首先注意这张图有可能不连通!! 然后我们考虑对于每一个联通块,首先任意确定一个点,给它设最终值为x,然后进行搜索.(因为对于一个联通块而言,我们知道一个点的最终值,那么整个联通块上面点 ...

  3. 7.9模拟赛T1图的遍历(dfs)

    图的遍历(dfs) [题目描述] 对于一个有向图G来说,我们存在一个经典的遍历算法,就是DFS (深度优先搜索遍历).将G以1号点为起点进行DFS后,我们可以 得到G的一棵DFS遍历树T.就此,我们可 ...

  4. font属性

    font属性 font属性设置css字体

  5. 前端 Jenkins 自动化部署

    这两天折腾了一下 Jenkins 持续集成,由于公司使用自己搭建的 svn 服务器来进行代码管理,因此这里 Jenkins 是针对 svn 服务器来进行的配置,Git 配置基本一致,后面也介绍了下针对 ...

  6. Nginx 配置443 HTTPS

    server { listen 443 ssl; server_name localhost; ssl on; ssl_certificate D://newlingshou//nginx-1.12. ...

  7. OSI的七层模型和TCP/IP的五层模型

    OSI七层模型: 应用层->表示层->会话层->传输层->网络层->数据链路层->物理层 TCP/IP五层模型: 应用层->传输层->网络层->数 ...

  8. LC 789. Escape The Ghosts

    You are playing a simplified Pacman game. You start at the point (0, 0), and your destination is(tar ...

  9. props的写法

    简写 props: ['demo-first', 'demo-second'] 带类型 props: { 'demo-first': Number, 'demo-second': Number } 带 ...

  10. 阶段3 3.SpringMVC·_07.SSM整合案例_02.ssm整合之搭建环境

    创建数据库ssm并创建表account create database ssm; use ssm; create table account( id int primary key auto_incr ...