【前端vue3】TypeScrip-基础类型和任意类型

news2024/11/24 19:16:58

安装TypeScript

npm install typescript -g

运行tsc -v可查看当前版本


为了方便调试可以安装

先安装小满zs大神写的工具,可以切换下载源
npm i xmzs -g

安装成功后 使用mmp ls查看当前的源有哪些


使用 mmp use选择镜像源

切换成功后,安装TypeScript 调试的工具 ts-node

npm i ts-node -g

使用 npm init -y 生成package.json文件

使用npm i @types/node -D 生成声明文件

可以使用ts-node index.ts执行

全部安装完成后就开始学习!!!!!!!

基础类型

基础类型:Boolean、Number、String、null、undefined 以及 ES6 的 Symbol 和 ES10 的 BigInt。

字符串类型

string 定义 字符串

let a: string = '123'
//普通声明
数字类型
let notANumber: number = NaN;//Nan
let num: number = 123;//普通数字
let infinityNumber: number = Infinity;//无穷大
let decimal: number = 6;//十进制
let hex: number = 0xf00d;//十六进制
let binary: number = 0b1010;//二进制
let octal: number = 0o744;//八进制

布尔类型
let booleand: boolean = true //可以直接使用布尔值
 
let booleand2: boolean = Boolean(1) //也可以通过函数返回布尔值

console.log(booleand, booleand2)

空值类型

JavaScript 没有空值(Void)的概念,在 TypeScript 中,可以用 void 表示没有任何返回值的函数

function voidFn(): void {
    console.log('test void')
}

void 类型的用法,主要是用在我们不希望调用者关心函数返回值的情况下,比如通常的异步回调函数

void也可以定义undefined 和 null类型

let u: void = undefined
let n: void = null;

####Null 和undefined类型

let u: undefined = undefined;//定义undefined
let n: null = null;//定义null

任意类型(Any和unknown)

没有强制限定哪种类型,随时切换类型都可以 我们可以对 any 进行任何操作,不需要检查类型

let andy:any =123

andy = 123
andy = "123"

在这里插入图片描述
没有声明变量类型的时候默认为any

let andy

andy =123
andy = "123"

弊端如果使用any 就失去了TS类型检测的作用

TypeScript 3.0中引入的 unknown 类型也被认为是 top type ,但它更安全。与 any 一样,所有类型都可以分配给unknown

unknow类型比any更加严格

当要使用any 的时候可以尝试使用unknow

let a :unknown;

a =123

a ="小C学安全"  //字符串
a =true //布尔类型
a =[] // 列表
a ={} //对象
a = null  //空
a = undefined  //空
a = Symbol("type");

unknow类型不能作为子类型只能作为父类型 any可以作为父类型和子类型

unknown类型不能赋值给其他类型

let names:unknown ="小C学安全";
let names2:string =names
//提示不能将类型“unknown”分配给类型“string”。ts(2322)
let names:any ="小C学安全";
let names2:string =names
//any类型是可以的

unknown可赋值对象只有unknown 和 any

let names:any ="小C学安全";
let names2:unknown = 123

names =names2
如果是any类型在对象没有这个属性的时候还在获取是不会报错的
let obj:any = {b:1}
obj.a
 
 
如果是unknow 是不能调用属性和方法
let obj:unknown = {b:1,ccc:():number=>213}
obj.b
obj.ccc()

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

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

相关文章

【51单片机】按键的操作

文章目录 前言读取按键的原理proteus仿真示例代码 总结 前言 在现代电子产品中,按键是用户与设备之间交互的重要组成部分。它们允许用户通过简单的按下来触发特定的操作或命令。在微控制器的背景下,按键的设计和操作对于确保设备的响应性和用户体验至关…

「ClickHouse 极简教程」分布式下的 IN/JOIN 及 GLOBAL关键字

百度安全验证https://baijiahao.baidu.com/s?id1712073808973941124&wfrspider&forpc

NSSCTF-Web题目12

目录 [SWPUCTF 2021 新生赛]finalrce 1、题目 2、知识点 3、思路 [UUCTF 2022 新生赛]ez_rce 1、题目 2、知识点 3、思路 [羊城杯 2020]easycon 1、题目 2、知识点 3、思路 [SWPUCTF 2021 新生赛]finalrce 1、题目 2、知识点 命令执行,tee命令 3、思路…

springboot家乡特色推荐系统 LW +PPT+源码+讲解

3系统需求分析 3.1系统功能 通过前面的功能分析可以将家乡特色推荐系统的功能分为管理员和用户两个部分,系统的主要功能包括首页,个人中心,用户管理,文章分类管理,文章分享管理,系统管理等内容。任何用户…

五谷杂粮店铺小程序的作用是有什么

大米、面粉、荞麦、豆类等多种五谷杂粮商品可以说是必需,线下门店或摊位数量也不乏,但相比较流量较为固定且销售模式单一,想要进一步扩大生意效果却是不易。 线上是商家重点增长的场景,五谷杂粮商品自然也适合开展零售批发生意&a…

Leetcode - 周赛402

目录 一,3185. 构成整天的下标对数目 II 二,3186. 施咒的最大总伤害 三,3187. 数组中的峰值 一,3185. 构成整天的下标对数目 II 这里的T1,T2是一个题,这里直接一起讲了, 当我们已知 x%24 的值…

NGINX_十八 nginx 访问控制

十八 nginx 访问控制 1 nginx 访问控制模块 (1)基于IP的访问控制:http_access_module (2)基于用户的信任登录:http_auth_basic_module 2 基于IP的访问控制 2.1 配置语法 Syntax:allow addr…

