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. python IO密集型为什么使用多线程

    IO密集型为什么使用多线程 python多线程,可以粗浅理解只用了cpu的一个核心. 为什么IO密集型用多线程?假设我们有多个线程都在发网络请求(request, 等response),一个请求的从发 ...

  2. bk复面-一场被问蒙蔽了的面试

    1.自我介绍         ---自我介绍从个人生活上.兴趣爱好上去介绍,比如我自己,平时喜欢听听音乐.看看鸡汤类的书,比如爱下厨,喜欢根据一些网上的教程去尝试做一份自己满意的晚餐,简历上已经写得工 ...

  3. MySQL_(Java)分页查询MySQL中的数据

    MySQL_(Java)使用JDBC向数据库发起查询请求 传送门 MySQL_(Java)使用JDBC创建用户名和密码校验查询方法 传送门 MySQL_(Java)使用preparestatement ...

  4. c# 调用CMD命令并获取输出结果

    private static string CMDPath = Environment.GetFolderPath(Environment.SpecialFolder.System) + " ...

  5. ubuntu16.04 anaconda3安装

    1.使用清华镜像源下载 wget https://mirrors.tuna.tsinghua.edu.cn/anaconda/archive/Anaconda3-5.1.0-Linux-x86_64. ...

  6. linux系统创建windows启动盘

    平时工作中用到linux的操作命令较多,因此为了方便,就给电脑装了双系统,一般工作的时候,都选择进入linux系统.但是今天有件工作之外的事情需要解决下:创建一个windows启动盘.如果按照往常来说 ...

  7. koa 基础(四)get 传值 以及获取 get 传值

    1.get 传值 以及获取 get 传值 app.js /** * get 传值 以及获取 get 传值 */ // 引入模块 const Koa = require('koa'); const ro ...

  8. Mybatis多值传递的方式

    一共有三种方式 1.参数传入Map 2参数使用@params 3.直接使用时用#{0},#{2} 参考网址 :https://www.2cto.com/database/201409/338155.h ...

  9. 【React自制全家桶】五、React组件的生命周期函数详解

    一.总览React组件的生命周期函数 什么是生命周期函数:简单的来说就是 在某个时刻会自动执行的函数 二.React的生命周期函数主要由四块组成 分别是:组件初始化.组件挂载.组件更新.组件卸载 三. ...

  10. 关于Win7 64位下:Navicat无法连接64位Oracle 11gR2:Cannot load OCI DLL解决方法

    错误描述 在Win7下安装了Oracle 11g R2,在用Navicat去连接Oracle时,提示以下错误: Cannot load OCI DLL, 126: Instant Client pac ...