js继承——到继承结束
说到继承,其它语言里可能有两种: 接口继承是继承方法签名,而实现继承则继承实际方法。ES函数没有签名,不能实现接口继承,只支持实现继承,而实现继承主要依靠原型链。(这两句话,说来轻松,理解来不易,且行且珍惜吧~)。
所以,理解原型链是掌握继承的必要条件。一个原型对象等与另一个类型的实例
function Parent(){
this.super = "parent";
this.friends = ["A", "B", "C"];
}
Parent.prototype.getParentValue = function(){
return this.super;
}
function Child(){
this.sub = "Child";
}
Child.prototype = new Parent();
Child.prototype.getChildValue = function(){
return this.sub;
}
var c1= new Child();
c1.getParentValue(); //"parent"
c1.getChildValue(); //"Child"
c1.constructor === Parent; //true
c1.constructor === Child; //false
var c2= new Child();
c2.friends.push("D");
c2.friends //["A", "B", "C", "D"]
c1.friends //["A", "B", "C", "D"]
为什么demo.constructor ===Parent;呢? 因为demo.prototype指向Parent实例,而Parent.prototype.constructor指向Parent,因此demo.constructor继承自 Parent.prototype,所以指向Parent;
使用原型练实现继承:说明:不能用对象字面量创建原型方法,因为这样会重写原型链。
缺点:1.引用类型值的原型属性会被所有实例共享,因此在构造函数中定义属性,但通过原型继承时,一个类型的实例会变成另一个对象的原型。因此实例中的属性就变成了现在的原型的属性了。2.没有办法在不影响所有对象的情况下,向超类型传参。
为了解决引用类型带来的问题——>借用构造函数(伪造对象、经典继承 ):在子类型构造函数的内部调用超类型构造函数
function Parent(){
this.friends = ["A", "B", "C"];
}
function Child(){
Parent.call(this);
this.age = 23;
}
var c1 = new Child();
var c2 = new Child();
c1.friends.push("D");
c1.friends //["A", "B", "C", "D"]
c2.friends //["A", "B", "C"]
c2.age //
借用构造函数的缺点:无法避免构造函数模式的缺点,方法不能复用,而且超类原型中的方法,对于子类型是不可见的,所以只能统一使用构造函数模式。
为了避免这些缺点——>组合继承(伪经典继承):使用原型链实现对原型属性和方法的继承,而通过构造函数实现对实例属性的继承
function Parent(name){
this.name = name || "parent";
this.friends = ["A", "B", "C"];
}
Parent.prototype.sayName = function (){
return this.name;
}
function Child(name, age){
Parent.call(this, name);
this.age = age;
}
Child.prototype = new Parent();
var c1 = new Child("Tom", 34);
var c2 = new Child("Joe", 22);
c1.friends.push("D");
c2.friends //["A", "B", "C"]
c1.sayName(); //"Tom"
组合继承避免了原型链和借用构造函数的缺陷,融合了它们的优点。成为js中最常用的继承模式。
此外还有几种继承模式——>原型式继承:借用原型基于已有的对象创建新的对象,同时还不必因此创建自定义类型。
function object(o){
function F(){}
F.prototype = o;
return new F();
}
var person = {
name: "Tom",
friends: ["A", "B", "C"]
};
var p1= object(person);
p1.name = "Marry";
p1.friends.push("D");
var p2 = object(person);
p2.name = "Joe";
p2.friends.push("E");
person.friends //["A", "B", "C", "D", "E"]
object()函数中创建了一个临时构造函数,并将传入的对象作为该构造函数的原型。相当于进行一次浅复制。和原型模式一样,引用类型始终会被共享。其中ES5定义了Object.create()方法规范了原型继承。
因此,在没必要兴师动众的创建构造函数,而只想让一个对象与另一个对象保持类似的情况下,原型式模式是个不错的选择。
——>寄生式继承:与原型式继承紧密相关的一种思路,与寄生构造函数和工厂模式类似,即创建一个封装继承过程的函数,该函数在内部以某种方式来增强对象。
function createAnother(o){
var clone = object(o);
clone.sayHi = function(){
return "HI";
};
return clone;
}
var person = {
name: "Tom",
friends: ["A", "B", "C"]
};
var p = createAnother(person);
p.sayHi() //"HI"
在主要考虑对象而不是自定义类型和构造函数的情况下,寄生式也是一种有用的模式,object()非必须,任何能返回新对象的函数都适用于此模式
组合模式是最常用的继承模式,但是组合模式两次调用超类型构造函数,
为了解决这个问题——>寄生组合模式:使用构造函数继承属性,通过原型链的混成形式继承方法;不必为了指定子类型的原型而调用超类型的构造函数,我们可以使用寄生式继承继承超类型的原型,然后再将结果指定给子类型的原型。
function inheritPrototype(C, P){
var prototype = object(P.prototype);
prototype.constructor = C;
C.prototype = prototype;
}
function Parent(name){
this.name = name || "parent";
this.friends = ["A", "B", "C"];
}
Parent.prototype.sayName = function (){
return this.name;
}
function Child(name, age){
Parent.call(this, name);
this.age = age;
}
inheritPrototype(Child, Parent);
Child.prototype.sayAge = function(){
return this.age;
};
组合继承模式:集寄生模式和组合模式优点于一身,是实现基于类型继承最有效最理想的方式。
js继承——到继承结束的更多相关文章
- js面向对象之继承那点事儿根本就不是事
继承 说道这个继承,了解object-oriented的朋友都知道,大多oo语言都有两种,一种是接口继承(只继承方法签名):一种是实现继承(继承实际的方法) 奈何js中没有签名,因而只有实现继承,而且 ...
- js对象的继承以及公有私有属性的定义和读写
最近想写一些js工具,有些方面需要用到面向对象的方法,比如继承父类属性和方法.通过私有化隐藏某些对象的属性等,因为没有系统的学习js,所以不知道怎么做,觉得很伤脑筋. 今天受到技术群里朋友的提示,并查 ...
- 浅谈JS中的继承
前言 JS 是没有继承的,不过可以曲线救国,利用构造函数.原型等方法实现继承的功能. var o=new Object(); 其实用构造函数实例化一个对象,就是继承,这里可以使用Object中的所有属 ...
- web前端开发必懂之一:JS继承和继承基础总结
首先,推荐一篇博客豪情的博客JS提高: http://www.cnblogs.com/jikey/p/3604459.html ,里面的链接全是精华, 一般人我不告诉他; 我们会先从JS的基本的设计模 ...
- js如何实现继承
js继承有5种实现方式:1.继承第一种方式:对象冒充 function Parent(username){ this.username = username; this.hello = ...
- JS创建对象、继承原型、ES6中class继承
面向对象编程:java中对象的两个基本概念:1.类:类是对象的模板,比如说Leader 这个是泛称领导,并不特指谁.2:实例:实例是根据类创建的对象,根据类Leader可以创建出很多实例:liyi,y ...
- js最好的继承机制:用对象冒充继承构造函数的属性,用原型prototype继承对象的方法。
js最好的继承机制:用对象冒充继承构造函数的属性,用原型prototype继承对象的方法. function ClassA(sColor) { this.color = sColor; } Class ...
- js模拟实现继承功能
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...
- js原生设计模式——2面向对象编程之继承—原型继承(类式继承的封装)
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8&qu ...
随机推荐
- 配置Tomcat、maven远程部署调试总结。
注意:可以搞两个环境,一个本地tomcat 一个服务器上的tomcat ,然后都采用如下配置.这样就可以 在本地调试,调试好后,再发布到服务器端.非常方便. ==================== ...
- HDU 2053 Switch Game(开灯问题,完全平方数)
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=2053 题目大意:灯开始是关着的,有n盏灯,i从1数到n每当灯的序号是i的倍数的时候就对灯进行一次操作( ...
- gtk+学习笔记(三)
gtk感觉函数好多,需要记好多函数,还是多练习,多总结,今天写了一个登陆窗口,很简单,主要是为了加深对这些东西的记忆,直接贴代码 #include<gtk/gtk.h> static Gt ...
- <<Javascript Patterns>>阅读笔记 -- 第2章 基本技巧(一)
第一次写这种东西, 有些生涩和蹩脚, 也是为了自己在表达或是总结方面有所提高, 同时为看过的东西留个痕迹, 以便日后查阅. 有错误或是不妥的地方, 还望各位指正, 谢谢! 第1章 简介 本章主要介绍了 ...
- out与ref修饰符
out修饰符 定义 作用 使用注意 总结 定义 out意为output,所以被out修饰的参数叫做输出参数. 通过使用out修饰的参数,方法可以返回对应参数的值 作用 先看一个例子 定义变量: ...
- ref:mysql丢失密码,如何修改?
ref:https://www.linuxidc.com/Linux/2007-05/4338.htm mysql“Access denied for user 'root'@'localhost'” ...
- Codeforces 980 D. Perfect Groups
\(>Codeforces\space980 D. Perfect Groups<\) 题目大意 : 设 \(F(S)\) 表示在集合\(S\)中把元素划分成若干组,使得每组内元素两两相乘 ...
- luoguP4320 道路相遇 圆方树
标题已经告诉你怎么做了..... 两点间的圆点个数即为所求 建出圆方树后打个树剖求$lca$就行..... 复杂度$O(n + q \log n)$ #include <cstdio> # ...
- [BZOJ4826][HNOI2017]影魔(主席树)
4826: [Hnoi2017]影魔 Time Limit: 20 Sec Memory Limit: 512 MBSubmit: 669 Solved: 384[Submit][Status][ ...
- Ubuntu14.04 安装中文输入法
1 安装fcitx sudo apt-get install fcitx-table-py 这里py是拼音的意思,安装关依赖库和框架都会自动安装 2 把Ubuntu的系统环境改成中文 ...