这里写目录标题
- 一、了解ts
- 1、ts是js的超集
- 二、掌握ts基本写法
- 1、数据类型
- 2、对象使用
- 3、类
- 4、多态
- 5、类修饰符
- 6、存储器
- 7、抽象类
一、了解ts
1、ts是js的超集
即你可以在ts中使用原生js语法:JavaScript + 更多功能 = TypeScript**
js是弱类型语言,而ts对此进行了加强
二、掌握ts基本写法
1、数据类型
(1)基本数据类型
js的基本数据类型:String、Number、NULL、Undefined、Boolean、Symbol、BigInt
ts增加了写法
1.1数字类型
//表示这个变量num是number类型的,如果赋值不是number会报错,其他类型一样
let num: number = 10
let num1 : number = 0b1010 //二进制
1.2布尔类型
let isD: boolean = true
isD= false
1.3字符串
let str: string = 'a'
let str2: string = 'b'
//模板语法
console.log(`${str},${str1}`) //打印 a,b
…其他类型
1.4数组类型
//设置为什么类型就只能放什么
let list:number[]=[1,2,3]
let list0:Array<number>=[1,2,3]
//叫元组类型
let list1:[string, number]=['aa',10]
1.5枚举
enum Color{
Red,
blue,
green
}
let color: Color = Color.red
1.6any和void
any:不清楚是什么类型用any,匹配任意字符
let str:any = 100
str = "abcdd"
let arr: any[] = [100,true,"abb"]
void:无类型,如果函数没有返回值可以用void
function showMsg():void{
console.log(123)
}
//无返回值,函数返回的话为undefined
1.7object
function getObj(obj:object): object{
return {}
}
1.8联合类型和类型断言
str可以传两种类型
断言两种写法:<>和as
function getStr(str: number | string): number{
if((<string>str).length){ //数字
return <string>str.length
}else{ //字符串
return str.toString().length
}
}
function getStr(str: number | string): number{
if(( str as string).length){ //数字
return str.length
}else{ //字符串
return str.toString().length
}
}
1.9类型推断
不明确类型ts会自动推断变量的类型
2、对象使用
interface IPerson{
readonly id:number, //只读
name:string,
age?:number //可加可不加
}
const xiaoming: IPerson = {
id:10,
name:"小明"
}
interface Isearch{
(source:string,subString:string):boolean
}
const searchString:Isearch = function(source:string, substring: string):boolean{
//查找字符串
return source.search(substring)>-1
}
3、类
模仿Java的语法,面向对象的编程思想
class myclass{
name:string,
age:number,
constructor(name:string,age:number){ //相当于构造器
this.name = name
this.age = age
}
sayHI(str:string){
console.log(str,'你好')
}
}
实现
interface one{
fim(): any
}
interface two{
light()
}
//实现,继承同java,要实现接口中的方法,可以多继承
class myclass implements one,two{
fim(){}
light(){
console.log("飞机")
}
}
const my1 = new myclass()
my1.light
my1.fim
继承
class person{
name:string,
age:number,
constructor(name:string,age:number){
this.name = name
this.age = age
}
sayHI(str:string){
console.log(str,'你好')
}
}
class student extends person{
...
}
4、多态
对照java,这怎么像Java一样了
5、类修饰符
public公共的
private私有的
protected受保护
static静态的
6、存储器
class person{
firstname:string,
lastname:string,
constructor(firstname:string,lastname:string){
this.firstname = firstname
this.lastname = lastname
}
get fullname(){
return this.firstname+this.lastname
}
}