js继承的实现(es5)
function Super(name){
this.name=name;
this.age=;
this.array=[,,];
this.obj={a:'prop'};
this.say=function(){
console.log(this.name);
}
}
Super.prototype.testInherit=function(){
console.log('I am method of super prototype')
}
child1.testInherit();
function Child1(name){
Super.apply(this,arguments);
this.name=name;
this.sayName=function(){
console.log(this.name);
}
}
var parent=new Super('lucy');
var child1=new Child1('jack');
var child1=new Child1('jack2');
console.log(parent,child1);
console.log(child1.__proto__===Child1.prototype,child1 instanceof Super);//true flase
child1.array.push();
console.log(child1.array,child2.array,s1.array,);
child1.testInherit();
function Child2(name){
this.name=name;
this.sayName=function(){
console.log(this.name);
}
}
var parent=new Super('lucy');
Child2.prototype=parent;
var child1=new Child2('jack');
var child2=new Child2('jack2');
child1.array.push();
child1.obj.b="prop2";
console.log(child1.array,child2.array,child1.obj,child2.obj);
console.log(child1.constructor);
function Child3(name){
Super.apply(this,arguments);
this.name=name;
}
var parent=new Super('lucy');
Child3.prototype=parent;
var child1=new Child3('jack');
var child2=new Child3('jack2');
child1.array.push();
console.log(child1.array,child2.array);
console.log(child1.constructor);
function Child4(name){
Super.apply(this,arguments);
this.test=;
}
Child4.prototype=Super.prototype;//改进父类构造函数调用两次问题
Child4.prototype.constructor=Child4;
var child1=new Child4('bob');
var child2=new Child4('bob2');
console.log(child1.__proto__===Child4.prototype);
console.log(child1.__proto__.constructor,'\n',Child4.prototype.constructor,'\n',Super.prototype.constructor);
console.log(Super.prototype.constructor); //这种方法改变了父类的构造函数
for(var itm in Child4.prototype){
console.log(itm);
}
// 或者使用Object.create()创建一个过渡对象--这样子类重新定义构造函数,就能使父类和子类各有自己的构造函数
function Child5(name){
Super.apply(this,arguments);
this.test=;
} Child5.prototype=Object.create(Super.prototype);
Child5.prototype.constructor=Child5;
Object.defineProperty(Child5.prototype,'constructor',{//Child5的原型是一个实例对象,所以显示的定义constructor会改变其不可枚举的特性,这里修正一下
enumerable:false
});
var child=new Child5('end');
console.log(Child5.prototype.constructor,Super.prototype.constructor);
console.log(child instanceof Child5,child instanceof Super);
console.log(child.constructor,Child5.prototype.isPrototypeOf(child),Super.prototype.isPrototypeOf(child));
for(var itm in Child5.prototype){
console.log(itm);
}
function inheritProperty(sup,child){
function F(){};
F.prototype=sup.prototype;
var inner=new F();
inner.constructor=child;
child.prototype=inner;
Object.defineProperty(child.prototype,'constructor',{
enumerable:false
});
}
function Child6(name){
this.age=;
this.name=name;
}
inheritProperty(Super,Child6);
Child6.prototype.sayAge=function(){
return this.age;
}
var child=new Child6('end');
console.log(child.constructor);
console.log(Child6.prototype.constructor);
console.log(child.sayAge());
以上继承都是以1,2为基础的,具体说实现继承的方式就这两种,其他只是对这两种的组合改造优化
js继承的实现(es5)的更多相关文章
- js继承精益求精之寄生式组合继承
一.混合/组合继承的不足 上一篇JS继承终于混合继承,认真思考一下,发现其还是有不足之处的: 空间上的冗余:在使用原型链的方法继承父类的原型属性(Animal.prototype)的同时,也在子类的原 ...
- JS--我发现,原来你是这样的JS:面向对象编程OOP[3]--(JS继承)
一.面向对象编程(继承) 这篇博客是面向对象编程的第三篇,JS继承.继承顾名思义,就是获取父辈的各种"财产"(属性和方法). 怎么实现继承? 我们的JavaScript比较特别了, ...
- JS继承的一些见解
JS继承的一些见解 js在es6之前的继承是五花八门的.而且要在项目中灵活运用面向对象写法也是有点别扭,更多的时候还是觉得面向过程的写法更为简单,效率也高.久而久之对js的继承每隔一段时间就会理解出现 ...
- js继承(自备水,这非常干货)
讲js继承之前,想一想什么是继承? 生活中有很多例子,比方说继承财产,继承女朋友的前男友的前女友 ヽ(ー_ー)ノ ,这些和js继承差不多,但是有一个不一样的地方,就是继承过后,原先的人就没有了,js继 ...
- 一篇文章理解JS继承——原型链/构造函数/组合/原型式/寄生式/寄生组合/Class extends
说实在话,以前我只需要知道"寄生组合继承"是最好的,有个祖传代码模版用就行.最近因为一些事情,几个星期以来一直心心念念想整理出来.本文以<JavaScript高级程序设计&g ...
- js继承的方式及其优缺点
js继承方法 前因:ECMAScript不支持接口继承,只支持实现继承 一.原型链 概念:每个构造函数都有一个原型对象,原型对象都包含一个指向构造函数的指针,而实例都包含一个指向原型对象的内部指针,让 ...
- 让我们纯手写一个js继承吧
继承在前端逻辑操作中是比较常见的,今天我们就从零开始写一个js的继承方式 在es5中继承实质上是先创建子类的实例对象,然后再将父类的方法添加到this上Parent.call(this),在es6中则 ...
- 简单易懂的JS继承图解
JS继承的实现方式一共有八种.下面我们来一个一个瞅一下.注意️:文章依据个人理解,难免有问题,还望各位及时指出!!!!! 原型链继承 借用构造函数继承 组合继承 原型式继承 寄生继承 寄生组合式继承 ...
- js继承
js继承有5种实现方式: 继承第一种方式:对象冒充 function Parent(username){ this.username = username; this.hello = function ...
- js继承之call,apply和prototype随谈
在js中,call,apply和prototype都可以实现对象的继承,下面我们看一个例子: function FatherObj1() { this.sayhello = "I am jo ...
随机推荐
- 23 DesignPatterns学习笔记:C++语言实现 --- 2.1 Bridge
23 DesignPatterns学习笔记:C++语言实现 --- 2.1 Bridge 2016-07-22 (www.cnblogs.com/icmzn) 模式理解
- android AlertDialog.Builder(Context context)换行
今天无意中发现AlertDialog的 setMessage(String)的换行问题,很多人都说\n可以,不过的却原来就在java里面写好的是可以换行 ,但是如果这个string是在网页或者是其地方 ...
- asp.net——上传图片生成缩略图
上传图片生成缩略图,原图和缩略图地址一样的时候缩略图会把原图覆盖掉 /// <summary> /// 生成缩略图 /// </summary> /// <param n ...
- sql 存储过程带有模糊查询条件
一个简单的存储过程: Create procedure [dbo].[Proc_SeachJob] (@startRecordIndex int, @endRecordIndex int, @seac ...
- C#获取枚举的描述
public enum StatusEnum { /// <summary> /// 运行中 /// </summary> [Description("运行中&quo ...
- Java--下载历史版本登录账户
目前在官网下载低于jdk1.8的java jdk的时候需要登陆,这边分享一个账号,方便下载 2696671285@qq.com 密码:Oracle123 转自-- jdk下载以前版本需要的账号(转) ...
- 【VS2015】故障修复之dep6100,dep6200
问题描述:把uwp程序往手机上(或者往模拟器上)部署时,vs ide提示我错误信息dep6100和dep6200,报告说“连接不到设备”. 这可把我愁坏了,各种方法都不行,最后发现问题出在Hyper- ...
- 在Windows子系统(WSL)中配置开机启动服务
在WSL中跑了一些测试服务 比如 mysql nginx等,但关机后每次都要手动开启甚是吃力,本想着用rc.local来编辑开机启动 ,无奈不支持啊!先看看非WSL环境中是怎么实现的. 在 Ubunt ...
- C语言--第0次作业;
第零次作业 1.你对网络专业或者计算机专业了解是怎样? 在高考之前,我就确定了自己的大学专业将会选择计算机方面.我认为计算机专业就业前景比较好,计算机行业发展也非常快,学科实践与创新能力也比较强,在当 ...
- Python3.5 学习七
心灵鸡汤 好书推荐:消费者行为学.围城.活着.盲井.三体.北京折叠 静态方法: @staticmethod #名义上归类管,和类没什么关系,只是引用用"." 在静态方法中,无法访问 ...