TS入门学习——01.数据类型

TS数据类型介绍

JavaScript 拥有动态类型。这意味着相同的变量可用作不同的类型（如下）

var luckyboy;
console.log(luckyboy)  // luckyboy声明来未赋值 为undefined
var luckyboy = 250;
console.log(luckyboy)  // 现在 luckyboy赋值为数字类型
var luckyboy = "lucky";
console.log(luckyboy)   // 现在 luckyboy从数字类型转换为字符串类型

TypeScript 类型是静态的，相关类型的变量定义好后只能赋予该类型的值，如果赋以其它类型的值则会报错，如下

// var flag: boolean = 123 // 报错 123是数字类型，而不是布尔类型
var flag: boolean = true
console.log(flag) // true
// flag = 123 // 报错 不能改变类型
flag = false // 只能改成同种类型的值
console.log(flag) // false

ts变量声明必须加上一个类型注解，指定这个变量的类型

语法：var | let | const 变量名：类型 = 值

数字类型 number

ts数字类型可以用来表示双精度 64 位浮点值，它可以用来表示整数和分数，同时支持二进制、八进制、十进制、十六进制

let binaryLiteral: number = 0b11; // ob开头代表二进制
let octalLiteral: number = 0o57;    // 0o开头代表八进制
let decLiteral: number = 250;    // 十进制
let hexLiteral: number = 0xf00f;    // 0x开头代表十六进制
let dotNum: number = 3.14159;    // 0x开头代表十六进制
console.log(binaryLiteral); // 3
console.log(octalLiteral); // 47
console.log(decLiteral); // 250
console.log(hexLiteral); // 61455
console.log(dotNum); // 3.14159

字符串类型 string

ts和js一样使用单引号（'）或双引号（"）来表示字符串类型。反引号（`）来定义多行文本和内嵌表达式

var str1: string = 'luckyboy';
var str2: string = "luckygirl";
var str3: string = `${str1}----${str2}`;
console.log(str1); // luckyboy
console.log(str2); // luckygirl
console.log(str3); // luckyboy----luckygirl

布尔类型 boolean

ts布尔类型的值有两种：true 和 false ，代表正确和错误

var flag1: boolean = false;
flag1 = true;
console.log(flag1); // true
var str4: string = '我不帅吗？';
flag1 ? str4 = '帅' : str4 = '不帅';
console.log(str4); // 帅

数组类型

代表规定类型数据组成的集合，定义方法如下

1. 在元素类型后面加上 [] 定义数组

var arr1: number[] = [1, 2, 3, 4]
var arr2: string[] = ['a', 'b', 'c']
console.log(arr1, arr2) // [ 1, 2, 3, 4 ] [ 'a', 'b', 'c' ]

2. 使用数组泛型定义数组

var arr3: Array<number> = [ 13, 14, 520 ]
var arr4: Array<string> = ['wo', 'di', 'tian']
console.log(arr3, arr4) // [ 13, 14, 520 ] [ 'wo', 'di', 'tian' ]

元组类型

表示已知元素数量和类型的数组, 各元素的类型不必相同，但对应位置的类型需要相同的数据集合

var yuanArr: [number, string, number] = [110, 'help me!!', 120];
console.log(yuanArr); // [ 110, 'help me!!', 120 ]
// yuanArr = [ 'hello', 119, 250 ] // 报错 对应位置的类型错误
yuanArr = [80, 'lucky', 443];
console.log(yuanArr); // [ 80, 'lucky', 443 ]

枚举类型 enum

枚举类型用于定义数值集合，通过给变量设置该枚举对象中的键名获取值，默认是该键名在集合中的索引值，也可以自定义设置键的数值

enum Animal1 { ant, bear, cat, dog };
var animal1: Animal1 = Animal1.cat;
console.log(animal1); // 2
enum Animal2 { ant, bear, cat = 100, dog };
var animal2: Animal2 = Animal2.cat;
console.log(animal2); // 100

任意类型 any

声明为 any 的变量可以赋予任意类型的值，同时any类型的数组里面可以储存各种类型数据的数据，类似于原生js的动态类型（尽量不要使用any类型，不安全）

注意：声明变量如果不指定类型，那么默认就为any类型

// any类型
var aini: any = 123; // 数值类型
console.log(aini); // 123
aini = 'luckyboy'; // 字符串类型
console.log(aini); // luckyboy
aini = false; // 布尔类型
console.log(aini); // false// any类型的数组可以储存各种不同类型的数据
var ainiArr: any[] = [123, 'lucky', true, 666];
console.log(ainiArr); // [ 123, 'lucky', true, 666 ]

未知类型unknown

unknown实际上是一个类型安全的any，也时表示未知类型，但它不像any类型一样可以直接赋值给其它变量，也不能直接调用该类型值的属性和方法

var boy1: any;
boy1 = 250;
boy1 = 'lucky';
boy1 = false
console.log(boy1.length) // 不会报错，但是这样写是错误的,false 没有 length 属性
var boy2: string
boy2 = boy1 // 不会报错，但是这样写也是错误的,不能把boolean类型赋给string类型

使用unknown就不会出现这种问题，语法会提示报错

var boy3: unknown;
boy3 = 250;
boy3 = 'lucky';
boy3 = false
// console.log(boy3.length) // 语法报错，但是这样写是错误的,false 没有 length 属性
var boy4: string
// boy4 = boy3 // 语法报错，但是这样写也是错误的,不能把boolean类型赋给string类型

但是遇到非要用的情况该怎么办呢？这时候就要使用文章底部讲到的类型断言了，这里就不介绍了

