前言

这是开始学习Typescript的一些笔记,涉及的都是很基础的知识点。大神们请绕路或者欢迎指点。今天开始第一部分数据类型的学习。

数据类型

Typescript中为了使代码编写更加规范,更加易于维护。增加了类型校验

所谓类型校验:就是定义的变量始终只能是定义时指定的数据类型。也就是说定义变量的时候必须指定类型。当然typescript也支持原生js的写法。

比如:我们将a定义成number类型,如果我们在后面使用a时,将其修改成了string类型。那么会出现报错。

let a:number = 12;
a = 'hello' // 报错 Type '"hello"' is not assignable to type 'number'

Typescript中常见的数据类型如下:

布尔类型(boolean)

let flag:boolean = false;
console.log(flag)
flag = true; flag = false;

在typescript中boolean类型的值只有两个true和false。不同于js中,非0的数值,非空的字符串等都可以表示true。在typscript中将boolean类型的值赋值成1,0等会报错。

let flag:boolean = true;
flag = 1; // 报错:在js中1能够代表true。但是在ts中1表示number类型。因此会出现错误。

数字类型(number)

let num:number = 12;
num = 12.4444;
console.log(num)

字符串类型(string)

let str:string = 'helloworld';
console.log(str)

数组类型(Array)

typescript中定义数组有两种方式:

第一种定义数组的方式:在元素类型后面接上[],表示由此类型元素组成的一个数组

let arr1:number[] = [1,2,3];
console.log(arr1)
let arr2:string[] = ['hello','world'];
console.log(arr2)

第二种定义数组的方式:使用数组泛型,Array<元素类型>:

let arr3:Array<number> = [11,22,33];

元组类型(tuple)

元组类型是数组类型的一种特例。数组类型只允许元素是一种数据类型。而元组类型允许元素是多种数据类型。比如,你可以定义一对值分别为 string和number类型的元组。

let tuple1:[string,number] = ['hello',12]
console.log(tuple1[0])

但是,元组类型和元素必须一一对应。

let tuple2:[string,number] = [20,'world']  // 没有一一对应

枚举类型(enum)

在计算机科学中,我们经常使用数值来表示一种状态。但是对于较多的状态使用数值来表示可能导致易读性差。比如十二生肖如果我们用0,1,2,3,4...11来表示,那么可能根本不知道究竟每一个代表什么。但是如果我们用有含义的单词来表示,那么程序就比较容易理解与阅读。比如看到猪我就知道这个生肖是猪。枚举就是考虑到所有的可能出现的值,然后用具有函数的单词来表示它。

枚举又可以成为一一列举,在计算机计算中,将一个有穷序列集所有可能的值列举出来就称为枚举。比如:星期可以使用Sunday、Monday、Tuesday、Wednesday、Thursday、Friday、Saturday来进行枚举。生肖可以使用龙、蛇、狗等十二种来进行枚举。

enum 枚举名{
标识符=[整型常数],
标识符=[整型常数],
标识符=[整型常数],
}

枚举类型的使用:枚举类型如果没有指定值,那么默认是从0开始。

enum data {
success,
error
}
console.log(data.success) // 0
console.log(data.error) // 1

如果指定了值,那么从指定的值往下递增。

enum data {
pedding,
success = 100,
error
}
console.log(data.pedding) // 0
console.log(data.success) // 100
console.log(data.error) //101

任意类型(any)

在typescript中定义变量时通常需要指定类型,但是有时候我们可能不知道这个变量会是什么类型(比如这个变量是用来接收后段发送过来的数据,这个数据类型可能不太确定。)。这时候我们就可以指定any类型。表示可以是任意类型。

let anyVar:any;
anyVar = 123;
console.log(anyVar)
anyVar = [1,2,3];
console.log(anyVar)

