当前位置: 首页 > news >正文

TypeScript的基本类型

typescript的定义

  • 以JavaScript为基础构建的语言
  • 是js的超集
  • 可以在任何支持js的平台执行
  • ts 拓展了js并增加了类型
  • Ts不能被js解析器直接执行。

TS=> 编译为js 执行的还是js.
js 不易于维护,而ts易于维护。
可提高项目的可维护性。

类似less、sass 完善的语法写 样式,最终转为css . 所有浏览器都能渲染
ts 都需要转为js ,编译ts ,比js 多一道工序
可以完全按照js来写。

TS增加了什么?

  • 类型(有js的类型number、string 、boolean等, 也有新增:给变量设置类型、 元祖 枚举、 抽象类)
  • 支持ES的新特性
  • 添加ES不具备的新特性 (抽象类 接口 工具 装饰器等)
  • 丰富的配置选项(严格 松散 ts可编译为任意版本 解决浏览器兼容性问题,比如ie老版本的浏览器也可兼容,将ts编译为ES3)
  • 强大的开发工具(编辑器的提示)

基本类型

  • 类型声明: let 变量:类型=值 ; let fn(参数:类型,参数:类型):类型{}
  • 自动类型判断 当对变量的声明和赋值是同时进行时,ts编译器会自动判断变量的类型,所以可以省略掉类型声明
  • 类型:number、string、boolean、使用字面量进行类型声明、any、unknown、void、never、object、array、tuple元祖、enum枚举
//声明一个变量a,同时指定类型为number
let a :number;
// a 的类型设置为number,在以后的使用过程中a的值只能是数字
a = 10;
//a='hi' // 是会报错的,因为变量a的类型是number,不能赋值字符串
// 在写上述代码过程中,虽然有错误,但通过tsc 1.ts 还是会继续编译
//不会阻止编译,后续可以通过编辑器的配置,设置为书写错误就不编译ts
let b:string;
b = 'hello';
//声明完变量就直接赋值
//let c:boolean = true;
//如果变量的声明和赋值是同时进行时,ts编译器会自动判断变量的类型
let c = false
c=true//JS中的函数是不考虑参数的类型和个数的
//function sum(a,b){
//	return a+b
//}
//console.log(sum(a:123,b:456)) // 579
console.log(sum(a:123,b:'456')) // '123456'//TS 写法 可以给参数 和返回值指定类型 都是小写
function sum(a:number,b:number):number{return a+b
}
sum(123,456) // 579
//sum(123,'456') // 会报错// 使用字面量声明变量
let a1:10;
a1 = 10;
//a1 = 11 // 会报错 ,指定了a1为10
// 可以使用|连接多个类型(联合类型)
let b1 : 'male' | 'female';
b1 = 'male'
b1 = 'female'
//b1 = 'hello' // 这里会报错
let c1 : boolean|string;
c1 = true;
c1 = 'hi'
// any 表示任意类型 ,一个变量设置类型为any后,相当于对该变量关闭了TS的类型检测
// 使用TS时不建议使用any类型
//let d:any;
// 声明变量如果不指定类型,则TS解析器会自动判断变量的类型为any(隐式的any)
let d;
d=true;
d = 'zifuchuan'
d=21
//unknown 表示未知类型的值 只霍霍自己,不会改变其他的变量
let e: unknown;
e = 12
e = true
e = 'hello'let s :string;
//d的类型是any,他可以赋值给任意变量;(不止是自己修改了,还会改其他的变量)
//s = d;
//unknown 是一个类型安全的any
//unknown类型的变量,不能直接赋值给其他变量
e = 'hello2'
//s = e // 会报错 不能把unknown类型的值赋值给其他类型的值
//可使用以下方式
if(typeof e === 'string'){s = e
}// 可使用类型断言 ,用来告诉解析器变量的实际类型 
/*
*  语法:
* 	变量 as 类型
* 	<类型>变量
*/
//尽管解析器不知道是什么类型,确定是string类型
s = e as string;
s = <string>e;// void 表示空,以函数为例,表示没有返回值的函数,单纯的console。alert
function fn1():void{}// never 表示永远不会返回结果
function fn2():never{throw new Error('报错啦')
}// object 表示js的对象
let o :object;
o = {};
o = function (){}
// {} 用来指定对象中可以包含哪些属性
//语法:{属性名:属性值,属性名:属性值}
// 在属性名后加?表示属性是可选的
let o1:{name:string,age?:number};
o1 = {name:'七公主',age:23};// [propName:string]:any 表示任意类型的属性 定义对象的属性
// 例子 :o2对象里有一个name属性,其他属性不管
let o2 :{name:string,[propName:string]:any}
o2 = {name:'七公主',age:23,set:'2'}// 对象中,要同时满足两个类型 &表示同时
let o3:{name:string} &{age:number}
o3 = {name:'八戒',age:23}/*
*  设置函数结构的类型声明
* 	语法:(形参:类型,形参:类型,形参:类型...)=> 返回值
*/
let func:(a:number,b:number)=> number
func = function(n1:number,n2:number):number{return n1+n2
}// array 数组
/*
*   数组的类型声明:
* 		类型[]
* 		Array<类型>
*/
// string[] 表示字符串数组
let stringArr:string[];
stringArr=['aa','b','cc']
// number[] 表示数值的数组
let numArr:number[];
numArr=[1,2,3]
// number[] 等同于Array<number>  
let numArr2:Array<number>;
numArr2 = [2,3,4];// 元祖:固定长度的数组 语法:[类型,类型]
let h:[string,number];
h = ['hello',21];//enum 枚举
/*
*	enum 枚举
*/
enum Gender{Male=0,FeMale=1
}
let i:{name:string,gender:Gender};
i = {name:'孙悟空',gender:Gender.Male  // 'male'
};
console.log(i.gender===Gender.Male) // true//类型的别名  可以简化类型的使用
type Mytype = 1|2|3|4|5;
let k:Mytype;
let m:Mytype;
let n:Mytype;
k = 2

