ts学习02-数据类型

新建index.html

<!DOCTYPE html>
<html lang="zh-CN">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><script src="./js/index.js"></script>
</body>
</html>

启动项目

npx tsc --watch

在这里插入图片描述

数据类型

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

布尔类型

Boolean类型包含两个逻辑值,分别是true和false。

let flag: boolean = true;
flag = false;
flag = "";//报错
flag = 123;//报错
let trueTag: true = true;
trueTag = false;//报错,只能为true

在这里插入图片描述

数字类型

Number类型表⽰⼀个数字。不详细区分整数类型、浮点数类型以及带符号的数字类型等

var num:number=123;
num=456;
console.log(num);  //正确
num='str';    //错误

字符串类型

String类型表⽰⽂本字符串,它由0个或多个字符构成

var str: string = "this is ts";
str = "haha"; //正确
str = true; //错误

数组类型

// 1.第一种定义数组的方式
var arr: number[] = [11, 22, 33];
console.log(arr);
//2.第二种定义数组的方式
var arr: Array<number> = [11, 22, 33];
console.log(arr);

元组类型

元组类型(tuple) 属于数组的一种

let arr: [number, string] = [123, "this is ts"];
console.log(arr);

枚举类型

枚举类型由零个或多个枚举成员构成,每个枚举成员都是⼀个命名的常量

enum Flag {success = 1,error = 2,
}let s: Flag = Flag.success;
console.log(s);
enum Flag2 {success = 1,error = 2,
}let f2: Flag2 = Flag2.error;
console.log(f2);

在这里插入图片描述

enum Color {blue,//0red,//1"orange",//2
}var c: Color = Color.red;console.log(c); //1  如果标识符没有赋值 它的值就是下标enum Color {blue,//0red = 3,//3"orange",//4
}var c: Color = Color.orange;
console.log(c); //4

也支持负数


enum Err {'undefined'=-1,'null'=-2,'success'=1};
var e:Err=Err.success;//1
console.log(e);

任意类型

var num: any = 123;
num = "str";
num = true;
console.log(num);//任意类型的用处
var oBox: any = document.getElementById("box");
oBox.style.color = "red";

null 和 undefined

null 和 undefined 其他(never类型)数据类型的子类型

var num1: number;
console.log(num1); //输出:undefined   报错
var num2: undefined;
console.log(num2); //输出:undefined  //正确
var num3: number | undefined;
num3 = 123;
console.log(num3);
//定义没有赋值就是undefined
var num4: number | undefined;
console.log(num4);
var num5: null;
num5 = null;
//一个元素可能是 number类型 可能是null 可能是undefined
var num6: number | null | undefined;
num6 = 1234;
console.log(num6);

void类型

typescript中的void表示没有任何类型,一般用于定义方法的时候方法没有返回值。

//正确写法
function run(): void {console.log("run");
}run();//错误写法
function run4(): null {console.log("run");
}run4();function run5(): number {console.log("run");
}
run5();//新版ts这个也是正确的
function run2(): undefined {console.log("run");
}run2();//正确写法
function run3(): number {return 123;
}
run3();

never类型

是其他类型 (包括 null 和 undefined)的子类型,代表从不会出现的值。这意味着声明never的变量只能被never类型所赋值。

//报错的时候使用
function f(): never {throw new Error();
}function infiniteLoop(): undefined {while (true) {console.log("endless...");}
}function infiniteLoop2(): null {while (true) {console.log("endless...");}
}
//永远为true的for循环中
function infiniteLoop23(): never {while (true) {console.log("endless...");}
}

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

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

相关文章

【P1008 [NOIP1998 普及组] 三连击】

[NOIP1998 普及组] 三连击 题目背景 本题为提交答案题&#xff0c;您可以写程序或手算在本机上算出答案后&#xff0c;直接提交答案文本&#xff0c;也可提交答案生成程序。 题目描述 将 1 , 2 , … , 9 1, 2, \ldots , 9 1,2,…,9 共 9 9 9 个数分成 3 3 3 组&#xff…

OpenCV快速入门:绘制图形、图像金字塔和感兴趣区域

文章目录 前言一、绘制图形1. 绘制直线2. 绘制圆3. 绘制矩形4. 绘制椭圆5. 绘制多边形6. 绘制文字7. 可选参数8. 手工绘制OpenCV的logo 二、图像金字塔1. 高斯金字塔2. 拉普拉斯金字塔 三、感兴趣区域&#xff08;ROI&#xff09;数组切片方式OpenCV截取方式 总结 前言 OpenCV…

Docker与Kubernetes结合的难题与技术解决方案

文章目录 1. **版本兼容性**技术解决方案 2. **网络通信**技术解决方案 3. **存储卷的管理**技术解决方案 4. **安全性**技术解决方案 5. **监控和日志**技术解决方案 6. **扩展性与自动化**技术解决方案 7. **多集群管理**技术解决方案 结语 &#x1f388;个人主页&#xff1a…

Swagger(3):Swagger入门案例

1 编写SpringBoot项目 新建一个Rest请求控制器。 package com.example.demo.controller;import org.springframework.web.bind.annotation.GetMapping; import org.springframework.web.bind.annotation.PostMapping; import org.springframework.web.bind.annotation.Reques…

C++20并发编程之线程闩(std::latch)和线程卡(std::barrier)

std::latch std::latch类是一种基于std::ptrdiff_t类型的倒计数器&#xff0c;可用于同步线程。计数器的值在创建时进行初始化。线程可以在 latch 上阻塞&#xff0c;直到计数器减少到零为止。无法增加或重置计数器&#xff0c;这使得 latch 成为一次性的屏障。 std::latch的成…

JS原型对象prototype

