Typescript的数据类型

Typescript

Typescript Javascript 的一个超集。 Typescript 在原有 js 的基础之上又添加了编译期的类型检查的功能。意味着如 果在ts 的环境下开发时,会对变量的数据类型进行较为严格的验证,防止程序员写出可能出问题的代码,规范编程习惯。比较适合大项目开发时使用。

Typescript代码的编写及运行方式

typescript 代码写在后缀名为 .ts 的文件中,这种文件可以被 typescript 编译器编译解析,最终将生成一套功能相同的 js 代码,输出到 .js 文件中, typescript 语言的类型验证都是在编译期间来处理的。如果在编译过程中,ts 语法有类型验证的错误,则中断编译,报错。

全局安装typescript编译器

npm install -g typescript
npm install -g ts-node
npm install @types/node
安装成功后,就可以使用tsc命令,对ts文件进行编译。
tsc demo.ts
安装vscode的插件,方便的运行ts代码。
code runner

Typescript的数据类型

https://www.w3cschool.cn/typescript/typescript-basic-types.html
// basictype.ts 测试ts的基本数据类型
// boolean类型
let married: boolean = true
let loading: boolean = false
// number类型 描述数字
let n1: number = 8 // 十进制
let n2: number = 0b1010 // 二进制
let n3: number = 0o12 // 8进制
let n4: number = 0x0f // 16进制
console.log({n1, n2, n3, n4})// string类型 描述字符串
let name1: string = '亮亮'
console.log(`名字是:${name1}`)
// Array类型 描述数组
let names: string[] = ['亮亮', '小新', '泡泡']
console.log(names)
let ages: number[] = [18, 19, 15]
console.log(ages)
let hobby: Array<string> = ['摊煎饼', '玩单杠', '玩钢管']
console.log(hobby)
// 元组类型 (元素类型可以不一致的数组)
let person: [number, number, string] = [180, 130, '男']
console.log(person)
person = [166, 100, '女']
console.log(person)
// 访问元素 可以得到明确数据类型的结果
console.log(person[2])
// 枚举类型
// 当希望为某一个变量赋值,而赋的值的选择是某一个固定的范围
// 那么就可以声明一个枚举类型的数据来表示可以选择的值的范围
// 还可以给这些值设置一些友好的名字
// 声明一个枚举类型变量,保存新款小米手机可选择的所有的颜色
enum PhoneColor { Red='#f00', Blue='#00f', Green='#0f0' }
// 从枚举中选择一个颜色,赋值给变量 p1Color
let p1Color = PhoneColor.Red
console.log(p1Color)
// 声明一个枚举类型,保存可能会在sessionStorage中使用的KEY值
enum KEYS {User='user', Token='token', Cityname='city'}
// 当希望存储token时:
// sessionStorage.setItem(KEYS.Token, 'token字符串')
// sessionStorage.setItem(KEYS.User, user对象)
// 声明一个枚举类型,保存新增电影时的电影类型 热映、待映、经典
enum Category {Hot=1, Wait=2, Classic=3}
// 声明一个枚举类型,保存可以选择的性别
enum Gender {Male, Female}
console.log('Gender.Male:' + Gender.Male)
console.log('Gender.Female:' + Gender.Female)
// if(person.gender == Gender.Female) {
// xxxxxx
// }
enum paths {
ADD_ACTOR='/actor/add',
LIST_ACTOR='/actors',
DELETE_ACTOR='/actor/del',Typescript中的函数
和JavaScript一样,TypeScript函数可以创建有名字的函数和匿名函数。 你可以随意选择适合应用程序的方式,不
论是定义一系列API函数还是只使用一次的函数。
LIST_ACTORS_NAME='/actors/name',
}
// 对于枚举类型,TS还贴心的给出通过值反查枚举名称的语法:
// 查询 电影类别是2的电影,属于哪一个类别的电影?
console.log(Category[2])
console.log(Category[1])
console.log(Category[3])
// // 查询 sessionStorage中以token作为key保存的数据,到底是什么数据?
// let key = 'token'
// console.log(KEYS.key)
// any类型 有时候有些变量的类型说不清楚,不一定是什么类型
// 给一个变量设置any类型就意味着告诉ts编译器,不要对这个any变量
// 进行类型语法的检查,当做普通的js变量即可
let str:string = 'abc,cde,def'
console.log(str.split(','))
// console.log(str.toFixed(2)) 编译错误 str没有toFixed方法
let str2:any = 'abc,cde,def'
// console.log(str2.toFixed(2)) 不会提示编译错误 但是无法运行
// 类型断言(可以理解为 在某些语言中的类型转换)
// 通过类型断言可以清楚的告诉ts编译器 指定某个数据的数据类型
let resp = '{"code":200, "msg":"ok"}'
let respObj = JSON.parse(resp)
// let msg = respObj.msg
// 如何才能让respObj.可以有提示呢?
// 就需要明确的指明 respObj 的数据类型,这里就需要使用类型断言
let r = respObj as {code:number, msg:string}
console.log(r.code) // 有提示
console.log(r.msg) // 有提示