另外,当我们只知道一部分数据的类型时,any类型也是有用的。 比如,你有一个数组,它包含了不同的类型的数据:我们可以指定数组中元素类型为any。这样的话我们就可以随意地修改数组中的元素了。

let list:any[] = [1,'hello',false];
list[1] = true; // 将数组第二个元素从string类型修改为boolean
console.log(list[1])

Null 和 Undefined

null和undefined是其他数据类型的子类型。

我们知道在js中定义了变量但是赋值,那么得到的就是undefined。比如:

let u ;
console.log(u) // undefined

但是在ts中,如果我们定义了一个变量,没有进行赋值。如果我们使用它会出现报错。比如:

let u:number;
console.log(u) // Variable 'u' is used before being assigned

但是很多情况下,我们定义了一个变量没有进行赋值,在后续我们需要根据这个变量是否有值来进行判断。但是这种情况下就会报错。因此:我们希望能够

在没有获取值的情况下不会报错,这时候就可以使用undefined了。

let u2:number|undefined;
console.log(u2)
u2 = 123;
console.log(u2)

同理Null类型也是为了处理值为null时的情况。

void类型

void类型表示没有任何类型,一般用于定义方法的时候,方法没有返回值。

function warnUser(): void {
console.log("This is my warning message");
}

never类型

never类型是那些总是会抛出异常或根本就不会有返回值的函数表达式或箭头函数表达式的返回值类型。

let a:never;
a = (() => {throw new Error('抛出异常')})()

如果变量有确定的类型,那么使用never类型就会报错。比如:

定义变量n为never类型。但是将n赋值为number类型了,那么就会报错。

let n1:never;
n1 = 123;

Object类型

object类型表示非原始类型,也就是除number,string,boolean,symbol,null或undefined之外的类型。

declare function create(o: object | null): void;

object类型的值与js中相同。数组,函数,null等都可以是Object类型。

create({ prop: 0 }); // OK
create(null); // OK
create([1,2,3]); // OK
create(function(){}) // OK
create(42); // 报错
create("string"); // 报错
create(false); // 报错

说明

以前学习一些新的知识的时候,学过了如果没有频繁地使用,过一段时间就很容易忘记。因此希望使用博客园和github记录学习过程中的一些笔记,这样的话,下次再捡起来就比较快了。而且每一次地记录其实都是对知识点的一次总结,这样可以加深对知识点的理解和记忆,当然学习过程中,尤其是初学者肯定存在不正确的地方,欢迎大家指正。github中保存了学习过程中的代码,欢迎star和issue。

github