让我简单的为大家介绍一下原型对象prototype吧&#xff01; 使用原型实现方法共享 1.构造函数通过原型分配的函数是所有对象所 共享的。 2.JavaScript 规定&#xff0c;每一个构造函数都有一个 prototype 属性&#xff0c;指向另一个对象&#xff0c;所以我们也称为原型对象…

2023NOIP游寄

停课停了一个月&#xff0c;考炸了就真的寄了。 DAY -2 模拟赛出人意外的简单&#xff0c;信心赛吗&#xff1f; 开局30s切了T1。总共做出三题&#xff0c;但挂了 150pts。难绷。 直接没有信心了。 DAY -1 晚上直接跑路回家&#xff0c;表示&#xff1a;休息一天。 DAY …

深度学习(五)softmax 回归之:分类算法介绍,如何加载 Fashion-MINIST 数据集

Softmax 回归 基本原理 回归和分类&#xff0c;是两种深度学习常用方法。回归是对连续的预测&#xff08;比如我预测根据过去开奖列表下次双色球号&#xff09;&#xff0c;分类是预测离散的类别&#xff08;手写语音识别&#xff0c;图片识别&#xff09;。 现在我们已经对回…

3DEXPERIENCE许可合规性:确保企业设计流程的合法与安全

在当今复杂多变的设计领域&#xff0c;企业需要格外关注设计流程的合规性。3DEXPERIENCE作为一款全球领先的设计软件&#xff0c;其许可合规性是确保企业设计流程合法与安全的重要保障。本文将详细介绍3DEXPERIENCE在许可合规性方面的优势和实践&#xff0c;帮助您更好地了解和…

Java多线程下使用TransactionTemplate控制事务

简介 本文展示了在Java的多线程环境下使用Spring的TransactionTemplate控制事务的提交与回滚&#xff0c;当任何一个子线程出现异常时&#xff0c;所有子线程都将回滚 环境 JDK&#xff1a;1.8.0_211 SpringBoot&#xff1a;2.5.10 说明 本文通过同时写入用户(User)和用户详细…

zookeperkafka学习

1、why kafka 优点 缺点kafka 吞吐量高&#xff0c;对批处理和异步处理做了大量的设计&#xff0c;因此Kafka可以得到非常高的性能。延迟也会高&#xff0c;不适合电商场景。RabbitMQ 如果有大量消息堆积在队列中&#xff0c;性能会急剧下降每秒处理几万到几十万的消息。如果…

记录一些涉及到界的题

文章目录 coppersmith的一些相关知识题1 [N1CTF 2023] e2Wrmup题2 [ACTF 2023] midRSA题3 [qsnctf 2023]浅记一下 coppersmith的一些相关知识 上界 X c e i l ( 1 2 ∗ N β 2 d − ϵ ) X ceil(\frac{1}{2} * N^{\frac{\beta^2}{d} - \epsilon}) Xceil(21​∗Ndβ2​−ϵ) …

elementPlus+vue3引入icon图标

安装包管理&#xff0c;推荐使用 yarn npm包有时候会有包冲突&#xff0c;在项目的根目录下执行&#xff0c;在终端下 # Yarn $ yarn add element-plus/icons-vue在main.js或main.ts中进行全局注册&#xff0c;导入所有图标 import * as ElementPlusIconsVue from element-plu…

【Proteus仿真】【STM32单片机】防火防盗GSM智能家居设计

文章目录 一、功能简介二、软件设计三、实验现象联系作者 一、功能简介 本项目使用Proteus8仿真STM32单片机控制器&#xff0c;使用声光报警模块、LCD1602显示模块、DS18B20温度、烟雾传感器模块、按键模块、PCF8591 ADC模块、红外检测模块等。 主要功能&#xff1a; 系统运行…

Leetcode_49:字母异位词分组

题目描述&#xff1a; 给你一个字符串数组&#xff0c;请你将 字母异位词 组合在一起。可以按任意顺序返回结果列表。 字母异位词 是由重新排列源单词的所有字母得到的一个新单词。 就是将相同字母组合的单词放在一起 示例 1: 输入: strs ["eat", "tea&qu…

Mac电脑好用的窗口管理软件 Magnet 中文for mac

Magnet是一款用于Mac操作系统的窗口管理工具&#xff0c;它可以帮助您快速和方便地组织和管理应用程序窗口&#xff0c;以提高您的工作效率和多任务处理能力。 以下是Magnet的一些主要功能和特点&#xff1a; 窗口自动调整&#xff1a;Magnet允许您通过简单的拖放操作或使用快…

使用Golang调用摄像头

近年来&#xff0c;摄像头成为了我们生活中不可或缺的设备之一。从智能手机到安全监控系统&#xff0c;无处不在的摄像头给我们带来了便利和安全。在开发摄像头相关的应用程序时&#xff0c;选择一种高效和易用的编程语言是非常重要的。本文将介绍如何使用Golang调用摄像头并进…

同态加密定义,四大发展阶段总结,FHE系统正式定义-全同态加密

目录 同态加密定义 为什么采用电路模型? 四大发展阶段 总结 FHE系统正式定义

微信小程序 限制字数文本域框组件封装

微信小程序 限制字数文本域框 介绍&#xff1a;展示类组件 导入 在app.json或index.json中引入组件 "usingComponents": {"text-field":"/pages/components/text-field/index"}代码使用 <text-field maxlength"500" bindtabsIt…

IDEA创建文件添加作者及时间信息

前言 当使用IDEA进行软件开发时&#xff0c;经常需要在代码文件中添加作者和时间信息&#xff0c;以便更好地维护和管理代码。 但是如果每次都手动编辑 以及修改那就有点浪费时间了。 实践 其实我们可以将注释日期 作者 配置到 模板中 同时配置上动态获取内容 例如时间 这样…