====over

相关文章:

TypeScript的基本类型

typescript的定义 以JavaScript为基础构建的语言是js的超集可以在任何支持js的平台执行ts 拓展了js并增加了类型Ts不能被js解析器直接执行。 TS> 编译为js 执行的还是js. js 不易于维护&#xff0c;而ts易于维护。 可提高项目的可维护性。 类似less、sass 完善的语法写 样…...

Docker实战-如何去访问Docker仓库?

导语   仓库在之前的分享中我们介绍过,它主要的作用就是用来存放镜像文件,又可以分为是公共的仓库和私有仓库。有点类似于Maven的中央仓库和公司内部私服。 下面我们就来介绍一下在Docker中如何去访问各种仓库。 Docker Hub 公共镜像仓库 Docker Hub 是Docker官方提供的最…...

【力扣】722. 删除注释

以下为力扣官方题解&#xff0c;及本人代码 722. 删除注释 题目题意示例 1示例 2提示 官方题解模拟思路与算法复杂度 本人代码Java提交结果&#xff1a;通过 题目 题意 给一个 C C C 程序&#xff0c;删除程序中的注释。这个程序 s o u r c e source source 是一个数组&a…...

篇二:工厂方法模式:灵活创建对象

篇二&#xff1a;“工厂方法模式&#xff1a;灵活创建对象” 开始本篇文章之前先推荐一个好用的学习工具&#xff0c;AIRIght&#xff0c;借助于AI助手工具&#xff0c;学习事半功倍。欢迎访问&#xff1a;http://airight.fun/。 另外有2本不错的关于设计模式的资料&#xff…...

Python(六十二)字典元素的增、删、改操作

❤️ 专栏简介&#xff1a;本专栏记录了我个人从零开始学习Python编程的过程。在这个专栏中&#xff0c;我将分享我在学习Python的过程中的学习笔记、学习路线以及各个知识点。 ☀️ 专栏适用人群 &#xff1a;本专栏适用于希望学习Python编程的初学者和有一定编程基础的人。无…...

从零学算法138

**138.**给你一个长度为 n 的链表&#xff0c;每个节点包含一个额外增加的随机指针 random &#xff0c;该指针可以指向链表中的任何节点或空节点。 构造这个链表的 深拷贝。 深拷贝应该正好由 n 个 全新 节点组成&#xff0c;其中每个新节点的值都设为其对应的原节点的值。新节…...

CTF PWN练习之返回地址覆盖

今天进行的实验是CTF PWN练习之返回地址覆盖&#xff0c;来体验一下新的溢出方式。 学习地址覆盖之前还有些小知识需要掌握&#xff0c;不然做题的时候你肯定一脸懵逼,首先是函数调用约定&#xff0c;然后还要知道基本的缓冲区溢出攻击模型。 函数调用约定 函数调用约定描述…...

OpenCV中图像变换

一、介绍 transform()&#xff1a;Transposes a matrix. perspectiveTransform()&#xff1a;Performs the perspective matrix transformation of vectors. warpAffine()&#xff1a;Applies an affine transformation to an image. warpPerspective()&#xff1a;Applies a p…...

wordpress发表文章时报错: rest_cannot_create,抱歉,您不能为此用户创建文章(已解决)

使用wordpress 的rest api发布文章&#xff0c;首先使用wp-json/jwt-auth/v1/token接口获取token&#xff0c;然后再使用/wp-json/wp/v2/posts 接口发表文章&#xff0c;但是使用axios请求时&#xff0c;却报错&#xff1a; 但是&#xff0c;我在postman上却是可以的&#xff0…...

