[typescript][typescript教学] typescript中的类型

// @Li: Boolean

let isEnabled: boolean;
isEnabled = true;
isEnabled = !null;
isEnabled = !!undefined;
isEnabled = !!12

let isSupported: boolean = false;



// @LI: Number
// 和js一样所有的Number都是浮点类型, 不需要指定是多少进制, 多少小数

let num: number = 123456789;
num = 122.33
num = 0.00344;

let binary = 0b111101; // 二进制
let octal = 0o173; // 八进制
let hexadecimal = 0xff00; // 十六进制

let biggestNum = Number.MAX_VALUE;
let smallestNum = Number.MIN_VALUE;
let infiniteNum = Number.POSITIVE_INFINITY;
let negInfiniteNum = Number.NEGATIVE_INFINITY;
let notANum = Number.NaN;



// @LI: String

let str: string = '';
let templateStr: string = `${binary}`; // 支持模板字符串
let  hexadecimalEscapeSequence: string = '\xA9'; // 16进制转义序列, \x之后的数值将被认为是一个16进制数.
let unicodeEscapeSequence: string = '\u00A9'; // unicode转义序列



// @LI: Array
let numArr: number[]; // method 1
numArr = [1, 2, 3, 4, 5, 6];

let num1Arr: Array<number>; // method 2
num1Arr = [1, 2, 3, 4, 5, 0o173];

let jointArr: (string | number)[]; // 数组中联合写法，括号不能省(会被理解为要么是number, 要么是string)，下同
jointArr = ['str', 1, Number.MAX_SAFE_INTEGER, 0xff00];

let joint1Arr: Array<(string | number)>;
joint1Arr = ['str', 1, Number.NaN, 0xff00];



// @LI: Tuple
// 和数组相比来说是有长度和类型(一对一)限制的, 数组只要满足类型即可一直添加, 元祖不可以，并且只能为对应限制允许的类型
let tuple: [string, number, boolean, number[]];
// tuple = [1, 2, false, ''] // 报错, 类型也需要一一对应
tuple = ['str', Number.MIN_VALUE, false, []];
tuple = ['str', Number.MIN_VALUE, false, [1, 2]];
// tuple = ['str', Number.MIN_VALUE, false, [1, 2, 3], '']; // 多写了，在2.6版本及以后报错, 元素越界了；在2，6之前只要类型在规定的类型之中可以

let tuple1: [(string | number | null), string[]];
tuple1 = [null, ['str1', 'str2']];



// @Li: Enum
enum Roles { // 名字大写开头
    SUPER_ADMIN,
    ADMIN,
    USER,
}

// 0,1,2为自动的序列号
// console.log(Roles.SUPER_ADMIN) // 0
// console.log(Roles.ADMIN) // 1
// console.log(Roles.USER) // 2
// example
const role = 0;
if(role === Roles.SUPER_ADMIN){} // 这可以让代码更加直观

// 自己定义序列号，如从1开始, 可以不连续, 也可以每个自己都指定，也可以制指定一个(自动递增)，还可以从中间指定
enum Types { // 名字大写开头
    SUPER_ADMIN_TYPE = 1,
    ADMIN_TYPE,
    USER_TYPE = 10,
    OTHER_TYPE
}
// console.log(Types.SUPER_ADMIN_TYPE) // 1
// console.log(Types.ADMIN_TYPE) // 2
// console.log(Types.USER_TYPE) // 10
// console.log(Types.OTHER_TYPE) // 11
// 可以通过名字取到索引值，也可以通过索引值渠道名字
console.log(Types[10]) // USER_TYPE

/**
 * 枚举的实现
 * let obj = {};
 * obj[obj['SUPER_ADMIN_TYPE']=0] = 'SUPER_ADMIN_TYPE';
 *
 * 原理：
 * obj['SUPER_ADMIN_TYPE']=0 会在obj上增加一个SUPER_ADMIN_TYPE属性，并返回 0
 * obj[obj['SUPER_ADMIN_TYPE']=0] = 'SUPER_ADMIN_TYPE' 即是 obj[0] = 'SUPER_ADMIN_TYPE'
 *
 * 这样即可做到, 设置下标又设置本身的值
 * 同理，除了指定下标为数值，还可以指定其他
 */
enum CURRENCYS {
    RMB = 'RMB',
    USD = 'USD',
}



// @LI: any
// 表示任何的类型, 能不用尽可能不用
let value: any;
value = 133;
value = 'str';
value = new Date();
const anyArr: any[] = ['str', 10, new Date()]



// @Li: void
// 表示没有任何类型，一般用户函数什么返回值都没有

// undefined 可以赋值给void的值
// 函数没有明确指定返回值或者是空的, 默认是undefined
function forwordReturn(step: number): void {
    return
}
function forword(step: number): void {
    console.log(`将要跳转到 ${step} 部`);
}
function forwordReturnUndefined(step: number): void {
    return undefined
}

let v: void;
v = undefined;
// v = null; // 报错 null可以赋值给void, 但是我们默认使用的tsconfig.json是开启strict（strictNullChecks）的，所以抛出了错误



// @Li: null 、undefined
// 在ts中即使值也是类型
let u: undefined;
u = undefined; // 只能赋值undefined

let n: null;
n = null; // 只能赋值null

/**
 * null 和 undefined 是所以类型的子类型，可以将unll和undefined赋值给任意类型
 * 报错的原因还是strictNullChecks启用了的
 */
// let number1: number = null;
// number1 = undefined;



// @Li: never
// 表示永远不存在的类型
// 在抛出错误的函数和死循环里面出现
function errorFunc(message: string):never {
    throw new Error(message)
}
// function infiniteFunc():never{
//     while(true){}
// }

/*
* never 类型的值是其他任何类型的子类型，即never的类型可以赋值给其他任意类型；其他任意类型不可以赋值给never类型
*/
let nm: number;
let nValue = (() => { while(true){} })(); // never
nm = nValue;


// @Li object
// 与其他数值类型不同, 其他数值类型是直接存储的值，而object存储的是对象在内存中地址的引用；
function logObject(obj: object):void{
    console.log(obj);
}



// 类型断言
// 我们不想让ts帮我做类型检查，我们自己知道他是什么类型的场景下使用
// 告诉ts你相信我，就是这个类型

// 这里报错
// function getLength(target: string | number): number {
//     if(target.length || target.length === 0) { return target.length }
//     else { return  target.toString().length }
// }

// 类型断言 解决
// method 1 使用尖括号
function getLength(target: string | number): number {
    if((<string>target).length || (<string>target).length === 0) { return (<string>target).length }
    else { return  target.toString().length }
}
// method 2 使用as语法
function getLength2(target: string | number): number {
    if((target as string).length || (target as string).length === 0) { return (target as string).length }
    else { return  target.toString().length }
}

/**
 * 问题一：在jsx和tsx中只能只用 as 语法来写
 *
 * 问题二： 上面这种方式每一个上面都需要指定类型, 比较麻烦
 * 解决二：我们可以使用ts中的自定义类型保护来解决这个问题
 */

zclzye：对应的仓库地址：https://github.com/kenny6520/typescript-course/blob/main/src/examples/baseTypes.ts回到原帖

感谢分享

对应的仓库地址：https://github.com/kenny6520/typescript-course/blob/main/src/examples/baseTypes.ts