Typescript中的函数

和JavaScript一样,TypeScript函数可以创建有名字的函数和匿名函数。 你可以随意选择适合应用程序的方式,不 论是定义一系列API函数还是只使用一次的函数。

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

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

相关文章

docker环境安装

环境 主机环境 1. 宿主机环境 ubuntu-22.04.3-live-server-amd64 &#xff0c;下载地址&#xff1a; https://mirrors.aliyun.com/ubuntu-releases/22.04.3/ubuntu-22.04.3-live-server-amd64.iso 2. apt 包管理器&#xff0c;镜像源修改 : 将 http://cn.archive.ubunt…

间接法加窗分析信号的功率谱

本篇文章是博主在通信等领域学习时&#xff0c;用于个人学习、研究或者欣赏使用&#xff0c;并基于博主对通信等领域的一些理解而记录的学习摘录和笔记&#xff0c;若有不当和侵权之处&#xff0c;指出后将会立即改正&#xff0c;还望谅解。文章分类在 通信领域笔记&#xff…

【算法萌新闯力扣】:卡牌分组

力扣热题&#xff1a;卡牌分组 一、开篇 今天是备战蓝桥杯的第22天。这道题触及到我好几个知识盲区&#xff0c;以前欠下的债这道题一并补齐&#xff0c;哈希表的遍历、最大公约数与最小公倍数&#xff0c;如果你还没掌握&#xff0c;这道题练起来&#xff01; 二、题目链接:…

Redis key 过期监听实现

1.技术背景&#xff0c;想知道 redis 设置了TTL时间的key 过期&#xff0c;且有后续的业务处理的场景可以使用。 bug点&#xff1a; 使用redis 缓存失效监听会有一定的延迟&#xff0c; 过期事件是在redis服务器删除键的时候生成的&#xff0c;而不是在理论上生存时间到达0值得…

python每日一题——6三数之和

题目 给你一个整数数组 nums &#xff0c;判断是否存在三元组 [nums[i], nums[j], nums[k]] 满足 i ! j、i ! k 且 j ! k &#xff0c;同时还满足 nums[i] nums[j] nums[k] 0 。请 你返回所有和为 0 且不重复的三元组。 注意&#xff1a;答案中不可以包含重复的三元组。 …

【数据结构】树与二叉树(廿三):树和森林的遍历——层次遍历(LevelOrder)

文章目录 5.3.1 树的存储结构5. 左儿子右兄弟链接结构 5.3.2 获取结点的算法5.3.3 树和森林的遍历1. 先根遍历&#xff08;递归、非递归&#xff09;2. 后根遍历&#xff08;递归、非递归&#xff09;3. 森林的遍历4. 层次遍历a. 算法LevelOrderb. 算法解读c. 时间复杂度d.代码…

STM32 启动文件分析

STM32 启动文件分析 基于STM32F103VET6芯片的 startup_stm32f10x_hd.s 启动文件分析 设置栈&#xff0c;将栈的大小Stack_Size设置为0x00004900&#xff08;18688/102418KB&#xff09;&#xff0c;即局部变量不能大于18KB。&#xff08;EQU等值指令&#xff0c;将0x0000490…

Arduio开发STM32所面临的风险

据说micro_ros用到了arduino,然后用arduino搞stm32需要用到这个Arduino STM32的东西&#xff0c;然后这里申明了&#xff1a;这些代码没有经过严格测试&#xff0c;如果是向心脏起搏器&#xff0c;自动驾驶这样要求严格的的情况下&#xff0c;这个东西不能保证100%不发生问题&a…

尺度为什么是sigma?

我们先看中值滤波和均值滤波。 以前&#xff0c;我认为是一样的&#xff0c;没有区分过。 他们说&#xff0c;均值滤波有使图像模糊的效果。 中值滤波有使图像去椒盐的效果。为什么不同呢&#xff1f;试了一下&#xff0c;果然不同&#xff0c;然后追踪了一下定义。 12345&…

一体化污水处理设备各种材质的优缺点

