TS基本类型

TS基本类型,第1张

一、在编写ts代码之前要先搭建typescript环境

1.安装node

2.使用npm全局安装typescript

npm i -g typescript

3.准备工作做好就可以编写ts啦,但是ts最后还是要编译成js在浏览器里运行的

创建ts文件:hello.ts

进入 hello.ts文件所在目录编译成js文件:tsc hello.ts

二、ts基本类型

基础类型 · TypeScript中文网 · TypeScript——JavaScript的超集


let a: number
a = 10
// a = '213' 如果定义变量时定义了类型,后续对变量修改时不能修改为其他类型

let b = false
b = true
// b = 123 如果定义变量的同时也赋值了,那么ts可以自动对便变量进行类型检测

// 除了可以给变量设置类型,也可以对函数的参数设置类型
function add(a: number, b:number){
  return a + b
}
add(123, 456)
// add(132, '456') 必须传number类型
// add(123, 7, 8) 参数个数不对

// 可以对函数的返回值设置类型
function sub(a: number, b:number): number{
  return a - b
}

// 字面量 只能是这几种
let c: boolean | number | string
c = true
c = 23
c = '123'

// any 任意类型【不建议使用】 对一个变量设置了any类型后,相当于对该变量关闭了ts的类型检测
// 若将any类型的变量赋值给其他变量后,也会导致其他变量变为any类型
let d: any //显式any
// let d  隐式any,只声明不赋值
d = 10
d = 'hello'
d = false

// unknown 是一个类型安全的any
let e: unknown
e = 10
e = 'hello'
e = false
// unknown类型的变量不能直接赋值给其他变量,可以通过以下三种方式给其他变量赋值
let s: string
if(typeof e === 'string'){
  s = e
}
s = e as string // 类型断言,可以告诉解析器变量的实际类型
s = e

// void用来表示空,以函数为例,就表示没有任何返回值的函数
function fn1(): void{
  
}

// never 表示永远不会有返回结果
function fn2(): void{
  throw new Error('报错了!')
}
 

// object对象,js中万物皆对象【不常用】
let f: object
f = {}
f = function (){}
// {}可以用来指定对象中包含哪些属性
let g: {name: string, age: number} //意思是给g赋值时必须是个对象,且对象中必须有name和age两个属性,且属性的类型要满足要求
g = {name: '美少女', age: 18}
let h: {name: string, age?: number} //属性后面带?表示属性是可选的
h = {name: '美少女'}
let i: {name: string, [propoName: string]: any} //[propoName: string]: any表示任意类型的属性【常用来定义对象的结构】
i = {name: '美少女', hobby: ['吃饭', '睡觉' , '打游戏'], isStudent: true}

// 设置函数结构的类型声明
let j: (a: number, b: number) => number //两个入参都是number类型,返回值也是number类型
j = function(n1, n2): number{
  return n1 + n2
}

// 数组
let k: string[] //string[]表示字符串数组,数组中只能存放字符串,其他类型不可以
k = ['a', 'b', 'c']
// 或者
let l: Array //Array表示数字类型的数组
l = [1, 2, 3]

// 元组:固定长度的数组
let m: [string, number]
m = ['123', 123] 

// enum枚举
enum Gender {
  Male  = 0,
  Female = 1
}
let n: {name: string, gender: Gender}
i = {name: '美少女', gender: Gender.Male}

// &:同时
let o: {name: string} & {age: number}
o = {name: '美少女', age: 16}

// 类型的别名
type myType = 1 | 2 | 3 | 4 | 5
let p: myType //p只能是myType中的任意值 
p = 3

ts官方文档:文档简介 · TypeScript中文网 · TypeScript——JavaScript的超集 

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/1320353.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-06-11
下一篇 2022-06-11

发表评论

登录后才能评论

评论列表(0条)

保存