typescript 的数据类型有哪些

在这里插入图片描述

👩 个人主页:不爱吃糖的程序媛
🙋‍♂️ 作者简介:前端领域新星创作者、CSDN内容合伙人,专注于前端领域技术,成长的路上共同学习共同进步,一起加油呀!
✨系列专栏:前端面试宝典、JavaScript进阶、vue实战
📢 资料领取:前端进阶资料以及文中源码可以在🎈公众号【不爱吃糖的程序媛】领取

一、typescript是什么

typescriptjavascript的超集,在javascript基础上提供了更加实用的类型供开发使用;

支持ES6语法,支持面向对象编程的概念,如类、接口、继承、泛型等;

其是一种静态类型检查的语言,提供了类型注解,在代码编译阶段就可以检查出数据类型的错误;

同时扩展了 JavaScript 的语法,所以任何现有的 JavaScript 程序可以不加改变的在 TypeScript 下工作;

为了保证兼容性,TypeScript 在编译阶段需要编译器编译成纯 JavaScript 来运行,是为大型应用之开发而设计的语言。

二、typescript有哪些数据类型

typescript 的数据类型主要有如下:

  • boolean(布尔类型)
  • number(数字类型)
  • string(字符串类型)
  • array(数组类型)
  • tuple(元组类型)
  • enum(枚举类型)
  • any(任意类型)
  • null 和 undefined 类型
  • void 类型
  • never 类型
  • object 对象类型

boolean

布尔类型

let flag:boolean = true;
// flag = 123; // 错误
flag = false;  //正确

number

数字类型,和javascript一样,typescript的数值类型都是浮点数,可支持二进制、八进制、十进制和十六进制

let num:number = 123;
// num = '456'; // 错误
num = 456;  //正确

进制表示:

let decLiteral: number = 6; // 十进制
let hexLiteral: number = 0xf00d; // 十六进制
let binaryLiteral: number = 0b1010; // 二进制
let octalLiteral: number = 0o744; // 八进制

string