实现一个动态规划算法,解决背包问题

public class Test_31 {// 动态规划解决0-1背包问题public int knapsack(int capacity, int[] weights, int[] values, int n) {// 创建一个二维数组dp&#xff0c;用于记录状态转移过程int[][] dp new int[n 1][capacity 1];// 遍历物品for (int i 1; i < n; i) {// 遍…

73. UE5 RPG 优化投射物以及敌人生成

解决发射物会与地面产生交互的问题 之前一直遇到发射物的体积过大会在发射时&#xff0c;和地面产生交互&#xff0c;我们可以调整小一些&#xff0c;然后为了防止它和自身产生交互事件。我们可以实现它在生成后&#xff0c;不会触发相关事件&#xff0c;而是在一定时间后。 对…

编码RNA Terc-53和透明质酸受体Hmmr可调节小鼠的衰老

近期&#xff0c;厦门大学王耿教授团队在Protein & Cell&#xff08;IF21.1&#xff09;上发表题为“Noncoding RNA Terc-53 and hyaluronan receptor Hmmr regulate ageing in mice.”的研究。研究团队构建了一系列Terc-53小鼠模型&#xff0c;发现Terc-53小鼠表现出与年龄…

如何开发一个项目脚手架cli

目录 背景正文unbuildpromptsprogresskolorist 设置打包命令npm execnpxnpm init/ npm create/ npm innit 使用最后 背景 随着团队项目类型越来越多&#xff0c;方便后续快速去开发项目&#xff0c;会出现各种类型的项目模版项目。 这样开发只需要通过脚手架选择自己需要的项目…

钒能新材料综合回收利用,钒溶液净化富集工艺之离子交换法

钒电池储能产业作为典型的绿色低碳优势产业&#xff0c;是新型储能领域重要发展方向。钒电池储能具备大规模、长周期等优势&#xff0c;是储能领域的重要组成部分&#xff0c;将成为拓展电能利用、应对可再生能源随机波动、支撑可再生能源高占比电力系统的最佳技术途径之一。 …

java连接mysql报错

1.背景&#xff0c;直接升级操作系统从centos-》国产化操作系统&#xff0c;mysql也升级到5.7.44 2&#xff0c;报错 Caused by: com.mysql.jdbc.exceptions.jdbc4.MySQLNonTransientConnectionException: Could not create connection to database server. Attempted reconn…

【JavaEE进阶】Spring统一功能处理:拦截器的使用

目录 1.什么是拦截器? 2.拦截器的使用 2.1定义拦截器 2.2 注册配置拦截器 3.拦截器详解 3.1 拦截路径 3.2 拦截器的执行流程 4. 使用拦截器实现登录校验 4.1 定义拦截器 4.2 注册配置拦截器 1.什么是拦截器? 拦截器是Spring框架提供的核心功能之⼀, 主要用来拦截用…

数据采集之二主一从,485总线共享器

产品概述 485总线共享器示意图 功能示意图 DAQ-GP-485HUB是上海数采物联网推出的一款 RS485总线多路复用共享数据处理器&#xff0c;是一款高性能的通讯设备&#xff0c;专门针对两台主机和 一台从机通讯时导致的数据冲突而设计。在实际工业控制和监控场景中&#xff0c;多个主…

vlan技术--交换机实现局域网分割(Access模式trunk模式)

自作笔记... 目录 vlan技术--交换机连接pc实现局域网分割(Access模式) PC SW1 结果 vlan技术--交换机连接pc实现局域网分割(trunk模式) vlan技术--交换机连接pc实现局域网分割(Access模式) 交换机先创建vlan. 交换机分别进入接口 (配置好连接模式, 连接的vlan) PC SW1 …

华为设备telnet 远程访问配置实验简述

一、实验需求: 1、AR1模拟电脑telnet 访问AR2路由器。 二、实验步骤&#xff1a; 1、AR1和AR2接口配置IP&#xff0c;实现链路通信。 2、AR2配置AAA模式 配置用户及密码 配置用户访问级别 配置用户telnet 访问服务 AR2配置远程服务数量 配置用户远程访问模式为AAA 配置允许登录…

Boom 3D软件安装包下载-Boom 3D官网最新版下载

众多使用者向我们证明了Boom3D软件31段均衡器和预设&#xff1a;均衡器允许您仅通过手指滑动来调制音频&#xff0c;并将其另存为自定义预设&#xff0c;预设已经精心设计为不同类型的歌曲&#xff0c;因此您能够简单地拨入音频以适应您的心情。相信大家都认同Boom 3D 是一款出…

【云原生】Kubernetes网络知识

Kubernetes网络管理 文章目录 Kubernetes网络管理一、案例概述二、案例前置知识点2.1、Kubernetes网络模型2.2、Docker网络基础2.3、Kubernetes网络通信2.3.1、Pod内容器与内容之间的通信2.3.2、Pod与Pod之间的通信 2.4、Flannel网络插件2.5、Calico网络插件2.5.1、Calico网络模…

秋招突击——6/17——复习{整理昨天的面试资料}——新作{删除链表倒数第n个节点}

文章目录 引言复习新作删除链表倒数第N个节点题目描述个人实现参考实现 总结 引言 主管面&#xff0c;面的很凄惨&#xff0c;不过无所谓了&#xff0c;我已经尽力了。上午都在整理的面经&#xff0c;没有复习算法&#xff0c;而且这两天要弄一下论文&#xff0c;二十号就要提…