1.静态类型是在编译时进行类型检查的类型。
// 声明变量 a 的类型为 number
let a: number = 10;
// 函数参数和返回值类型声明
function add(x: number, y: number): number {
return x + y;
}
// 接口定义对象的结构
interface Person {
name: string;
age: number;
}
// 类型别名
type Point = {
x: number;
y: number;
};
2.动态类型是在运行时确定类型的类型。
// JavaScript 中的动态类型
let b = 10; // b 可以随时被赋予不同类型的值
b = 'hello'; // 合法，b 现在是一个字符串
类型约束 / 类型注解
常规类型
javascript复制代码
常规类型包括数字类型，字符串，布尔值，声明未赋值和赋空值五类内置基本类型的数据。
该类数据添加类型约束，统一的语法为：let 变量名:类型 = 值
let a:boolean= false;
let num:number = 100;
let str:string = "过年好";
let u:undefined =undefined;----------类型约束为undefined，那么后续赋值就只能是undefined。
let n:null = null;-----------类型约束为null，那么后续赋值就只能是null
非常规类型
数组类型
javascript复制代码
数组类型添加类型约束，有两种写法(功能上无区别）
第一种声明方式(字面量方式）
let 变量名:数据类型[]=[元素,元素,.....]
第二种声明方式(泛型方式)
let 变量名:Array<number>=[元素,元素,.....]
let arr1: number[] = [1, 3, 5, 6, 100, '100'];
let arr2: Array<number> = [1, 3, 5, 6, 100, '100', [10, 20]];
对象类型
javascript复制代码
接口
1．使用interface 关键字来声明接口。
2．接口名称（比如，此处的IPerson)，可以是任意合法的变量名称。
3．声明接口后，直接使用接口名称作为变量的类型。
4．如果每一行只有一个属性类型，因此，属性类型后没有;(分号)。
类型别名（自定义类型) : 为任意类型起别名。
使用场景: 当同一类型（复杂）被多次使用时，可以通过类型别名，简化该类型的使用。
interface(接口）和type（类型别名）的对比:
相同点:
都可以给对象指定类型。
不同点:
接口，只能为对象指定类型。
类型别名，不仅可以为对象指定类型，实际上可以为任意类型指定别名
let person: { name: string; age: number; myName():string; myAge:()=>number } = {
name: 'jack ' ,
age: 19,
myName (),
myAge()
}
let person: {
name: string
age: number
myName():string
myAge:()=>number
} = {
name: 'jack ' ,
age: 19,
myName (),
myAge()
}
interface Person {---------当一个对象类型被多次使用时，一般会使用接口（( interface）来描述对象的类型，达到复用的目的
name: string
age: number
sayHi: ()=> void
}
let person1: Person = {
iname: 'jack' ,
age: 19,
sayHi()
}
let person2: Person = {
iname: 'tom' ,
age: 20,
sayHi()
}
type NArray = number[];----------类型别名
let arr1: NArray = [1,2,3,4]
万能类型
javascript复制代码
当一个变量的值源于用户输入、动态内容和第三方插件，在不清楚明确类型时，可以定义为 any
型；当只知道一部分值的类型时，也可定义为 any 型
let a1: any = {}
函数类型
javascript复制代码
void表示没有任何类型，常用于函数返回值（加了该类型约束的函数，没有返回值）
另外，在ts中函数的参数和返回值也需要指明类型
function warnUser(): void {
console.log("This is my warning message");
}
function fn(m:string):string{
}
let fn1: (m:string) =>string = (m) =>{
return ``
}
使用reactive和ref的类型约束
javascript复制代码
1.reactive的类型约束：：：
typescript
import { reactive } from 'vue';
interface User {
name: string;
age: number;
}
// 创建一个响应式的 User 对象
const user: User = reactive({
name: 'Alice',
age: 25
});
2.ref的类型约束：：：
import { ref } from 'vue';
// 创建一个响应式的数字
const count = ref<number>(0);