一体化污水处理设备的材质有多种&#xff0c;包括不锈钢、玻璃钢、聚乙烯塑料、碳钢等。每种材质都有其独特的优点和缺点。 不锈钢材质的优点是防腐性能好&#xff0c;耐磨损&#xff0c;使用寿命长&#xff0c;且外观美观。其缺点是成本较高&#xff0c;不适合在一些特殊的环…

ESP32 ESP-IDF5.1 在Visual Studio Code中自定义分区表与调整Flash大小

好记心不如烂笔头 使用ESP-IDF开发ESP32的时候,要是同时用到蓝牙和WIFI的话,很多时候会提示Flash不够, 我是照着这样解决的,存档记录 来源 : zaixingxing2539 大佬的 ESP32 ESP-IDF5.0 在VSCODE中自定义分区表 用Visual Studio Code自定义分区表 # ESP-IDF Partition Table…

VMware虚拟机网络配置详解

vmware为我们提供了三种网络工作模式&#xff0c;它们分别是&#xff1a;Bridged&#xff08;桥接模式&#xff09;、NAT&#xff08;网络地址转换模式&#xff09;、Host-Only&#xff08;仅主机模式&#xff09; 打开vmware虚拟机&#xff0c;我们可以在选项栏的“编辑”下的…

Vue新手必学:Vue的使用和Vue脚手架详解

文章目录 引言第一部分&#xff1a;Vue的基本使用1.1 安装Vue1.2 创建Vue项目1.3 编写第一个Vue组件1.4 在主页面中使用组件1.5 运行Vue项目 第二部分&#xff1a;Vue脚手架的使用2.1 Vue脚手架是什么2.2 创建Vue项目2.3 项目结构2.4 运行项目2.5 插件和配置 第三部分&#xff…

局域网的网络ip不稳定问题

在局域网的多个设备&#xff0c;互相通信时好时坏&#xff0c;不稳定。 遭遇过的情况如下&#xff1a; 用两个开发板&#xff1a;972开发板1和2&#xff0c;网口同时互相ping&#xff0c;出现1ping 2通--此时2ping 1不通&#xff0c;过段时间&#xff0c;1ping2不通--但2ping又…

前端学习网站推荐

1.菜鸟教程&#xff08;程序员必备&#xff09;菜鸟教程 - 学的不仅是技术&#xff0c;更是梦想&#xff01; 2.npm库 npm | Home 3.uniapp学习官网 uni-app官网 4.vue官网 快速上手 | Vue.js 5.ECharts图表 Apache ECharts 6.ES6学习 ES6 入门教程 7.Three.js学习 Three.js…

基于人工蜂鸟算法优化概率神经网络PNN的分类预测 - 附代码

基于人工蜂鸟算法优化概率神经网络PNN的分类预测 - 附代码 文章目录 基于人工蜂鸟算法优化概率神经网络PNN的分类预测 - 附代码1.PNN网络概述2.变压器故障诊街系统相关背景2.1 模型建立 3.基于人工蜂鸟优化的PNN网络5.测试结果6.参考文献7.Matlab代码 摘要&#xff1a;针对PNN神…

Leetcode---372周赛

题目列表 2937. 使三个字符串相等 2938. 区分黑球与白球 2939. 最大异或乘积 2940. 找到 Alice 和 Bob 可以相遇的建筑 一、使三个字符串相等 这题把题目意思读懂&#xff0c;正常模拟就行&#xff0c;简单来说就是看三个字符串的最长公共前缀有多长&#xff0c; 代码如下…

操作系统:操作系统教程第六版(骆斌、葛季栋、费翔林)习题二处理器管理

目录 前言1. 简答题2. 应用题 前言 本系列文章是针对操作系统教程第六版&#xff08;骆斌、葛季栋、费翔林&#xff09;的习题解答&#xff0c;其中简答题部分为博主自己搜索整理的&#xff0c;错漏之处在所难免。应用题部分有答案为依据。 1. 简答题 &#xff08;1&#xf…

数据查询,让表单之间“联动”起来!丨三叠云

数据查询 路径 表单设计 >> 字段属性 功能简介 「数据查询」增加触发「数据联动」功能。本次对「数据查询」字段的功能进行优化&#xff0c;这次升级包含「编辑关联数据」、「导入数据」「拷贝数据」&#xff0c;以提高数据操作时的便利。 适用场景&#xff1a; 销…

[数据结构]-红黑树

前言 作者&#xff1a;小蜗牛向前冲 名言&#xff1a;我可以接受失败&#xff0c;但我不能接受放弃 如果觉的博主的文章还不错的话&#xff0c;还请点赞&#xff0c;收藏&#xff0c;关注&#x1f440;支持博主。如果发现有问题的地方欢迎❀大家在评论区指正 目录 一、红黑树的…