Typescript Study Guide: Basic Data Types

foreword

忠告:
不要学习TypeScript, 因为它的学习成本很低
不要学习TypeScript, 因为它能减少团队无效沟通
不要学习TypeScript, 因为它能让你的代码更健壮
不要学习TypeScript, 因为它能帮助你快速掌握其它后端语言
不要学习TypeScript, 因为你会迷恋它

  Today’s dry goods share the basic data types of ts. This article mainly involves the concept and syntax of the basic data types of ts. Friends who need it should like it and collect it~
  If you are just starting out in ts and still don’t understand why you want to learn ts, you can move here to learn about ts for the first time~

text

TypeScript supports almost the same data types as JavaScript, and also provides useful enumeration types for our convenience.

1. Boolean value

语法:let isDone: boolean = false
isDone = true;
// isDone = 2 // error:boolean类型不能获得类型为number

2. Number type

语法:let a1: number = 10 // 十进制
//支持二进制、十进制、八进制、十六进制

3. String

语法:let name:string = 'tom'
//和 JavaScript 一样,可以使用双引号(")或单引号(')表示字符串

4. undefined and null

let u: undefined = undefined
let n: null = null
//TypeScript 里,undefined 和 null 两者各自有自己的类型分别叫做 undefined 和 null
//默认情况下 null 和 undefined 是所有类型的子类型,就是说你可以把 null 和 undefined 赋值给 其他类型的变量

5. Arrays and tuples

  • array:
//语法1:let 变量名:数据类型[]= [值1、值2、值3]
let list1: number[] = [1, 2, 3]
//语法2泛型数组:let 变量名:Array<数据类型>= [值1、值2、值3]
let list2: Array<number> = [1, 2, 3]

//注意问题:数组定义后,里面的数据类型必须和定义数组时候的类型是一致的,否则会有错误信息提示,也不会编译通过
  • Tuple: An array with known number of elements and types of elements, each element does not have to be of the same type
元组:在定义数组的时候,**数组的类型和数据的个数**一开始就已经限定。
let t1: [string, number]
t1 = ['hello', 10] // OK

//当访问一个已知索引的元素,会得到正确的类型,并可以使用该类型的方法
ex:console.log(t1[0].substring(1)//注意问题:元组类型在使用的时候,数组的类型及位置及个数应该与在定义的时候的数据类型个数及位置是一致的

6. Enumerable types

  Each data value of the enumeration can be called an element, each element has its own number, the number starts from 0, and will increase by 1 in turn.

enum Color {
    
    
//元素可以是中文的数据值,但是不推荐
  Red,//Red=10,元素可以设置值,不设置值默认是从0开始的,依次递增
  Green,//11 默认是1
  Blue//12 默认是2
}

// 根据特定的名称得到对应的枚举数值
let myColor: Color = Color.Green  // 1
console.log(myColor, Color.Red, Color.Blue)// 1 ,0,2 

//可以有枚举的值找到其对应的名字

7, any type and void type

  • any type
      When there are multiple data to be stored in an array, the number is uncertain, and the type is also uncertain, you can use any to define the array
语法:let 变量名:any =
  • void type: no type
      In a way, void type is like the opposite of any type. When a function does not return a value, you will usually see that its return type is void:
在函数声明的时候,小括号后面使用:void,代表的是该函数没有任何返回值
语法:function showmsg():void {
    
    
	console.log("哈哈哈")
}
showmsg()

8. Joint type

表示取值可以为多种类型的一种
语法:let str :string|number

//需求1、定义一个函数得倒一个数字或者字符串形式的值
function getstr (str:string|number):string{
    
    
	return str.tostring()
}
console.log(1233)
console.log("123")

//需求2:定义一个函数得倒一个数字或者字符串值的长度
function getstr (str:string|number):number{
    
    
	//return str.tostring().length//方法1:代码合理性不高:如果str本身是string类型,没有必要调用tostring方法
  if(str.length){
    
    
     //return str.length//此时编译器会爆红,因为它不确定你的str究竟是number或者是string类型,此时就需要类型断言
    return(str as string).length//类型断言
     }else{
    
    
    return str.tostring()
  }
}
console.log(1233)
console.log("123")

9. Type assertion

//通过类型断言这种方式可以告诉编译器,“相信我,我知道自己在干什么”,TypeScript 会假设你,程序员,已经进行了必须的检查
/*
类型断言的两种方式:
语法1: <类型>值
语法2:值 as 类型  tsx中只能用这种方式
*/

/语法1: <类型>值/
function getstr (str:string|number):number{
    
    
  if((<string>str).length){
    
    
			return (<string>str).length
     }else{
    
    
    return str.tostring().length
  }
}
console.log(getstr(1233))
console.log(getstr("12345"))

/语法2:as 类型  tsx中只能用这种方式/
function getstr (str:string|number):number{
    
    
  if((str as string).length){
    
    
			return (str as string).length
     }else{
    
    
    return str.tostring().length
  }
}
console.log(getstr(1233))
console.log(getstr("12345"))

10. Type inference

类型推断: TS会在没有明确的指定类型的时候推测出一个类型
/*
类型推断的两种情况:
1、定义变量时赋值了, 推断为对应的类型
2、定义变量时没有赋值, 推断为any类型
*/


//情况1:
/定义变量时赋值了, 推断为对应的类型 /
let b9 = 123 // number
// b9 = 'abc' // error

//情况2:
/定义变量时没有赋值, 推断为any类型 /
let b10  // any类型
b10 = 123
b10 = 'abc'

  The above is all about the basic data types of typescript.
  In addition to the commonly used types of js, the new tuple, enumeration, any and joint types of ts are all very useful types. I hope you can practice more during the learning process (I also hope that I can continue to practice myself) ,
  come on everyone~
insert image description here

Guess you like

Origin blog.csdn.net/m0_62209297/article/details/125767813