字符串类型,和JavaScript一样,可以使用双引号(")或单引号(')表示字符串

let str:string = 'this is ts';
str = 'test';

作为超集,当然也可以使用模版字符串``进行包裹,通过 ${} 嵌入变量

let name: string = `Gene`;
let age: number = 37;
let sentence: string = `Hello, my name is ${ name }

array

数组类型,跟javascript一致,通过[]进行包裹,有两种写法:

方式一:元素类型后面接上 []

 let arr:string[] = ['12', '23'];
 arr = ['45', '56'];

方式二:使用数组泛型,Array<元素类型>

let arr:Array<number> = [1, 2];
arr = ['45', '56'];

tuple

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

let tupleArr:[number, string, boolean];
tupleArr = [12, '34', true]; //ok
typleArr = [12, '34'] // no ok

赋值的类型、位置、个数需要和定义(生明)的类型、位置、个数一致

enum

enum类型是对JavaScript标准数据类型的一个补充,使用枚举类型可以为一组数值赋予友好的名字

enum Color {Red, Green, Blue}
let c: Color = Color.Green;

any

可以指定任何类型的值,在编程阶段还不清楚类型的变量指定一个类型,不希望类型检查器对这些值进行检查而是直接让它们通过编译阶段的检查,这时候可以使用any类型

使用any类型允许被赋值为任意类型,甚至可以调用其属性、方法

let num:any = 123;
num = 'str';
num = true;

定义存储各种类型数据的数组时,示例代码如下:

let arrayList: any[] = [1, false, 'fine'];
arrayList[1] = 100;

null 和 和 undefined

JavaScriptnull 表示 “什么都没有”,是一个只有一个值的特殊类型,表示一个空对象引用,而undefined表示一个没有设置值的变量

默认情况下nullundefined是所有类型的子类型, 就是说你可以把 null undefined 赋值给 number 类型的变量

let num:number | undefined; // 数值类型 或者 undefined
console.log(num); // 正确
num = 123;
console.log(num); // 正确

但是ts配置了--strictNullChecks标记,nullundefined只能赋值给void和它们各自

void

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

function hello(): void {
    alert("Hello Runoob");
}

never

never是其他类型 (包括nullundefined)的子类型,可以赋值给任何类型,代表从不会出现的值

但是没有类型是 never 的子类型,这意味着声明 never 的变量只能被 never 类型所赋值。

never 类型一般用来指定那些总是会抛出异常、无限循环

let a:never;
a = 123; // 错误的写法

a = (() => { // 正确的写法
  throw new Error('错误');
})()

// 返回never的函数必须存在无法达到的终点
function error(message: string): never {
    throw new Error(message);
}

object

对象类型,非原始类型,常见的形式通过{}进行包裹

let obj:object;
obj = {name: 'Wang', age: 25};

三、typescript 和 javascript的区别?

1.类型系统:JavaScript是一种动态类型语言,变量的类型在运行时确定,并且可以随意更改。而TypeScript引入了静态类型系统,允许开发人员在编译时声明变量的类型,并进行类型检查。这有助于在开发阶段发现和预防潜在的类型错误,提高代码的健壮性和可维护性。

2.类型注解:在TypeScript中,可以使用类型注解来显式声明变量的类型,如let num: number = 10;。而在JavaScript中,不需要显式声明变量的类型,可以直接赋值。

3.语言特性:TypeScript在JavaScript的基础上增加了一些新的语言特性,如类(Class)、接口(Interface)、枚举(Enum)等。这些特性使得代码结构更清晰、可读性更好,对于大型项目的维护和团队协作更加有益。

4.编译过程:TypeScript需要通过编译器将TypeScript代码转换为可执行的JavaScript代码,然后在浏览器或Node.js环境中运行。而JavaScript代码可以直接在浏览器或Node.js中运行。

5.模块和导入:TypeScript支持使用CommonJS、AMD或ES6等模块系统,并提供了对第三方库的类型定义支持。而JavaScript最初只支持简单的脚本形式,但随着ES6标准的引入,也增加了对模块系统的支持。

参考文献

  • https://www.tslang.cn/docs/handbook/basic-types.html

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

吸猫毛空气净化器哪个好?推荐除猫毛好的宠物空气净化器品牌

如今&#xff0c;越来越多的家庭选择养宠物&#xff01;虽然家里变得更加温馨&#xff0c;但养宠可能会带来异味和空气中的毛发增多可能会引发健康问题&#xff0c;这也是一个大问题。 但我不想家里到处都是异味&#xff0c;尤其是便便的味道&#xff0c;所以很需要一款能够处…

Unity(第八部)Vector3的三维向量和旋转(坐标和缩放也简单讲了一下)

对了&#xff0c;Unity的生命周期自行百度吧&#xff1b;我这边整理的都不是很满意 Vector 是结构体 Vector2是指里面有两个变量 Vector3是指里面有三个变量 Vector4是指里面有四个变量 Vector3常用的变量就是x y z,所以&#xff0c;它可以代表坐标、旋转、缩放、三维向量 创…

C语言数据结构基础—单链表相关数据结构题目6道

上一篇博客中&#xff0c;我们大致的讲解了单链表相关的各种接口。接下来我们通过例题来运用类似的思想&#xff0c;达到学以致用的目的。 1.移除链表元素 203. 移除链表元素 - 力扣&#xff08;LeetCode&#xff09; 没有说明头结点是什么&#xff0c;默认就是第一个元素&am…

智能汽车软硬件产品CES展示汽车技术新亮点

智能汽车是汽车产业发展的新趋势&#xff0c;是未来汽车发展的必然方向。智能汽车是指搭载了先进的传感器、控制器、执行器等部件&#xff0c;并融合了人工智能、自动驾驶等技术&#xff0c;能够实现部分或完全自动驾驶、智能网联等功能的汽车。 近年来&#xff0c;智能汽车技…

ensp模拟单臂路由实现不同两个网段主机访问

拓扑结构图如下 1.pc机配置略过 2.交换机配置 三个接口&#xff0c;两个连接pc&#xff0c;连接方式access&#xff0c;一个连接路由器 连接方式trunk sy #进入系统 视图模式 undo info-center enable #关闭信息 vlan batch 10 20#批量创建vlan int g 0/0/2#进入2端口 p…

Java图书管理系统---命令行

项目列表 Book包 Book类内包含book的基本属性 BookList类初始化图书列表并且提供图书的属性方法 User包 Administrator类 common类 operator包 功能接口 新增图书功能 借阅图书功能 删除图书功能 显示图书功能 查找图书功能 归还图书功能 结束释放资源功能 运行…

MySQL进阶:大厂高频面试——各类SQL语句性能调优经验

&#x1f468;‍&#x1f393;作者简介&#xff1a;一位大四、研0学生&#xff0c;正在努力准备大四暑假的实习 &#x1f30c;上期文章&#xff1a;MySQL进阶&#xff1a;强推&#xff0c;冲大厂必精通&#xff01;MySQL索引底层&#xff08;BTree&#xff09;、性能分析、使用…

批量获取图片(下)

1.问题分析 我们观察下之前获得的图片&#xff0c;可以发现图片的清晰度不够。 放大之后比较模糊&#xff0c;这样的图叫做缩略图&#xff0c;那该如何获得高清海报图片呢&#xff1f; 为了找到高清图片&#xff0c;我们需要对网页结构进行分析&#xff0c;找到高清图对应的链…

C#,动态规划(DP)金矿问题(Gold Mine Problem)的算法与源代码

1 金矿问题&#xff08;Gold Mine Problem&#xff09; 给定一个N*M尺寸的金矿&#xff0c;每个点都有一个非负数表示当前点所含的黄金数目&#xff0c;最开始矿工位于第一列&#xff0c;但是可以位于任意行。矿工只能向右&#xff0c;右上&#xff0c;右下三个方向移动。问该…

Eureka 入门教程

Eureka 介绍 1. 注册中心概述 什么是注册中心&#xff1f; 给客户端提供可供调用的服务列表&#xff0c;客户端在进行远程调用&#xff08;RPC&#xff09;时&#xff0c;根据服务列表选择服务提供方的服务地址进行服务调用 注册中心的核心功能 注册&#xff1a;服务提供者上…

CY8C42(1.PSoC4 Pioneer Kit开箱及基本使用)

1.开箱 最近了解到赛普拉斯有一种芯片&#xff0c;属于PSoC系列&#xff0c;与传统MCU不同&#xff0c;有点类似跨界芯片&#xff0c;于是就买来玩玩了&#xff0c;老实说用完还是很特别的&#xff0c;因为我没有用过FPGA&#xff0c;不确定是不是FPGA的开发流程&#xff08;有…

【性能测试】loadrunner12.55--知识准备

1.0. 前言 ​ 在性能测试中&#xff0c;牵扯到了许多比较杂的知识点&#xff0c;这里将给大家说一下&#xff0c;loadrunner性能测试前需要做的一些准备&#xff0c;本节中我们将先从性能测试的一些术语入手&#xff0c;再到HTTP的一些知识&#xff0c;最后导我们loadrunner12…

linux文件及文件内容查找命令总结

在linux环境下&#xff0c;我们经常要查找一个文件或者文件的内容&#xff0c;但搜索的命令有很多&#xff0c;这些命令都有什么区别&#xff0c;应该怎么选择和使用呢&#xff1f; 下面总结了一些常见的文件查找、内容查找的命令&#xff0c;收藏起来备用吧。 文件查找 where…

虚拟机中window7界面太小解决办法

1.在虚拟机中的桌面的空白处右击&#xff0c;然后点击屏幕分辨率 2.根据自己电脑屏幕的大小来选择对应分辨率

java之servlet

动态的web资源开发技术 不同的用户&#xff0c;或者携带不同的参数&#xff0c;访问服务器 服务器添加判断层&#xff0c;实现访问不同的web资源

c++数据结构算法复习基础-- 2 -- 线性表-单链表-常用操作接口-复杂度分析

1、链表 特点 每一个节点都是在堆内存上独立new出来的&#xff0c; 节点内存不连续优点 内存利用率高&#xff0c;不需要大块连续内存 插入和删除节点不需要移动其它节点&#xff0c;时间复杂度O(1)。 不需要专门进行扩容操作缺点 内存占用量大&#xff0c;每一个节点多出存…

LeetCode238题:除自身以外数组的乘积(python3)

代码思路&#xff1a; 当前位置的结果就是它左部分的乘积再乘以它右部分的乘积&#xff0c;因此需要进行两次遍历&#xff0c;第一次遍历求左部分乘积&#xff0c;第二次遍历求右部分的乘积&#xff0c;再将最后的计算结果一起求出来。 class Solution:def productExceptSelf(…

【力扣 - 杨辉三角】

题目描述 给定一个非负整数 numRows&#xff0c;生成「杨辉三角」的前 numRows 行。 示例 1: 输入: numRows 5 输出: [[1],[1,1],[1,2,1],[1,3,3,1],[1,4,6,4,1]] 示例 2: 输入: numRows 1 输出: [[1]] 提示: 1 < numRows < 30 方法一&#xff1a;数学 思路…

【免费】两阶段鲁棒优化matlab实现——CCG和benders

目录 1 主要内容 2 部分代码 3 程序结果 4 下载链接 1 主要内容 程序采用matlab复现经典论文《Solving two-stage robust optimization problems using a column-and-constraint generation method》算例&#xff0c;实现了C&CG和benders算法两部分内容&#xff0c;通过…

93. 递归实现组合型枚举 刷题笔记

与我前面发的递归实现那一题有点相似 可以看看 94. 递归实现排列型枚举 刷题笔记-CSDN博客 思路 用u记录 选到哪一个位置 一旦选完 就输出 该题 要求升序 我们在选数时加入一个条件 大于上一个选择的数即可 依旧是从小到大搜到符合条件的每一个数 代码 #include<…