TS中的数据类型

一、number类型

let c: number;
c = 10;
c = "hello";  // 不能复制string类型

二、string类型

let d: string;
d = "hello";
d = 10;  // 不能复制number类型

三、boolean类型

let e: boolean = true;
e = false;
e = 10; // 不能赋值true和false以外的值

 四、字面量类型

字面量类型的主要作用是限制字面量类型的值

let f: 10;
f = 10;
f = 11;  // 报错:不能赋值10以外的值
f = "10"; // 报错:不能赋值10以外的值

上面这种方法你可以认为将变量f定义为了一个常量,其值只能为10。

更多的时候我们会搭配 | 或运算来使用:

let g: "apple" | "banana";
g = "apple";
g = "banana";
g = "wotermelon";  // 报错:不能赋值"apple"和"banana"以外的值

字面量除了值,还可以使用数据类型搭配 | 或运算使用:

let h: boolean | string;
h = true;
h = "hello";
h = 10;  // 报错:不能赋值boolean和string以外数据类型的值

五、any类型

any表示任意的数据类型,一个变量设置了any的数据类型,相当于对该变量关闭了变量数据类型检测。

let i: any;
i = 10;
i = "hello";
i = true;

但是我们不建议使用any数据类型。

如果我们声明变量时不指定其数据类型,TS解析器就会自动判断其为any数据类型;

 注意:any数据类型的变量可以赋值给其他数据类型的变量,这会导致变量污染

let s: string;
s = i;

 六、unknown类型

 unknown表示未知数据类型的值,也可以是任意数据类型

let j: unknown;
j = 10;
j = "hello";
j = true;

但是unknown数据类型和any数据类型最大的区别是unknown数据类型的值不能直接赋值给其他数据类型的变量:

let s: string;
s = j;  // 报错:不能将类型“unknown”分配给类型“string”

但是我们能通过一下两种方式完成unknown数据类型的对其他数据类型的变量的赋值:

(一)判断unknown数据类型变量的当前数据类型 

let s: string;
if (typeof j === "string") {s = j;
}

(二)类型断言

相当于是告诉TS编译器这个变量的实际数据类型

类型断言有两种写法:

变量 as 数据类型

s = j as string;

<数据类型> 变量

s = <string>j;

 七、void类型

void表示空值,多用于函数的返回值类型中,当我们没有设置返回值时,TS编译器会自动判断其返回值为void。

当然TS也能够自动判断其返回值的类型

 

当我们设置了函数的返回值类型为void后,能够返回空和undefined,返回其他数据类型会报错

function fn() : void{return;
}
function fn() : void{return undefined;
}
function fn() : void{return "";  // 报错:不能将类型“string”分配给类型“void”
}

 八、never类型

never在函数返回值类型中表示永远不会有返回结果

我们知道,在JavaScript中函数不设置返回值但是会默认返回undefined,所以即使在返回值为never数据类型的函数中什么都不写也会进行报错。

因此返回值为never用于永远都不会有返回值的场景,也就是报错。

function fn1(): never{throw new Error("报错了!");
}

 九、object类型

object是对象类型,但是JS中万物皆对象,因此我们定义一个变量为对象数据类型的意义并不大。

let k: object;
k = {};  // k为一个空对象
k = function fn() { };  // k为一个函数对象

我们在TS中对对象的使用更偏向于以下用法

{ 属性名 :属性值 , 属性名 : 属性值 }

let l: { name: string };
l = { name: "孙悟空" };

(一)任意类型的属性

当赋值的对象中的属性与声明对象的属性匹配时就会报错 

 

可以选择加上就行

let l: { name: string; age: number };
l = { name: "孙悟空", age: 18 };

也可以使用任意类型的属性:

{ [ propName : string ] : any } 

let l: { name: string; [propName: string]: any };
l = { name: "孙悟空", age: 18, gender: "男" };

(二)可选属性 

当赋值的属性少了时也会进行报错

let l: { name: string, age: number };
l = { name: "孙悟空"};  // 报错:类型 "{ name: string; }" 中缺少属性 "age"

在age属性名后加上一个?表示该属性为可选项

{ 属性名? : 属性值 } 

let l: { name: string, age?: number };
l = { name: "孙悟空"};

(三)函数结构的对象声明

( 形参1 : 数据类型 , 形参2 : 数据类型 ... )=>返回值数据类型

let m: (a: number, b: number) => number;
m = function (n1, n2) {return n1 + n2;
};

注意:这里的形参个数和数据类型,以及函数的返回值类型都需要和声明时一致,默认为声明时的配置。

十、array类型

