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 ...
随机推荐
- .NET基础 (11)类型的基类System.Object
类型的基类System.Object1 是否存在不继承自System.Object类型的类2 在System.Object中定义的三个比较方法有何异同3 如何重写GetHashCode方法 类型的基类 ...
- 关于wcf配置未启动net.tcp监控导致无法访问wcf
在服务里面启动NetTcpActivator和NetTcpPortSharing服务
- word复制粘贴表格不齐
1.查找橡皮擦 2.有时候复制粘贴 表格 会将以前的东西格式也粘贴进来,需要清除格式和重新排版 3.word2007清除格式
- Java下的框架编程(反射,泛型,元数据,CGLib,代码动态生成,AOP,动态语言嵌入)
Java 虽然没有动态语言般暴起,但仍然天连天,水接水的生出好多框架技术---反射(reflection),泛型(generics),元数据(annotation),proxies(proxy/cgl ...
- Android-画板
在上一篇博客,Android-图像原理/绘制原理,讲解到绘图原理中,画布 + 画笔
- CSS Animation triggers text rendering change in Safari
薄荷新首页上周五内测,花哥反馈在 MacBook Safari 浏览器下 鼠标移动到第一个商品的时候后面几个商品的文字会加粗.这是什么鬼??? 待我回到家打开笔记本,鼠标蹭蹭蹭的发现问题远不止如此: ...
- InnoDB: The innodb_system data file 'ibdata1' must be writable错误
重新安装percona5.7过程中,启动mysql服务总是报如下的错误 --10T02::.781070Z [ERROR] InnoDB: The innodb_system data file 'i ...
- linux centos 7 下安装ElasticSearch5.4
一. 把elasticsearch-5.4.0.rpm和kibana-5.4.0-x86_64.rpm上传到centos下/root目录中,如下图:二.进入centos目录/root,并用命令rpm ...
- MySQL , MHA , Haproxy 配置
1. 基本架构 2. 读端口影射 3. 写端口影射 进行一个Health Check MHA Manager对Master节点MySQL 进行存活监控 读FailOver 1 读FailOver 2 ...
- QuantLib 金融计算——随机过程之 Heston 过程
目录 QuantLib 金融计算--随机过程之 Heston 过程 Heston 过程 参考文献 如果未做特别说明,文中的程序都是 Python3 代码. QuantLib 金融计算--随机过程之 H ...