TypeScrip1(数据类型)

TS是JS的超集,所以JS基础的类型都包含在内

安装ts: npm install typescript -g     查看版本号:tsc -v

普通编译ts : tsc 文件名.ts     运行tsc:node 文件名.js

nodejs 环境执行ts:
npm i @types/node --save-dev (node环境支持的依赖必装)
npm i ts-node --g
查看版本号:ts-node -v 
运行:ts-node app.ts 

1.字符串类型string

将string字符串设置给a变量,那么此变量只能赋值字符串类型,不能赋值其他数据类型,否则就会报错

let a: string = '123'//普通声明 ok
a=123,  //报错
 
//也可以使用es6的字符串模板
let str: string = `dddd${a}`

2.数字类型number

支持十六进制、十进制、八进制和二进制;

let notANumber: number = NaN;//Nan
let num: number = 123;//普通数字
num = '123'  //报错:不能将类型“string”分配给类型“number”
let infinityNumber: number = Infinity;//无穷大
let decimal: number = 6;//十进制
let hex: number = 0xf00d;//十六进制
let binary: number = 0b1010;//二进制
let octal: number = 0o744;//八进制s

3.布尔类型Boolean

注意,使用构造函数 Boolean 创造的对象不是布尔值:

let createdBoolean2: boolean = new Boolean(1)
//这样会报错 应为事实上 new Boolean() 返回的是一个 Boolean 对象,不能将类型“Boolean”分配给类型“boolean”。
//事实上 new Boolean() 返回的是一个 Boolean 对象 需要改成:
let createdBoolean1: Boolean = new Boolean(1) //ok

let createdBoolean: boolean = false   // ok
let booleand2: boolean = Boolean(1) //也可以通过函数返回布尔值

4.Symbol数据类型

// @ts-ignore
let name1: symbol = Symbol("name");
// @ts-ignore
let name2: symbol = Symbol("name");
const obj = {
    [name1]: "hello world",
    [name2]: "你好世界",
}

5.null和undefined数据类型

js中null和undefined是两个基本数据类型
在ts中 null和undefined他们是类型 也是值

let u: undefined = undefined;//定义undefined
let n: null = null;//定义null

6.空值类型Void

avaScript 没有空值(Void)的概念,在 TypeScript 中,可以用 void 表示没有任何返回值的函数

function voidFn(): void {
    console.log('test void')
}

void 类型的用法,主要是用在我们不希望调用者关心函数返回值的情况下,比如通常的异步回调函数

void也可以定义undefined 和 null类型

let u: void = undefined
let n: void = null;

void 和 undefined 和 null 最大的区别

与 void 的区别是,undefined 和 null 是所有类型的子类型。也就是说 undefined 类型的变量,可以赋值给 string 类型的变量:

//这样写会报错 void类型不可以分给其他类型
let test: void = undefined
let num2: string = "1"
 
num2 = test
//这样是没问题的
let test: null = null
let num2: string = "1"
 
num2 = test
 
//或者这样的
let test: undefined = undefined
let num2: string = "1"
 
num2 = test

TIPS 注意:

如果你配置了tsconfig.json 开启了严格模式

{
    "compilerOptions":{
        "strict": true
    }
}

 null 不能 赋予 void 类型 

 7.Any 类型 和 unknown 顶级类型

1.没有强制限定哪种类型,随时切换类型都可以 我们可以对 any 进行任何操作,不需要检查类型


let anys:any = 123
anys = '123'
anys = true

2.声明变量的时候没有指定任意类型默认为any

let anys;
anys = '123'
anys = true

3.弊端如果使用any 就失去了TS类型检测的作用

4.TypeScript 3.0中引入的 unknown 类型也被认为是 top type ,但它更安全。与 any 一样,所有类型都可以分配给unknown

unknow  unknow类型比any更加严格当你要使用any 的时候可以尝试使用unknow

//unknown 可以定义任何类型的值
let value: unknown;
 
value = true;             // OK
value = 42;               // OK
value = "Hello World";    // OK
value = [];               // OK
value = {};               // OK
value = null;             // OK
value = undefined;        // OK
value = Symbol("type");   // OK
 
//这样写会报错unknow类型不能作为子类型只能作为父类型 any可以作为父类型和子类型
//unknown类型不能赋值给其他类型
let names:unknown = '123'
let names2:string = names
 
//这样就没问题 any类型是可以的
let names:any = '123'
let names2:string = names   
 