(一)第一种数组声明方式

数据类型[]

let n : string[];
n = ["a", "b", "c"];

 (二)第二种数组声明方式

Array<数据类型>

let n : Array<string>;
n = ["a", "b", "c"];

 同样的,在指定数据类型的数组中加入其他数据类型的元素也会报错。

十一、tuple类型

tuple是元组数据类型,也就是长度固定的数组

[数据类型 , 数据类型 , 数据类型...]

let o: [string, string];
o = ["abc", "hello"];

其赋值的数组长度和类型都必须一一对应

let o: [string, string];
o = ["abc"];  // 报错:不能将类型“[string]”分配给类型“[string, string]”。

十二、enum类型

enum是枚举类型,适用于有限选择的情况

let p: { name: string, gender: string };
p = { name: "孙悟空", gender: "男" };
console.log(p.gender === "男");

我们在上面的代码中的gender使用“男”来表示,但是性别只有“男”和“女”这两种,用0和1来表示能够更方便,这时候就可以使用enum数据类型。

enum 变量名 { 属性名 = 0, 属性名 = 1, ...}

enum Gender{Male = 0,Female = 1
}
let p: { name: string, gender: Gender };
p = { name: "孙悟空", gender: Gender.Male };
console.log(p.gender === Gender.Male);

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/82958.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

嵌入式裸机轻量级架构探索总结

为什么会想着探索下嵌入式裸机的架构呢&#xff1f;是因为最近写了一个项目&#xff0c;项目开发接近尾声时&#xff0c;发现了一些问题&#xff1a; 1、项目中&#xff0c;驱动层和应用层掺杂在一起&#xff0c;虽然大部分是应用层调用驱动层&#xff0c;但是也存在驱动层调用…

笔试面试相关记录(4)

&#xff08;1&#xff09;实现防火墙的主流技术有哪些&#xff1f; 实施防火墙主要采用哪些技术 - 服务器 - 亿速云 (yisu.com) &#xff08;2&#xff09; char arr[][2] {a, b, c, d}; printf("%d", *(arr1)); 输出的是谁的地址&#xff1f;字符c 测试代码如下…

ThreeJS-3D教学一基础场景创建

Three.js 是一个开源的 JS 3D 图形库&#xff0c;用于创建和展示高性能、交互式的 3D 图形场景。它建立在 WebGL 技术之上&#xff0c;并提供了丰富的功能和工具&#xff0c;使开发者可以轻松地构建令人惊叹的 3D 可视化效果。 Three.js 提供了一套完整的工具和 API&#xff0…

JUC中创建的组件 多线程使用“哈希表”

JUC中创建的组件 JUC中创建的组件这些内容都不太常用&#xff0c;偶尔用到面试的时候&#xff0c;偶尔用到&#xff01;到时候自行查找即可&#xff0c;本文主要来快速的过一下&#xff0c;留个印象即可~ JUC&#xff08;java.util.concurrent&#xff09;和多线程相关的工具…

python从入门到精通(一)

自己也有三四年的码龄了&#xff0c;目前&#xff0c;重拾起自己的博客&#xff0c;记录自己的学习笔记&#xff0c;为大家提供优质内容&#xff0c;也来巩固自己的学习内容。 很开心也成功成为了一名研究生&#xff0c;张张的研究方向是图像处理和计算机视觉这一块&#xff0c…

C++QT 作业8

#include "mywind.h" #include "ui_mywind.h" #include <iostream> #include <QIcon> #include <QLabel> #include <QLineEdit> #include <QDebug>//信息调试类 用于输出数据 Mywind::Mywind(QWidget *parent): QWidget(pa…

python3.11版本pip install ddddocr调用时报错got an unexpected keyword argument ‘det‘ 解决

一、如图出现如下问题 ddddocr.__init__() got an unexpected keyword argument det出现问题原因&#xff1a;python3.11默认安装版本就旧版的ddddocr1.0的&#xff0c;所以导致如下报错 二、解决方案一&#xff08;推荐&#xff09; python3.11的环境直接安装这个即可&…

物 理 层

二、物理层 1、物理层的基本概念 物理层的作用:尽可能的屏蔽掉传输媒体和通信手段的差异&#xff0c;使物理层上面的数据链路层感觉不到这些差异&#xff0c;使其只需要考虑如何完成本层的协议和服务 1.1、物理层的主要任务 机械特性&#xff1a;指明接口所用的接线器的形状…

关闭禁用chrome浏览器的阅读清单/强力书签