void 类型

用于标识方法返回值的类型，表示该方法没有返回值

function fn(): void {console.log('luckyboy') // 没有返回值
}
function fn2(): number {return 11 // 返回数字类型
}
// 声明一个void类型的变量只能为它赋予undefined和null
var voyide: void = undefined;

null 类型

null类型指空值，空对象引用，表示对象值缺失

var null1: null = null
console.log(null1) // null

undefined 类型

表示变量声明了但未赋值

var udf1: undefined = undefined
var udf2: any
console.log(udf1, udf2) // undefined, undefined

never 类型

never 是其它类型（包括 null 和 undefined）的子类型，代表从不会出现的值。这意味着声明为 never 类型的变量只能被 never 类型所赋值，在函数中它通常表现为抛出异常或无法执行到终止点的代码段

// 定义两个变量
let lucky: never;
let lucy: number;
// lucky = 123; // 报错，number 类型不能给 never 类型赋值
lucky = (()=>{ throw new Error('我错了')})(); // never 类型可以赋值给 never 类型
lucy = (()=>{ throw new Error('我真的错了')})(); // never 类型可以赋值给 number 类型
// 返回值为 never 的函数可以是抛出异常的情况
function err(): never {throw new Error('我错了');
}
// 返回值为 never 的函数可以是无法被执行到的终止点的情况
function loop(): never {while (true) {}
}

拓展

‘|’ 实现多种类型

使用 | 符号可以实现给变量指定支持多种类型

var person1: number | string | boolean
person1 = 100
person1 = 'lucky'
person1 = true

类型断言

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

有时候，我们确实需要在还不确定类型的时候就访问其中一个类型的属性或方法，就会报错，这时候我们需要使用类型断言来告诉解析器变量的实际类型，使其编译通过

类型断言有两种方法

方法一：变量 as 类型

方法二：<类型>变量

var person1: unknown
person1 = 100
person1 = true
person1 = 'lucky'var person2: string
// person2 = person1 // 报错, unknown类型不允许直接赋值，不安全
// 通过普通判断实现赋值
if (typeof person1 === 'string') {person2 = person1
}
// 使用类型断言
// 方法1
person2 = person1 as string
// 方法2
person2 = <string>person1
console.log(person2)var perLen: number
// perLen = person1.length // 报错， unknown类型不允许直接使用值的方法
// 通过普通判断解决问题
if (typeof person1 === 'string') {perLen = person1.length
}
// 使用类型断言
// 方法1
perLen = (person1 as string).length
// 方法2
perLen = (<string>person1).length
console.log(perLen)

以上便是ts的基本类型介绍了

TS入门——01.数据类型相关推荐

Typescript系列(一)：TS入门教程之简介、安装、编译、监听
一个比java更script的语言,它是js的超集,它是Typescript. 一.typescript是什么? Typescript是javascript的一个超集,主要提供了类型系统和对ES6的支 ...
机器学习入门 01 —— 机器学习概述
文章目录系列文章机器学习概述 1.1.人工智能概述 1 人工智能应用场景 2 人工智能小案例 3 人工智能发展必备三要素 4 人工智能.机器学习和深度学习 5 小结 1.2.人工智能发展历程 1. ...
ts入门笔记——ts类型声明和类型断言
最近玩csdn比较少,欢迎关注我的掘金:杨灿就是杨火山简单快速上手ts的学习路径: 一.熟悉掌握熟悉的强类型定义,初步学习编写强类型代码. 学习ts的声明变量类型,能够初步编写强类型代码: 学习ts ...
python基础入门01
python 基础入门01 前言 python 是一种计算机程序设计语言, 由创始人吉多·范罗苏姆(Guido van Rossum) 在1989年阿姆斯特丹的圣诞节期间为了打发无聊的时间,决定开发一 ...
SQLite入门之数据类型
2019独角兽企业重金招聘Python工程师标准>>> SQLite入门之数据类型 2011-05-23 16:47:47 来源:SeaYee 最近在开发一个可以记录日志的程序,要 ...
【网络爬虫入门01】应用Requests和BeautifulSoup联手打造的第一条网络爬虫
[网络爬虫入门01]应用Requests和BeautifulSoup联手打造的第一条网络爬虫广东职业技术学院欧浩源 2017-10-14 1.引言在数据量爆发式增长的大数据时代,网络与用户的沟 ...
java编程菜鸟入门01
写在前面: 此博客仅用于记录个人学习进度,学识浅薄,若有错误观点欢迎评论区指出.欢迎各位前来交流.(部分材料来源网络,若有侵权,立即删除) 传送门: java编程菜鸟入门01 java对象和类 jav ...
Matlab入门-01命令行操作
Matlab入门-01命令行操作一.数据的输入二.数值.变量和表达式三.命令行的换行输入四.数据显示格式五.clc,clear,close all 一.数据的输入例如: 1.矩阵输入: 矩 ...
一篇浅显易懂的 TS 入门指南
大家好,我叫小杜杜,是一个喜欢动手敲代码的小菜鸟,我认为代码应该亲自敲一遍,才能更好的熟记于心,作为一个程序员,我们与自己的小伙伴共同开发.维护于一个项目,需要保持代码的整洁.清晰,使组内的任意一位小 ...
Openmv入门01——HAL库stm32
Openmv入门01 开启一个项目 Openmv程序 1.识别长度 2.识别面积 STM32 1.识别长度 2.识别面积开启一个项目看看例程~很快上手https://docs.singtown.c ...

TS入门——01.数据类型