TS — 基础类型

最后更新于:2022-04-02 08:11:08

[TOC] >[success] # TypeSprict -- 基础类型 ~~~ 1.'TypeSprict ' 和 'JavaSprict' 的类型是基本一致,'TypeSprict' 依次是: 1.1 'boolean' -- 布尔类型,定以后可以赋值true/false 和Boolean()对象 1.2 'number' --数字类型,,定以后可以赋值'2/8/10/16进制','整数类型', '小数类型','NaN','Infinity(表示无穷大)' 1.3 'string' -- 字符串类型 1.4 '数组类型' -- '类型[]' /' Array<类型>' 1.5 '元组类型' -- '[类型]' 1.6 'enum' -- 枚举 1.7 'any' -- 任意类型 1.8 'void' -- 空置,定义方法时候没有返回值使用 1.9 'null/undefined' -- 'Null 和 Undefined' 1.10'never' -- 不存在类型一般用于错误处理函数.例如'抛出异常'/'死循环' 1.11'object' -- ts 中是泛指非所有非原始类型 1.12'类型断言' -- 可以理解成断定这个类型是自己断言设置的类型 2.基本类型使用的时候,通过冒号分割,以冒号左边为变量名,右面是变量的 类型 3.下面的案例建议在刚才的'example' 文件下创建一个'.ts'文件,并且在这个文 件中引入对应在'example' 创建的ts文件,例如: 在'example' 创建了一个 'basic-type.ts'文件,在'index.ts' 引入时需要写:import './example/basic-type' 4.注意'let' 和 'const' 变量声明修饰问题,在第一个案例中会详细说明,其他 案例同理 ~~~ >[info] ## let 和 const 注意事项 ~~~ 1.两者区别'const' 必须定义就赋值,但'let' 定义时候可以不赋值,但使用时候 必须赋值 ~~~ >[danger] ##### const * 错误示范 如果使用const声明变量,在初始的时候没有赋值是不被允许的 ~~~js const name1 : string ~~~ * 正确写法 ~~~js const name1 : string = 'wang' console.log(name1) // 打印结果 wang ~~~ >[danger] ##### let ~~~js 1.let 和 const 最大的区别'let' 允许 定义时不用赋值,但使用前必须赋值 ~~~ * 错误示范 ~~~js let name1 : string // 这一步是正确的可以定义不赋值 console.log(name1) // 错误的 使用时候必须要赋值 ~~~ * 正确操作 ~~~js let name1 : string // 当然也可以写成 let name1:string = 'wang' name1 ='wang' console.log(name1) // 打印结果是wang ~~~ >[info] ## 基本类型写法 >[danger] ##### ts 是带隐式类型推断 ~~~ 1.ts 会推断你当前变量的类型 ~~~ >[danger] ##### 布尔类型 -- boolean ~~~ 1.只能赋值true 或者 false和Boolean()对象 ~~~ * 赋值为true 和 false ~~~js let bool:boolean = true // 只能赋值true 或者 false 和Boolean()对象 bool = false // 重新赋值 console.log(bool) // 打印结果false ~~~ * 赋值为Boolean()对象 ~~~js let bool: boolean = Boolean(1); console.log(bool) // true ~~~ >[danger] ##### 数字类型 -- number ~~~ 1.ts 和 js 一样,TypeScript里的所有数字都是浮点数。不像java中有整数类 型、双精度类型等等,因为'ts' 的 数字表现形式是'number' 2.定义成number 只能赋值有: '二进制'、'八进制'、'十进制'、'十六进制'、 '整数类型和小数类型(整数类型可以算进十进制)'、'NaN(非数字类型)'、 'Infinity(表示无穷大)' ~~~ [可以参考js数字类型 -- 作者 酱路油过](https://www.kancloud.cn/cyyspring/more/1016606#Number__68) ~~~js let binNum:number = 0b110 // 二进制 let octNum:number = 0o6 // 八进制 let num:number = 6// 十进制 let hexNum:number = 0x6 // 十六进制 let maxNum:number = Infinity // 无穷大 let minNum:number = -Infinity // 无穷小 let isNaNum:number = NaN // 表示非数值类型 console.log(binNum) // 6 console.log(octNum) // 6 console.log(num) // 6 console.log(hexNum) // 6 console.log(maxNum) // Infinity console.log(minNum) // -Infinity console.log(isNaNum) // NaN ~~~ >[danger] ##### 字符串类型 -- string ~~~ 1.字符串也支持es6的`` 拼接写法 ~~~ ~~~ // 字符串类型 let num:number = 1 let str: string str = 'abc' str = `数值${num}` // 使用es6 拼接 `` console.log( str ) ~~~ >[danger] ##### 数组类型 ~~~ 1.数组类型是用来限制数组内部元素的类型,写法有两种 '「类型 + 方括号」表示法','数组泛型' ~~~ * 「类型 + 方括号」 ~~~ // 第一种写法 let arr: number[] arr = [1] ~~~ * 泛型 ~~~ // 第二种写法泛型 let arr2: Array arr2 = [1] ~~~ * 联合类型 ~~~ // 联合类型(下面案例显示可以是数字字符串类型) let arr3: (string|number)[] arr3 = [2,'3'] // 联合类型泛型的形式 let arr4: Array arr4 = [2,'3'] ~~~ >[danger] ##### 元组类型 ~~~ 1.元组类型 固定长度固定类型 2.顺序必须一一对应 3.2.6版本后不不准在越界超过定义数组长度 4.但是可以'push' 往里面添加元素,但只能添加定义好的联合类型 ~~~ ~~~js let tuple: [string, number, boolean] tuple = ['a',1,true] tuple.push("1") // 可以push tuple.push(Symbol("a")) // 报错不是元组中联合类型 ~~~ >[danger] ##### 枚举类型 -- enum ~~~ 1.写法:'enum 变量名 {}',变量名第一个单词一般大写 2.使用场景:当后台开发人员将一些特定的内容通过,特殊含义的数字提供给 我们时候,这个举个例子:权限后台返回给我们0 代表管理员,1代表普通 用户,我们需要结合写一些注释提供给其他接下来的维护,前端人员说明,现 在可以利用枚举值 3.默认顺序从0开始 ~~~ * 枚举类型定义参数点定义变量返回的是数值 ~~~js enum Roles { SUPER_ADMIN, ADIMN, USER } console.log(Roles.SUPER_ADMIN)// 返回的是0 // 后台返回的这种数据不一定是从0 开始 我么你想自定制怎么办 // 可以在后面去赋值,可以三个都赋值,也可以指定赋值其中一个 // 后面的排序会根据上一个进行 累加1 enum Roles2 { SUPER_ADMIN, ADIMN = 3, USER } console.log(Roles2.SUPER_ADMIN)// 返回的是0 console.log(Roles2.USER)// 返回的是4 ~~~ * 枚举类型[对应枚举数值]返回的是定义名称 ~~~js enum Roles { SUPER_ADMIN, ADIMN, USER } console.log(Roles[2])// USER ~~~ >[danger] ##### 任意类型 -- any ~~~js 1. 这些值可能来自于动态的内容,比如来自用户输入或第三方代码库。 这 种情况下,我们不希望类型检查器对这些值进行检查而是直接让它们通过编 译阶段的检查。 那么我们可以使用any类型来标记这些变量 2.使用any 等同于 : let something; something = 'seven'; something = 7; ~~~ ~~~js // any任意类型 少用 let value: any value = 1 value = '1' // 利用any 定义数组 const arr4: any[] = [1,'a'] ~~~ >[danger] ##### 空值 -- void ~~~ 1.它表示没有任何类型 2.当变量定义的时候只能赋值'undefined' (官方文档说变量定义这个一般没多大用) 3.变量的时候也可以赋值null 但需要修改配置文件给'"strictNullChecks": false,' 4.当函数定义的时候表示函数没有任何返回值 ~~~ ~~~ let anyParams: void = undefined // let anyParams2:void = null 可以赋值null 但需要修改配置文件 // 没有返回值的函数 const consoleText = (text:string):void => { console.log(text) } consoleText('测试') ~~~ >[danger] ##### Null 和 Undefined ~~~ 1.如果开启严格模式不能吧其他模式的值设置为null 和 undfined 2.与 void 的区别是,undefined 和 null 是所有类型的子类型。也就是说 undefined 类型的变量,可以赋值给 number 类型的变量 举个例子: let num: number = undefined,如果你在tsconfig.json 开启了严格模式'strict'那这样会报错 ~~~ ~~~ let u: undefined u = undefined // 只能是undefined类型 let n: null n = null // 只能是null 类型 ~~~ >[danger] ##### 不存在的类型 -- never ~~~ 1.永远不存在值的类型,一般用于错误处理函数.例如'抛出异常'/'死循环' ~~~ ~~~ // never 类型 不存在的类型 const errorFunc = (message: string): never => { throw new Error(message) } // 死循环 const infiniteFunc = (): never => { while(true){} } // 任意类型都可以赋值 never 但是never 不能赋值任意类型 // 立即执行函 类型是never 下面是 let test:number const infiniteFunc2 = ((): never => { while(true){} })() test = infiniteFunc2 // 其他 类型可以赋值never类型 // infiniteFunc2 = test never类型不可以赋值其他类型 ~~~ >[danger] ##### 对象 -- object ~~~ 1.object 类型 ts 中是泛指非所有非原始类型 ~~~ ~~~ // object 类型 ts 中是泛指非所有非原始类型 // 也就是数组 函数 对象 let a:object = [] a= function(){} a = {} ~~~ >[danger] ##### 想明确定义一个对象 ~~~ 1.可以使用接口 或者字面量的语法方式这里举个例子后面会深入 const b:{name:string} = {name:'w'} ~~~ >[danger] ##### 类型断言 ~~~ 1.两种写法:'<类型>值' 或者 '值 as 类型' 2.当我们使用一些联合类型的时候,不同的联合类型是具有不同属性,例如 数字就不存在字符串长度的方法,但是为了区分联合类型传递的参数去做不 一样方法,就需要使用到类型断言 3.它没有运行时的影响,只是在编译阶段起作用。 TypeScript会假设你,程序员,已经进行了必须的检查。 4.下面函数中的应用如果是js的话传入的数字,数字.length 会对应'undefined' 代码不会出现问题的,但因为ts 强类型,他会去查你类型中是否有这个方法 让你通过断言去做不同的操作 5.简单的说因为ts给我们做了强制的判断,因此我们也要对指定的联合参数 断言告诉他使用那个 ~~~ * 两种写法 ~~~js // 尖括号写法 let someValue: any = "this is a string"; let strLength: number = (someValue).length; // as 的写法 let someValue1: any = "this is a string"; let strLength1: number = (someValue1 as string).length; ~~~ * 函数中的应用 ~~~ function getLength(something: string | number): number { if ((something).length) { return (something).length; } else { console.log(2) return something.toString().length; } } console.log(getLength(1)) ~~~
';