//unknown可赋值对象只有unknown 和 any
let bbb:unknown = '123'
let aaa:any= '456'
 
aaa = bbb

区别2

如果是any类型在对象没有这个属性的时候还在获取是不会报错的
let obj:any = {b:1}
obj.a
 
 
如果是unknow 是不能调用属性和方法
let obj:unknown = {b:1,ccc:():number=>213}
obj.b
obj.ccc()

8.never类型

typescript将使用never类型来表示不应该存在的状态(表示永远都不会发生值的类型)

//值又是字符串类型又是数字类型就不存在,这时通过判断逻辑出错了需要该,则默认使oo给never类型
type oo= string & number  

function error(message:string) : never {
	throw new Error(message)  //因为这个函数没有返回值,抛出异常,可定义never类型
}

function loop():never{  //因为给的循环是死循环
	while(true){   //所以此时可以给这个loop函数定义never类型
	}
}

interface A{
	type:"保安"
}
interface B{
	type:"草莓"
}
interface C{
	type:"菜菜"
}
type All  = A | B | C
function type(val:All) {
	switch(val.type){
		case '保安' :
		 break
		case '草莓':
		 break
		default :
			const check:never=val;  //报错,要把C补上,
			break
	}
}



function fn(): never{
    throw new Error("手动错误")
}
function fn1(): never{
    while (true){
        console.log(1)
    }
}
function checkType(msg: string | number | boolean){
    let str = "";
    switch (typeof msg){
        case "string":
            str = "string"
            break;
        case "number":
            str = "number"
            break;
        case "boolean":
            str='boolean'
            let check: never = msg;//报错 不能将类型“boolean”分配给类型“never”。
            break;
        default:
            let check: never = msg;  //所以写到这里,当上面的类型判断完后,再没有可判断的里面可以定义never数据类型
    }
    return msg+","+str
}
checkType("123")
checkType(123)
checkType(true)

9.tuple元组类型

元组就是数组的变种,元组Tuple是固定数量的不同类型的元素的组合。

元组与集合的不同之处在于,元组中的元素类型可以是不同的,而且数量固定。元组的好处在于可以把多个元素作为一个单元传递。如果一个方法需要返回多个值,可以把这多个住作为元组返回,而不需要创建额外的类来表示。

我们已经知道数组中的数据类型应该统一,如果不统一,那么应该尝试使用对象来代替,但是使用元组,可以做到不统一的数据类型数组

tuple元组表示多种元素的组合,元组是必须要赋值的,元组的情况就是当我们返回值要放在数组里面,并且数据类型又不一样而且又有初始值的时候,这个时候就可以尝试着元组的数据类型,这样写成这个元组的数据类型别人分别用这个东西的时候,它可能使用到es6的解构赋值进行了一个接收,接受完了之后,该方法就会当作方法使用,该是其他的数据类型的时候就当作其他就属性用就可以了,里面可以写string,Array,或者其他类型

写法就是在 [ ] 里面定义每一个可能用到的数据类型,并且一定要赋值

let arr:[string,number] = ['name',18]  //这种形式约束已知的数组,统称为元组
arr[0].length
// arr[1].length  //报错,数字没有length
// arr.push(true)  //报错:类型“boolean”的参数不能赋给类型“string | number”的参数。
arr.push('111') 
arr.push(111)

10.枚举类型

枚举就是将一组可能出现的值, 一个一个列举出来, 定义在一个类型中,这个类型就是枚举类型。

数字定义枚举

// 数字定义枚举的方式  默认从零开始
enum Color{
    red,
    green,
    blue
}
console.log(Color.red);  //0
console.log(Color.green);  //1
console.log(Color.blue);  //2

// 增长枚举
enum Color{
    red=5,
    green,
    blue
}
console.log(Color.red); //5
console.log(Color.green);  //6
console.log(Color.blue);  //7

// 字符串枚举
enum Color{
    red='red',
    green='green',
    blue='blue'
}
console.log(Color.red); //red
console.log(Color.green);  //green
console.log(Color.blue);  //blue

// 异构枚举(字符串和数字混合的)  平时工作用的比较少
enum Color{
    yes=1,
    no='no'
}
console.log(Color.yes); //1
console.log(Color.no);  //no

//接口枚举 (通过接口枚举混合使用)
interface A {
    red:Color.yes
}
let obj:A = {
    red:Color.yes
}

下一章节:TypeScrip2(对象类型和数组类型)

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值