基础类型
Void
代表没有任何返回值
function showMsg(): void {
console.log(1)
return null
}
## Object
定义一个函数,参数是obj,返回值也是object
function getObj(obj:object): object {
console.log(obj)
return {
name: '2sa',
age: 22
}
}
如果想传入一个其他数据类型可以这样:
getObj(new String(123))
getObj(String) // 也是可行的
联合类型
取值可以是多种类型中的一种
function getString(str: number | strting): string {
return str.toString()
}
类型断言
不进行特殊的数据检查和结构
方法一: <类型>
方法二: as
function getString(str: number | strting): string {
if((<string>str).length) {
// 断定此时str是一个String类型
return str.length
// return (str as string).length
}else {
return str.toString().length
}
}
类型推断
自动推断类型
let te = 111
// 此时 ts将te的类型推断为 number
// 若改变te的数据类型
te = '123' // 报错
定义了类型没有赋值时,该变量是any类型
接口
接口用来对值进行类型检查, 使用接口来定义对象的数据类型(约束)
// 定义一个接口对象
interface IPerson{
// readyonly id属性只读
readyonly id: number,
name: string,
age: number,
// ? 非必选
sex?: string
}
// 定义一个IPerson为接口的对象
const person:IPerson = {
id:1,
name: 'asc',
age: 19
}
函数类型
使用接口 定义函数的类型
// 定义一个接口
interface ISearchFunc {
// 接受两个字符串参数, 返回的是布尔类型
(source: string, subString) : boolean
}
// 使用上面的接口定义一个函数
const seatchString:ISearchFunc = function(source:string, subString:string):boolean {
return source.search(subString) > -1
}
类类型
interface IFly {
// 没实现的方法
fly()
}
interface ISwim{
swim()
}
// 定义一个类实现上面的接口
// implements是一个类实现一个接口用的 关键字 .实现一个接口,必须实现接口中的所有方法
class Person implements IFly {
fly() {
console.log('111')
}
}
// 使用
const person = new Person()
// 一个类实现多个接口
class Person2 implements IFly,ISwim {
fly() {
console.log('111')
},
swim() {
console.log('111')
}
}
// 接口继承其他接口
interface IOther extends IFly,ISwim {}
继承
使用extends继承
子类构造函数中使用super调用父类的构造方法,子类可以调用或重写父类的方法
多态
实例化子类实例时使用父类型
const child:Parent = new Children()
// 定义一个父类
class Animal {
name: string,
constructor(name: string) {
this.name = name
}
run (distance: number) {
console.log(this.name,distance,'m')
}
}
// 定义两个子类
class Dog extends Animal {
constructor (name: string) {
this.name = name
}
// 重写父类中的方法
run (distance: number=10) {
console.log(this.name,distance,'m')
}
}
class Pig extends Animal {
constructor (name: string) {
this.name = name
}
// 重写父类中的方法
run (distance: number=5) {
console.log(this.name,distance,'m')
}
}
// 实例化子类实例时使用父类型
const pig: Animal = new Pig('小猪') // 可以运行 结果是: 小猪5m
// 使用函数型式调用
// 正常方式实例化两个子类
const dog1: Dog = new Dog('小狗')
const pig1: Pig = new Pig('小猪')
function getRun (ani:Animal) {
ani.run()
}
getRun(dog1) // 可以运行
// 这里表明,getRun虽然只接受Animal类型的对象,但是,子类也算Animal类型的对象
public private protected readonly
描述类中的成员属性的可访问性
readonly 只读属性不能在外部修改
class Person {
// 本来Person没有定义name成员属性
// 但是加上readonly后, name变成了成员变量
// 当然,换成其他的修饰符也是可以的
constructor (readonly name: string = 'bob') {
this.name = name
}
}
存储器 getter setter
class Name {
firstName: string,
lastName: string
get fullName() {
// 此时已经在类中添加了一个成员
return this.firstName + '_' + this.lastName
}
set fullName(val) {
let names = val.split('_')
this.firstName = names[0]
this.lastNmae = names[1]
}
// 如果只有get 没有set 那么它就是一个只读成员属性
// 如果只有set 没有get 那么它就是一个只存成员属性
}
静态属性
在类中使用 static 修饰
使用类名. 的方式获取值
class Person {
static name: string,
constructor(name: string) {
// 这里的this指向实例,不能调用静态成员,会报错
this.name = name
}
sayHi () {
console.log('你好')
}
}
// 想要得到name就要 Person.name 存取,方法同理
// static不能用来修饰构造函数
抽象类
没有具体实现
不能被实例化
关键字: abstract
// 抽象类
abstract class Animal {
// 抽象方法
abstract eat ()
// 实例方法
sayHi() {
console.log('1')
}
}
// 定义一个继承抽象类的子类
class Dog extends Animal {
// 子类必须实现抽象类的方法
eat() {
conlose.log('111')
}
// sayHi就不是必须实现的
}
const dog:Dog = new Dog()
dog.eat()
// 这里调用的是父类实例方法
dog.sayHi()
函数
标明参数类型,返回值类型
// 两种写法
function (name: string):string {
}
const add:(x: number, y: number)=>number = function(x: number, y: number): number {
return x + y
}
可选参数和默认参数,剩余参数
可选参数: 加问号 ----> name?:string
默认参数: 加初始值 --> name:string='王'
剩余参数:剩余参数放在了一个字符串数组里面,放在所有参数最后 --> ...args:string[]
函数重写
function add(x:number, y: number): number {
return x + y
}
function add(x: string, y: string): string{
return x + y
}
这样,两个不同的参数就用相同方法名实现了
泛型
定义接口,函数,类的时候不能确定传入数据的类型,使用的时候才能确定的类型
不确定时,如果使用any, 那么会导致丢失了传入数据的信息,例如:数据的类型
使用泛型:
function getArr<T>(value:<T>, count: number):T {
const arr: Array[T] = []
}
const arr1 = getArr<string>() // <> 里面写的什么,T就是什么, 不写也行
多个泛型参数的函数
function getMsg<k,V>(value: K, value2: V): [K, V] {
}
声明文件
引入第三方库使用
declare var jQuery : (selector:string) => any