数学建模学习(7):Matlab绘图

一、二维图像绘制 1.绘制曲线图 最基础的二维图形绘制方法&#xff1a;plot -plot命令自动打开一个图形窗口Figure&#xff1b; 用直线连接相邻两数据点来绘制图形 -根据图形坐标大小自动缩扩坐标轴&#xff0c;将数据标尺及单位标注自动加到两个坐标轴上&#xff0c;可自定…...

CSS中所有选择器详解

文章目录 一、基础选择器1.标签选择器2.类选择器3.id选择器4.通配符选择器 二、复合选择器1.交集选择器2.并集选择器 三、属性选择器1.[属性]2.[属性属性值]3.[属性^属性值]4.[属性$属性值]5.[属性*属性值] 四、关系选择器1.父亲>儿子2.祖先 后代3.兄弟4.兄~弟 五、伪类选择…...

STM32 低功耗学习

STM32 电源系统结构介绍 电源系统&#xff1a;VDDA供电区域、VDD供电区域、1.8V供电区域、后备供电区域。 器件的工作电压&#xff08;VDD&#xff09;2.0~3.6V 为了提高转换精度&#xff0c;给模拟外设独立供电。电压调节器为1.8V供电区域供电&#xff0c;且1.8V供电区域是电…...

HCIP--云计算题库 V5.0版本

在国家政策的支持下&#xff0c;我国云计算应用市场发展明显加快&#xff0c;越来越多的企业开始介入云产业&#xff0c;出现了大量的应用解决方案&#xff0c;云应用的成功案例逐渐丰富&#xff0c;用户了解和认可程度不断提高&#xff0c;云计算产业发展迎来了“黄金机遇期”…...

小白到运维工程师自学之路 第六十五集 (docker-compose)

一、概述 Docker Compose 的前身是 Fig&#xff0c;它是一个定义及运行多个 Docker 容器的工具。可以使用YAML文件来配置应用程序的服务。然后&#xff0c;使用单个命令&#xff0c;您可以创建并启动配置中的所有服务。Docker Compose 会通过解析容器间的依赖关系&#xff08;…...

量子机器学习

量子机器学习(QML)是结合量子计算和机器学习的交叉领域&#xff0c;旨在利用量子计算的优势来改进机器学习算法的性能。下面是一些有关量子机器学习的学习资源和技术应用&#xff1a; 学术论文和研究资料&#xff1a; ArXiv.org&#xff1a;在ArXiv的量子物理和机器学习类别中&…...

WEB集群——tomcat

1. 简述静态网页和动态网页的区别。 2. 简述 Webl.0 和 Web2.0 的区别。 3. 安装tomcat8&#xff0c;配置服务启动脚本&#xff0c;部署jpress应用。 一、简述静态网页和动态网页的区别 &#xff08;1&#xff09;静态网页 1.什么是静态网页 请求响应信息&#xff0c;发…...

Vulnhub: blogger:1靶机

kali&#xff1a;192.168.111.111 靶机&#xff1a;192.168.111.176 信息收集 端口扫描 nmap -A -sC -v -sV -T5 -p- --scripthttp-enum 192.168.111.176 在80端口的/assets/fonts/目录下发现blog目录&#xff0c;访问后发现为wordpress 利用wpscan发现wordpress插件wpdisc…...

老版MFC工程迁移到VC2019编译EXE太大的问题

有个老版静态链接MFC库的MFC程序需要迁移到VC2019编译&#xff0c;直接用VC2019打开就会自动迁移过去&#xff0c;然后编译一下&#xff0c;生成的EXE大小将近3MB&#xff0c;老版的工程编译出来也就600多KB。 肯定哪里不对劲&#xff01; 好一顿研究之后发现原来默认会把MFC…...

Curve深陷安全事件,OKLink如何破局

出品&#xff5c;欧科云链研究院 作者&#xff5c;Matthew Lee 7月31号&#xff0c;Curve 在平台表示 Vyper 0.2.15 的稳定币池由于编译器的漏洞所以遭到攻击。具体因为重入锁功能的失效&#xff0c;所以黑客可以轻易发动重入攻击&#xff0c;即允许攻击者在单次交易中执行某…...

2023华数杯数学建模思路A题B题C题模型代码分析

目录 一.2023华数杯数学建模最新思路&#xff1a;比赛开始后第一时间更新 更新查看文末名片 二.往年华数杯赛题简介分析&#xff1a; 一.2023华数杯数学建模最新思路&#xff1a;比赛开始后第一时间更新 更新查看文末名片 二.往年华数杯赛题简介分析&#xff1a; 2022华数杯…...

