TypeScript_01_变量类型的声明和基本使用

发布时间 2023-12-02 02:15:01作者: 前端自信逐梦者
// number
let a: number;
a = 10;

// string
let b: string;
b = "10";

// 如果变量的声明和赋值是同时进行的,TS可以自动对变量进行类型检测
let c = false;
c = true;

// 给函数指定类型
// 函数的返回类型也可以指定类型
function sum(a: number, b: number): number {
  return a + b;
}
sum(123, 456);

// 直接使用字面量进行类型声明
let d: 10;
d = 10;

// 使用 | 来连接多个类型(联合类型)
let e: "male" | "female";
e = "male";
e = "female";

let f: string | boolean;
f = "hello";
f = false;

// any,表示任意类型,不建议使用
// 声明变量如果不指定类型,Ts解析器会自动判断变量的类型是any(隐式)
let g: any;
g = 1;
g = "1";
g = true;

// unknow  表示未知类型的值
let h: unknown;
h = 1;
h = "1";
h = true;

// d的类型是any,他可以赋值给任何类型的变量,但是unknown不行,但是unknown可以赋值给any
f = g;
g = h;

// 类型断言,可以用来告诉解析器变量的实际类型
// 有两种语法,如下
f = h as string;
f = <boolean>h;

// void表示空,以函数为例,无返回值
function fn(): void {}

// never表示永远不会返回结果,连undefined都不返回
// 常用于报错
function fn2(): never {
  throw new Error("报错");
}

// object表示一个js对象
let i: object;
i = {};
i = function () {};
// {}用来指定对象中可以包含哪些属性
// 语法{属性名:属性值}
// 在属性名后面加?表示属性是可选的
let j: {
  name: string;
  age: number;
  sex?: string;
};
j = {
  name: "名字",
  age: 18,
};
//  [propName: string]: any;表示任意类型的属性
let k: {
  name: string;
  [propName: string]: any;
};
k = {
  name: "猪八戒",
  age: 18,
  sex: "男",
};

// 设置函数结构的类型说明
let l: (a: number, b: number) => number;

l = function (n1, n2): number {
  return n1 + n2;
};

// 表示声明一个字符串数组
// 两种方式
// 方式1:类型[]
let m: string[];
m = ["1", "2", "3"];
// 方式2:Array<类型>
let n: Array<number>;
n = [1, 2, 3];

// 元组:固定长度的数组
let o: [string, number];
o = ["1", 2];

// 枚举enum
// 定义一个枚举
enum Gender {
  Male = 0,
  Female = 1,
}
let p: {
  name: string;
  gender: Gender;
};
p = {
  name: "孙悟空",
  gender: Gender.Male,
};
console.log(p.gender == Gender.Male);

// 这里说明q必须包含这两个属性
let q: { name: string } & { age: number };
q = {
  name: "唐僧",
  age: 29,
};

// 类型的别名
type myType = 1 | 2 | 3 | 4;
let r: myType;
let s: myType;
let t: myType;