TypeScript 类型学习1

//基本类型 string boolean number 字面量

//js文件是由ts文件编译完成的 把js变成静态的

//number 指定a的类型且为字符串类型 后面的赋值只能是指定类型
let a: number; //《方法1》
a = 19;
//a = "2121å";
//即使ts写的错误也会编译成功 为了便于推广 后续可以通过配置文件进行配置来防止这种错误来阻止编译

let b: string;
b = "王佳慧";
//可以编译成任意版本  tsc --target 'es2020'   1_type.ts --outFile 'index.es2020.js' tsc命令编译 好处就是确保兼容性不同浏览器 可以指定版本
//但是以上两种写法在项目中不经常用

//如果变量的声明和赋值是同时进行的，ts可以自动对变量进行类型检测的
let c: boolean = true; //所以这个写法有点多余了；
let d = true; //直接写成这种写法 《方法2》

//声明变量时，如果是先声明后赋值可以用 《方法1》
//如果是变量的声明和赋值是同时进行的 用《方法2》 ts还是比较贴心的

//js函数是不考虑的类型和个数的
//在js中写函数很方便，不考虑类型和个数，且不会报错，但是这样会给我们造成安全的隐患，如果在不经意见调用或者没有人告诉你穿什么类型，不小心就算错一个结果用到别的地方，可能会导致一连串错误，也不方便排错。这就是js给我们带来的问题。
//所以有了ts后，这个就是小问题。我们可以在函数直接定义参数的类型声明。
// function sum(a, b) {
//   return a + b;
// }
function sum(a: number, b: number) {
  return a + b;
}
sum(123, 324);

console.log(sum(123, 324), sum(123, "323232")); //不添加类型 即使编译他也不会报错  //加上类型后，编译代码还是会编译成功， 但是我们可以根据ts给的提示去排错。

//除了可以给参数给类型声明，还可以给函数返回值加类型声明

function sum1(a: number, b: number): number {
  return a + b;
}
let result = sum1(19, 10);

//字面量类型声明 //赋值一次就不能在修改了 一般不使用 使用情况
let e: 10;
e = 10;

let f: "hello" | "sayHello"; //可以使用来连接多个类型 （联合类型）

let g: boolean | string; //给他限制住类型
g = true;
g = "dakldsal";

//any 表示任意类型,一个变量设置类型为any后相当于对该变量关闭了ts的类型检测
//使用ts时不建议使用any
//这是显式的any
//let l: any;
let l; //隐式的any  声明变量如果不指定类型，则ts解析器会自动判断变量的类型为any
l = 121;
l = "heool";
l = true;

//unknown 表示未知类型的值
let m: unknown;
m = 10;
m = "323";
m = true;

//any和unknown的区别
let s: string;
//s = l;

//unknown是一个类型安全的any
//unknown类型的变量，不能直接赋值给其他变量
m = "heoooo";
// m = s;
s = <string>m;
s = m as string; //类型断言 可以用来告诉解析器变量的实际类型
if (typeof m === "string") {
  s = m;
}

//void用来表示为空，以函数为例，就表示没有返回值的函数
function fn(): void {
  //return 123; //会报错
}

//never表示永远不会返回结果 了解一下 用的比较少
function fn2(): never {
  throw new Error("报错了！");
}

//object表示一个js对象

let x: object; //一般不会这么写
x = {};
x = function () {};

//{}用来指定对象中可以包括哪些属性 ?表示可选属性
let z: { name: string; age?: number }; //指向一个对象

z = { name: "王佳慧", age: 12 };

//当对象中想要添加不做要求的属性 [propName: string]:string | number 表示任意类型的属性
let o: { name: string; [propName: string]: string | number };
o = { name: "王佳慧", age: 20, sex: "女", aa: "3232" };

//设置函数结构的类型声明
let h: (a: number, b: number) => number;
h = function (n1, n2): number {
  return n1 + n2;
};

//array数组 一般在开发中来存相同类型的值
//let arr: string[];
//数组的类型声明 1.2 两种
let arr: Array<string>;
arr = ["wangjiahui"];

//元祖和数组的区别，效率可能会好一点
//元祖是固定的. 一般不会特别多

let Tuple: [string, string];
Tuple = ["wang", "wang"];

//enum枚举

let i: { name: string; gender: number };
i = {
  name: "王佳慧",
  gender: 0,
};
console.log(i.gender === 0); //这样的写法不好 为了让别人去判断 他可能不知道0是男还是女

//这样写就可以方便处理了
enum Gender {
  nan,
  nv,
}
let nn: { name: string; gender: Gender };
nn = {
  name: "王佳慧",
  gender: Gender.nv,
};
console.log(nn.gender === Gender.nv);

let j: string & number; //表示同时 但是这样写没有意义

//一般用来连接两个对象
let J: { name: string } & { age: number };
J = { name: "王佳慧", age: 123 };

//类型别名
type myType = 1 | 2 | 3 | 4 | 5;
let k: 1 | 2 | 3 | 4 | 5;
let kk: 1 | 2 | 3 | 4 | 5; //这样比较麻烦 可以给类型起别名

let kkk: myType;
kkk = 1;

//类型别名可以简化类型的使用

//以上就是最基本的也是用的最多的