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

【ts的常用类型】

ts的常用类型

  • 前言
  • 安装
  • ts常见类型
    • 原始类型 、数组、 any
    • 变量上的类型注解
    • 函数
    • 对象类型
    • 联合类型
    • 类型别名
    • 接口
      • 接口和类型别名的对比


前言

typescript中为了使编写的代码更规范,更有利于维护,增加了类型校验,

安装

安装 typescript
npm i typescript -g
运行
tsc hello.ts

ts常见类型

原始类型 、数组、 any

类型举例描述
string“Hello word”表示字符串
number42所有的数字,类型都是 number
booleantrue 和 false布尔值
Array①var arr:number[]=[11,22,33] ② var arr:Array=[11,22,33];数组
anylet obj: any = { x: 0 };当你不希望一个值导致类型检查错误的时候,就可以设置为 any

变量上的类型注解

当你使用 const、var 或 let 声明一个变量时,你可以选择性的添加一个类型注解,显式指定变量的类型

let myName: string = "Alice";

函数

参数类型注解(Parameter Type Annotations)

当你声明一个函数的时候,你可以在每个参数后面添加一个类型注解,声明函数可以接受什么类型的参数。参数类型注解跟在参数名字后面:

function greet(name: string) {console.log("Hello, " + name.toUpperCase() + "!!");//当参数有了类型注解的时候,TypeScript 便会检查函数的实参:
}

对象类型

function printCoord(pt: { x: number; y: number }) {console.log("The coordinate's x value is " + pt.x);console.log("The coordinate's y value is " + pt.y);
}
printCoord({ x: 3, y: 7 });

可选属性:对象类型可以指定一些甚至所有的属性为可选的,你只需要在属性名后添加一个 ? :

function printName(obj: { first: string; last?: string }) {console.log(obj.last.toUpperCase());//可能为undefined,所以要先判断下if (obj.last !== undefined) {// OKconsole.log(obj.last.toUpperCase());}
}
// Both OK
printName({ first: "Bob" });
printName({ first: "Alice", last: "Alisson" });

联合类型

基于已经存在的类型构建新的类型,现在把它们组合在一起。

function printId(id: number | string) {console.log("Your ID is: " + id);
}
// OK
printId(101);
// OK
printId("202");
// Error
printId({ myID: 22342 });
// Argument of type '{ myID: number; }' is not assignable to parameter of type 'string | number'.
// Type '{ myID: number; }' is not assignable to type 'number'.
// 因为定义的参数类型为数字或者字符串,对象不符合条件

注:必须对每个联合的成员都是有效的。举个例子,如果你有一个联合类型 string | number , 你不能使用只存在 string 上的方法:

function printId(id: number | string) {console.log(id.toUpperCase());// Property 'toUpperCase' does not exist on type 'string | number'.// Property 'toUpperCase' does not exist on type 'number'.//解决方法 用typeof 先判断一下类型,在执行方法
}

类型别名

顾名思义,一个可以指代任意类型的名字。

type Point = {x: number;y: number;
};// Exactly the same as the earlier example
function printCoord(pt: Point) {console.log("The coordinate's x value is " + pt.x);console.log("The coordinate's y value is " + pt.y);
}printCoord({ x: 100, y: 100 });

你可以使用类型别名给任意类型一个名字,举个例子,命名一个联合类型:

type ID = number | string;

接口

interface Point {x: number;y: number;
}function printCoord(pt: Point) {console.log("The coordinate's x value is " + pt.x);console.log("The coordinate's y value is " + pt.y);
}printCoord({ x: 100, y: 100 });

接口和类型别名的对比

  • 相同点: 都可以给对象指定类型
  • 不同点:
    • 接口:只能为对象指定类型
    • 类型别名:不仅可以为对象指定类型,实际上可以为唯衣类型指定别名
http://www.lryc.cn/news/22643.html

相关文章:

  • Hyper-V与安卓模拟器不共存
  • 【图像分类】卷积神经网络之ZFNet网络模型结构详解
  • 亿级高并发电商项目-- 实战篇 --万达商城项目 十三(编写购物车、优化修改商品、下架商品方法、购物车模块监听修改商品、删除商品消息)
  • springboot 虚拟线程demo
  • CTFer成长之路之逻辑漏洞
  • 入门力扣自学笔记238 C++ (题目编号:1144)
  • 蓝桥杯-寒假作业
  • 测试用例篇
  • 自动驾驶自主避障概况
  • Python实用的库排名…
  • 【YOLO系列】YOLOv4论文超详细解读1(翻译 +学习笔记)
  • 【神经网络】Transformer基础问答
  • 制定防火墙策略的步骤和建议
  • 新必应(New Bing)国内申请与使用教程
  • 博客系统——项目测试报告
  • Macbook M1 安装PDI(Kettle) 9.3
  • 机器学习——模型评估
  • react react-redux学习记录
  • nodejs环境配置
  • 数据治理之元数据管理Atlas
  • 15 Nacos客户端实例注册源码分析
  • C++将派生类赋值给基类(向上转型)
  • 使用Platform Designer创建Nios II 最小系统
  • CD销售管理系统
  • 华为OD机试模拟题 用 C++ 实现 - 玩牌高手(2023.Q1)
  • Hive 的Stage如何划分?
  • 《嵌入式应用开发》实验一、开发环境搭建与布局(上)
  • 电子科技大学软件工程期末复习笔记(五):生产率和工作度量
  • 400G光模块知识大全
  • 【Linux】零成本在家搭建自己的私人服务器解决方案