文章目录 前言操作 前言 阅读清单对我没啥用&#xff0c;还占用我位置&#xff0c;不小心点击到啥的&#xff0c;必须弃用 操作 chrome地址栏输入 chrome://flags/ 搜索book &#xff0c;关掉下面几个功能

Java 华为真题-猴子爬山

需求&#xff1a; 一天一只顽猴想去从山脚爬到山顶&#xff0c;途中经过一个有个N个台阶的阶梯&#xff0c;但是这猴子有一个习惯&#xff1a;每一次只能跳1步或跳3步&#xff0c;试问猴子通过这个阶梯有多少种不同的跳跃方式&#xff1f; 输入描述 输入只有一个整数N&#xff…

MySQL版数据库原理与应用期末复习重点(3)---画E-R图

文章目录 一、题目一1.1 题目描述1.2 解答 二、题目二2.1 题目描述2.2 解答 一、题目一 1.1 题目描述 设开发一个校园公共自行车管理系统&#xff0c;系统需要达到如下要求&#xff1a; &#xff08;1&#xff09;用户能够注册登录&#xff0c;能够根据借车点的名称查询借车…

若依注册的时候给个默认部门出现获取用户信息异常

想在注册的时候在数据库中查询一个部门给它一个默认部门&#xff0c;结果出现异常——【[handleServiceException,59] - 获取用户信息异常】 经分析代码&#xff0c;此方法有如下注解 以上注解会在mapper.xml中做如下操作 在做此操作之前会进入一个拦截器&#xff0c;根据token…

PHP-composer安装扩展安装,批量操作合并pdf

清除Composer缓存&#xff1a; 运行以下命令来清除Composer的缓存&#xff0c;并再次尝试安装包。 bash composer clear-cache 使用不同的镜像源&#xff1a; Composer使用的默认包源可能会受到限制或访问问题。你可以切换到使用其他镜像源&#xff0c;如阿里云、Composer中国…

安理【2022】

关键字&#xff1a; 出栈序列s2固定、快速排序2趟、next数组、二分查找比较次数log2n向上取整、 一、选择 二、填空 三、应用

Zookeeper 启动失败【Cannot open channel to 3 at election address...】

文章目录 完整报错信息解决方法1.检查文件夹权限2.未监听所有IP3.IP映射名称与 ID 不对应 完整报错信息 Cannot open channel to 3 at election address hadoop121/192.168.10.121:3888 java.net.ConnectException 解决方法 1.检查文件夹权限 检查当前用户是否拥有 Zookeep…

《Kubernetes部署篇:Ubuntu20.04基于containerd部署kubernetes1.25.14集群(多主多从)》

一、架构图 如下图所示: 二、环境信息 1、资源下载基于containerd部署容器版kubernetes1.25.14集群资源合集 2、部署规划主机名K8S版本系统版本内核版本IP地址备注k8s-master-121.25.14Ubuntu 20.04.5 LTS5.15.0-69-generic192.168.1.12master节点 + etcd节点k8s-master-131.…

adb shell命令查看当前屏幕可见最顶层Activity和Fragment及其调用栈

adb shell命令查看当前屏幕可见最顶层Activity和Fragment及其调用栈 &#xff08;1&#xff09;当前屏幕可见页面最顶层是哪个Activity: adb shell "dumpsys activity top | grep ACTIVITY | tail -n 1"&#xff08;2&#xff09;当前屏幕可见页面最顶层是哪个Fragm…

(图论) 827. 最大人工岛 ——【Leetcode每日一题】

❓ 827. 最大人工岛 难度&#xff1a;困难 给你一个大小为 n x n 二进制矩阵 grid 。最多 只能将一格 0 变成 1 。 返回执行此操作后&#xff0c;grid 中最大的岛屿面积是多少&#xff1f; 岛屿 由一组上、下、左、右四个方向相连的 1 形成。 示例 1: 输入: grid [[1, 0]…

解决Sublime Text用浏览器打开没反应

点击Open in Browser用浏览器打开没反应怎么解决&#xff1f; 点击Browse Packages 会跳转到这个文件夹页面 打开User文件夹 在文件中添加下面代码即可,chrome是默认打开浏览器&#xff0c;可以自定义为你想用的浏览器 { "browser": "chrome" }

Centos7 安装部署 Kubernetes(k8s) 高可用集群

1&#xff1a;基础环境准备 宿主机系统集群角色服务器IP主机名称容器centos7.6master192.168.2.150ks-m1dockercentos7.6master192.168.2.151ks-n1dockercentos7.6master192.168.2.152ks-n2docker 1.1 服务器初始化及网络配置 VMware安装Centos7并初始化网络使外部可以访问*…