Typescript基础(1)——数据类型的更多相关文章

  1. TypeScript基础数据类型

    Typescript与Javascript 二者的区别 作为前端开发的基础语言javascript已经深入人心,人人皆知.作为变成入门的最简单语言,Javascript语言以动态.弱类型语言而著名,学 ...

  2. TypeScript之基本数据类型

    前言 最近项目很急,所以没有什么时间回答关于Xamarin.Android方面的问题,也有一段时间没有更新.主要是手头很缺人,如果有谁有兴趣加入我们的话,可以私聊我,这样我就能继续造福社区了,同时还有 ...

  3. TypeScript基础以及在Vue中的应用

    TypeScript推出已经很长时间了,在Angular项目中开发比较普遍,随着Vue 3.0的即将推出,TypeScript在Vue项目中使用也即将成为很大的趋势,笔者也是最近才开始研究如何在Vue ...

  4. C#基础--之数据类型

    C#基础--之数据类型 摘自:http://www.cnblogs.com/tonney/archive/2011/03/18/1987577.html 在第一章我们了解了C#的输入.输出语句后,我这 ...

  5. page74-泛型可迭代的基础集合数据类型的API-Bag+Queue+Stack

    [泛型可迭代的基础集合数据类型的API] 背包:就是一种不支持从中删除元素的集合数据类型——它的目的就是帮助用例收集元素并迭代遍历所有收集到的元素.(用例也可以检查背包是否为空, 或者获取背包中元素的 ...

  6. JavaScript基础:数据类型的中的那些少见多怪

    原文:JavaScript基础:数据类型的中的那些少见多怪 Javascript共有6种数据类型,其中包括3个基本数据类型(string,number,boolean).2个特殊数据类型(undefi ...

  7. Python基础之数据类型

    Python基础之数据类型 变量赋值 Python中的变量不需要声明,变量的赋值操作既是变量声明和定义的过程. 每个变量在内存中创建,都包括变量的标识,名称和数据这些信息. 每个变量在使用前都必须赋值 ...

  8. java基础(数据类型,运算符)

    java基础之数据类型(变量) java中存在的数据有常量和变量 常量:在程序执行的过程中其值不可以发生改变 常量的分类 字面值常量 字面值常量的分类 常量 描述 字符串常量 用双引号括起来的内容 整 ...

  9. js基础--javaScript数据类型你都弄明白了吗?绝对干货

    欢迎访问我的个人博客:http://www.xiaolongwu.cn 数据类型的分类 JavaScript的数据类型分为两大类,基本数据类型和复杂数据类型. 基本数据类型:Null.Undefine ...

随机推荐

  1. attempted to return null from a method with a primitive return type (int).

    java接口文件 package com.cyb.ms.mapper; import org.apache.ibatis.annotations.Param; public interface Acc ...

  2. vue-cli 项目启动过程分析

    启动时没有加入路由 先npm run dev 把项目启动起来.看到 这个熟悉的界面. 首先看到: 这是项目的入口文件,一般引用其他的js,也都是在这个文件进行引用的. 渲染的时候,就是对这个id=&q ...

  3. 简单快速上手Jackson使用

    1简介 Jackson具有比较高的序列化和反序列化效率,据测试,无论是哪种形式的转换,Jackson > Gson > Json-lib,而且Jackson的处理能力甚至高出Json-li ...

  4. mysql登陆时出现ERROR 2013 (HY000): Lost connection to MySQL server at 'reading initial communication packet', system error: 0

    有4到5天没开mysql,这天晚上打=打开phpstudy,想进去mysql练习练习,结果丢给我这个 ERROR 2013 (HY000): Lost connection to MySQL serv ...

  5. Last 2 dimensions of the array must be square

    这个报错是因为我们在求解行列式的值的时候使用了: np.linalg.det(D) 但是D必须是方阵才可以进行运算,不是方阵则会报错,我们把之前的行列式更改为方阵就不会再报错了,当然这也是numpy自 ...

  6. Java中的“scanf()、cin()、input()"

    最近在写一个Java程序时遇到一个问题,就是如何在Java里面输入数值,又叫做获取键盘输入值. 因为c语言里面有scanf(),C++里面有cin(),python里面有input().Java里面有 ...

  7. Flutter中通过https post Json接收Json

    Flutter 已然成为炙手可热前端框架.若问跨平台到底有多香,自然是要多香有多香.今天我就分享这些天研究Flutter http连接和json格式转换的内容,小弟对Flutter也是小白一名,如有错 ...

  8. Linux部署NFS服务共享文件

    NFS(网络文件系统)用于linux共享文件 第1步:配置所需要的环境 使用两台Linux主机 主机名称 操作系统 IP地址 NFS Centos7 192.168.218.139 NFSa Cent ...

  9. Codeforces Round #593 (Div. 2)

    传送门 A. Stones 签到. B. Alice and the List of Presents 单独考虑每个数的贡献即可. 答案为\((2^{m}-1)^n\). C. Labs 构造就类似于 ...

  10. MSYQL主从复制-Gtid方式

    目录 1.MYSQL主从复制-Gtid方式 1.环境准备 2.Master配置 3.Slave配置 4.报错&解决 我叫张贺,贪财好色.一名合格的LINUX运维工程师,专注于LINUX的学习和 ...