js基础——继承
1、实现继承:原型链
function extend1() {//父类型
this.name = "张三";
}
function extend2(){ //子类型
this.age =18;
}
extend2.prototype = new extend1();//extend2继承了extend1中的属性
(父类型的实例化对象赋值给子类型的原型属性,父类型中的构造函数和原型信息都会给extend2)
var _extend1 = new extend2();
console.log(_extend1.name);//张三
console.log(_extend1.age);//18
function extend3() {
this.address = "重庆";
}
extend3.prototype = new extend2();//extend3继承了extend1和extend2
var _extend2 = new extend3();
console.log(_extend2.name);//张三
console.log(_extend2.age);//18
console.log(_extend2.address);//重庆
extend1.prptotype.name = "lucy";
var _extend1 = new extend1();
console.log(_extend1.name);//张三 就近原则,现在实例里面找,有就返回,没有才去原型里面找
子类型从属于自己或他的超类型(父类型)
alert(_extend2.instanceof Object);//true
alert(_extend2.instanceof extend2);//true
alert(_extend2.instanceof extend1);//true
2、组合继承
function Group1(age) {
this.name = ["Linda",'Bob','Lucy','Anna'];
this.age = 25;
}
构造函数里的方法放在构造里每次实例化都会分配一个内存地址(浪费),放在原型里保证每次实例化都只有一个引用地址:
Group1.prototype.run = function () {
return this.name + ',' + this.age;
}
function Group2(age) {
Group1.call(this,age);//对象冒充只能继承构造实例中的,不能继承原型中的信息
}
Group2.prototype = new Group1();//原型链继承,否则原型里的run方法是访问不到的
var _group1 = new Group2(20);
console.log(_group1.run());
3、原型式继承
1. 临时中转函数
function obj (o) {//o表示杨要穿ID进的一个对象
function F(){};//F构造函数是一个临时新建的对象,用于存储传过来的对象
F.prototype = o; //jiango对象实例赋值给F构造函数的原型对象
return new F(); //返回这个得到传递过来对象的对象实例
}
2. 字面量的声明方式(相当于 var box = new Box();)
var box= {
name:"Lucy",
age :100
}
F.prototype = 0;//
var box1 = obj(box);box1就等于 new F();
alert(box1.name);//lucy
4、寄生式继承=原型式+工厂模式
1. 临时中转函数
function obj (o) {//o表示杨要穿ID进的一个对象
function F(){};//F构造函数是一个临时新建的对象,用于存储传过来的对象
F.prototype = o; //jiango对象实例赋值给F构造函数的原型对象
return new F(); //返回这个得到传递过来对象的对象实例
}
//寄生函数
function create(o){
var f = obj(o);
f.run = function(){
return this.name + "方法";
}
return f;
}
var box= {
name:"Lucy",
age :100
}
var box1 = create(box);
alert(box1.run());//lucy方法
5、寄生式组合继承(最终完美版本)
1. 临时中转函数
function obj (o) {//o表示杨要穿ID进的一个对象
function F(){};//F构造函数是一个临时新建的对象,用于存储传过来的对象
F.prototype = o; //jiango对象实例赋值给F构造函数的原型对象
return new F(); //返回这个得到传递过来对象的对象实例
}
2.寄生函数
function create(box,desk){
var f = obj(box.prototype);
desk.prototype = f;
return f;
}
3.构造函数
function Box(name,age){
this.name = name;
this.age = age;
]
4.原型式方法
Box.prototypr.run = function(){
return this.name + this.age + "运行中..."
}
5.对象冒充
function Desk(name,age){
Box.call(this,name,age);
}
6.通过寄生组合继承来实现继承
create(Box,Desk);//用于替代 Desk.prototype = new Box();
本文来自博客园,作者:小虾米吖~,转载请注明原文链接:https://www.cnblogs.com/LindaBlog/p/10984189.html
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
· 理解Rust引用及其生命周期标识(上)
· 浏览器原生「磁吸」效果!Anchor Positioning 锚点定位神器解析
· 没有源码,如何修改代码逻辑?
· 全程不用写代码,我用AI程序员写了一个飞机大战
· MongoDB 8.0这个新功能碉堡了,比商业数据库还牛
· 记一次.NET内存居高不下排查解决与启示
· 白话解读 Dapr 1.15:你的「微服务管家」又秀新绝活了
· DeepSeek 开源周回顾「GitHub 热点速览」