ts常见的数据类型string,number,null,undefined等.....
string，number，boolean，数组
letstr:string='helloWorld';
letnum:number=2;
letbool:boolean=true
letarr1:string[] = ['1','2','3'] // 该数组内只能存放字符串类型的数组
letarr2:number[] = [1,2,3] // 该数组内只能存放数字类型的数组
// 第二种定义数组的方法
letarr3:Array<string>= ['1','2','3']
any类型
letobj:any= { // 不指定obj的类型他就会自定认为obj是个对象
a: 1
}
obj.foo=10;
letnumbers: string=obj;
类型注释
let n: number = 10;
n = 0
let b = 'one'// 如果不进行变量类型的注释，那么ts会直接推断出该变量的注释
// error:不能将类型“1”分配给类型“string”。
b = 1
对象类型
function getobject(gt:{n:number,s:string}){
}
getobject({
n:20,
s:'one'
// 不能传入多余的参数
t:'0'
})
function getobject1(gt:{n:number,s?:string}){
// “s?:string”代表该值可传可不传
}
getobject1({
n:20,
})
联合类型
function getId(id: string | number) {
// console.log(id.toUpperCase());
// 通过判断进行类型缩小进而使用部分方法
if (typeof id === 'string') {
id.toUpperCase()
} else {
console.log(id);
}
}
getId(101);
getId("101");
function getArr(x: string[] | string) {
// 使用判断进行对x判断
if (Array.isArray(x)) {
console.log(x.join());
}
else {
console.log(x);
}
}
getArr('1')
getArr(['1', '2', '3'])
定义类型别名
type ID = string | number
function getType(id:ID){
}
getType(10)
getType('22')interface接口
interface Point {
x:number,
k:number
}
function getCoord(gt:Point){
}
getCoord({
x:100,
k:20
})
// 扩展接口
interface Animal{
name:string
}
interface Bear extends Animal{
body:boolean
}
const bear:Bear ={
name:'winie',
body:true
}
// 使用interface添加新字段
interface Mybody{
one:string
}
interface Mybody{
two:number
}
const w:Mybody={
one:'1',
two:8
}
// 不能使用type进行同名扩展所以之恶能通过&进行扩展
type MyDog={
a:string
}
// type MyDog={
// b:string
// }
type MyDogs = MyDog &{
three:number
}类型断言
// 断言语法的定义
// 方法1
const myCanvas = document.getElementById('main_canvas') as HTMLCanvasElement
// 方法2
const myCanvas2 = <HTMLCanvasElement> document.getElementById('main_canvas')
// 如何将字符串断言成number类型
// const x = 'hello' as number
// 先将hello断言成一个不知道的类型然后在进行number的断言
const x = ('hello' as unknown) as number
文字类型
// 字符串文字类型
var testString = 'helloworld'
testString = 'HELLO-WORLD'
const constString = '不可变'
// constString = ''//报错：无法分配到"constString" ,因为它是常数。
let q: 'hello' = 'hello'// q的值只能为‘hello’这个字符串
// q = '1'// 不能将类型" 1""分配给类型"hello"
function getText(s: string, alignmet: 'top' | 'center' | 'bootom') {
// 在这里我们的alignmet就只能用所给的三个字符串了
}
// 所以我们在调用的时候只能给alignmet这个变量的值为固定的其中一个
getText('you', 'top')
// 数字文字类型
function getNumber(n: string, m: string): -1 | 0 | 1 {
// 如果n===m就返回0，n>m返回1，n<m返回-1
return n === m ? 0 : n > m ? 1 : -1
}
// 写个接口
interface Options{
opp:number
}
function getInfe(x:Options|'one'){
}
// 参数类行必须符合options或者是‘one’
getInfe({opp:200})
getInfe('one')
null&undefined类型
// 关闭tsconfig里面的"strict"在书写下列代码才能狗定义为null/unidentified
let z: undefined = undefined
let y: null = null
function doSomething(x:string |null){
if(x===null){
console.log(x);
}else{
console.log(x.toUpperCase());
}
}
function liveDangerously(x?:number | null){
console.log(x!.toFixed());
}
枚举
// 枚举
enum Direction{
Up=1,
Down,
Left,
Right
}
console.log(Direction.Up);// 1
console.log(Direction.Down);// 2
console.log(Direction.Left);// 3
console.log(Direction.Right);// 4而经过编译后的js代码如下
点赞：您的赞赏是我前进的动力！ 👍
收藏：您的支持我是创作的源泉！ ⭐
评论：您的建议是我改进的良药！ ✍
山鱼的个人社区：欢迎大家加入我的个人社区—— 山鱼社区