Zemax新手别怕!手把手教你用自定义孔径文件模拟双缝干涉(附UDA文件)

Zemax实战&#xff1a;用UDA文件打造双缝干涉仿真全流程 刚接触Zemax时&#xff0c;看到软件里那些复杂的参数设置和晦涩的专业术语&#xff0c;确实容易让人望而生畏。但当你真正动手操作几次后&#xff0c;会发现这个强大的光学仿真工具其实并没那么可怕。今天我们就来聊聊Ze…...

避坑指南:Xilinx Aurora IP核多核例化时,GT_RESET信号必须保持10个时钟周期的原因

Xilinx Aurora IP核多核例化中GT_RESET信号的时序陷阱与实战解决方案 在FPGA高速串行通信领域&#xff0c;Xilinx的Aurora 8B/10B协议IP核因其简洁高效的特性&#xff0c;成为多通道数据交互的首选方案。但当工程师尝试在单个QUAD中例化多个Aurora IP核以实现高密度链路时&…...

2026年4月亲测:宠物智能猫砂盆哪家强?

行业痛点分析在宠物智能猫砂盆领域&#xff0c;尽管市场上已有多种自动铲屎产品&#xff0c;但用户仍然面临一些核心问题。普通猫砂盆即便具备自动铲屎功能&#xff0c;底部仍会残留沾了尿液的结团猫砂&#xff0c;需要用户每周手动拆洗&#xff0c;实际上并未完全解放双手。数…...

文脉定序环境部署:适配中小企业知识库的轻量级重排序服务搭建指南

文脉定序环境部署&#xff1a;适配中小企业知识库的轻量级重排序服务搭建指南 1. 引言&#xff1a;为什么中小企业需要智能重排序&#xff1f; 在日常工作中&#xff0c;你是否遇到过这样的困扰&#xff1a;公司知识库明明有相关文档&#xff0c;但搜索出来的结果总是差强人意…...

Claude Code每日更新速览(v2.1.108)-2026/04/15

目录 更新内容&#xff1a; 分类总结&#xff1a; 一、功能新增 二、体验增强 三、稳定性与安全性 本文小结&#xff1a; 最新版本&#xff1a;v2.1.108 提交时间&#xff1a;2026-04-14 19:12 UTC 更新内容&#xff1a; 添加了“ENABLE_PROMPT_CACHING_1H”环境变量以…...

SystemView和Simulink选哪个?实测对比2ASK相干/非相干解调的仿真效率与结果

SystemView与Simulink实战对比&#xff1a;2ASK系统仿真效率与结果深度解析 在通信系统设计与教学领域&#xff0c;仿真工具的选择往往直接影响学习曲线和项目效率。当面对2ASK调制解调这类基础但关键的通信原理实验时&#xff0c;SystemView和Simulink这两个主流平台各有拥趸。…...

从SYSTICK到ADC:给STM32F1/F0系列MCU的三种随机数生成方案实测与避坑指南

STM32F1/F0随机数生成实战&#xff1a;三种方案深度评测与工程化选择 在嵌入式开发中&#xff0c;随机数生成是个看似简单却暗藏玄机的基础功能。当我们需要为STM32F1/F0这类中低端MCU设计设备序列号、加密密钥或游戏逻辑时&#xff0c;如何在没有硬件随机数发生器(RNG)的情况下…...

手机里的高速数据通道:一文搞懂M-PHY LANE在UFS存储中的关键作用

手机里的高速数据通道&#xff1a;一文搞懂M-PHY LANE在UFS存储中的关键作用 当你用手机拍摄4K视频时&#xff0c;是否想过每秒数百兆的数据如何瞬间存入闪存&#xff1f;打开大型游戏时&#xff0c;为何某些设备加载速度能快人一步&#xff1f;这背后隐藏着名为M-PHY LANE的&q…...

AtCoder Beginner Contest 438

【小羊肖恩】Atcoder Beginner Contest 438 实录——上次 AK 还在上 次&#xff0c;G 前后掉了 8 名&#xff01;还是不太会写环上的东西…… https://www.bilibili.com/video/BV1teBCBYER9/ AtCoder Beginner Contest 438 https://www.bilibili.com/video/BV1a8BCBKEnX/ https…...

LFE并发编程:如何利用Erlang OTP构建高可用系统

LFE并发编程&#xff1a;如何利用Erlang OTP构建高可用系统 【免费下载链接】lfe Lisp Flavoured Erlang (LFE) 项目地址: https://gitcode.com/gh_mirrors/lf/lfe Lisp Flavoured Erlang (LFE) 是结合了Lisp语法和Erlang强大并发能力的编程语言&#xff0c;它允许开发者…...