前端TS学习第四天

最新推荐文章于 2024-10-17 09:40:47 发布

浪迹天涯~~

最新推荐文章于 2024-10-17 09:40:47 发布

阅读量347

点赞数 7

文章标签：前端学习

本文链接：https://blog.csdn.net/weixin_43957609/article/details/135767660

版权

本文详细介绍了JavaScript的原型和原型继承，包括ES5中的继承方式，如Vechile和Car类的实例化与子类Bus的创建。同时，探讨了TypeScript中的类继承、构造函数重定向和tsconfig.json配置，展示了如何在多级目录下使用TypeScript进行项目编译。

摘要由CSDN通过智能技术生成

TS相关的必要JS技能

JS的原型和原型继承

ES5原型继承：

function Vechile(brandNo,price){
	//父类
	this.brandNo = brandNo	//品牌
	this.price = price	//价格
}
Vechile.prototype.sale = function(){
	console.log(this+"销售")
}
function Car(brandNo,price,types){
	Vechile.call(this,brandNo,price)
	this.type= type
}//子类
//继承
function Bus(brandNo,price,seatNo){
	//子类
	//Vechile.apply(this,[brandNo,price])//借用构造函数继承
	Vechile.call(this,brandNo,price)
	this.seatNo = seatNo
}
//借用一个中间对象，它叫做寄生式组合继承
function protoExtendsWithMdl(ParentClass,SonClass){
	function Middle(){
		this.constructor = SonClass
	}
	Middle.prototype = ParentClass.prototype
}

protoExtendsWithMdl(Vechile,Bus)

Bus.prototype = new Vechile()//或者原型链继承
Bus.prototype.constructor = Bus//构造函数再指回去
let bus = new Bus("大巴",20,64)
bus.sale()

export{}

深入继承

class Pay{
	constructor(bank_card_no:string,balance:number,cost:number,tokenid:string){}
	//支付父类
	bank_card_no:string//捆绑银行卡号
	balance:number//银行卡余额
	cost:number//消费费用
	tokenid:string//登录后用户访问令牌
	pay(){}
}
emum PayType{
	WebChat = 1,
	AliPay = 2,
	CloudFlashPayment = 3,
}
class ATMPay extends Pay{
	bank_network:string//银行网点
	bankno_type//银行卡类型
	bank_card_psw//银行卡密码
	custname//顾客姓名
}

class MobilePay extends Pay{	constructor(bank_card_no:string,balance:number,cost:number,tokenid:string,type:PayType,change:number,openid:string,appid:string){
	super(bank_card_no,balance,cost,tokenid);
	this.type=type
	this.change=change;
	this.opendid=openid;
	this.appid=appid
	}
	type: PayType
	change: number //支付平台零钱
	opendid:string //用户识别身份id
	appid:string //微信小程序 appid
}
class MobilePay{
	type: PayType
	change: number //支付平台零钱
	opendid:string //用户识别身份id
	appid:string //微信小程序 appid
	//...
}

export{}