我的上一篇随笔中写了有关原型继承的,下面介绍几种更加有用的。
借用构造函数
在解决原型中关于引用类型值所带来的问题,开发人员开始使用一种叫做借用构造函数。
基本思想:
在子类型构造函数的内部调用超类型的构造函数,这种类型java里面的继承。
函数只不过是特定执行环境中执行代码的对象,因此通过使用apply和call方法也可以在新创建的对象上执行构造函数。
function SuperType(){
this.colors = ["red","blue","green"];
}
function SubType(){
//继承SuperType
SuperType.call(this);//在新SubType对象上执行SuperType函数定义的所有对象初始化代码,所以SubType的每个实例就会有自己的colors属性的副本了
}
var instance1 = new SubType();
instance1.colors.push("black");
alert(instance1.colors);//"red","blue","green","black"
var instance2 = new SubType();
alert(instance2.colors);//"red","blue","green"
借用构造函数的问题
1.方法都在构造函数中定义,因此函数就无从复用了。
2.在超类型的原型中定义的方法,对子类型而言也是不可见的。
考虑到这些问题,借用构造函数的技术也是很少见的。
组合继承
将原型链和借用构造函数的技术组合在一起。其背后的思路是使用原型链实现对原型属性和方法的继承,而通过借用构造函数来实现对实例属性的继承。
这样通过在原型上定义方法也实现了函数复用,又能保证每个实例都有自己的属性。
function SuperType(name){
this.name = name;
this.colors = ["red","blue","green"];
}
SuperType.prototype.sayName = function(){
alert(this.name);
};
function SubType(name,age){
//使用借用构造函数
SuperType.call(this,name);
this.age = age;
}
//继承方法(原型继承)
SubType.prototype = new SuperType();
SubType.prototype.constructor = SubType;
SubType.prototype.sayAge = function(){
alert(this.age);
}
Object.create()方法
规范了原型式继承。这个方法接受一个用作新对象原型的对象和(可选的)一个为新对象定义额外属性的对象。
寄生式继承
寄生组合式继承
最后两个继承不是很清楚,等之后看了视频理解更详细再来补充
JavaScript继承方式的更多相关文章
-
JavaScript继承方式详解
原文链接 : http://segmentfault.com/a/1190000002440502 js继承的概念 js里常用的如下两种继承方式: 原型链继承(对象间的继承) 类式继承(构造函数间的继 ...
-
JavaScript继承方式详解[转]
js继承的概念 js里常用的如下两种继承方式: 原型链继承(对象间的继承) 类式继承(构造函数间的继承) 由于js不像java那样是真正面向对象的语言,js是基于对象的,它没有类的概念.所以,要想实现 ...
-
JavaScript 继承方式详解
js继承的概念 js里常用的如下两种继承方式: 原型链继承(对象间的继承)类式继承(构造函数间的继承) 由于js不像java那样是真正面向对象的语言,js是基于对象的,它没有类的概念.所以,要想实现继 ...
-
JavaScript 继承方式的实现
1.原型链继承 function superType(name){ this.name= 'milk'; } super.prototype.sayName=function(){ console.l ...
-
Javascript的四种继承方式
在Javascript中,所有开发者定义的类都可以作为基类,但出于安全性考虑,本地类和宿主类不能作为基类,这样可以防止公用访问编译过的浏览器级的代码,因为这些代码可以被用于恶意攻击. 选定基类后,就可 ...
-
JavaScript之四种继承方式讲解
在Javascript中,所有开发者定义的类都可以作为基类,但出于安全性考虑,本地类和宿主类不能作为基类,这样可以防止公用访问编译过的浏览器级的代码,因为这些代码可以被用于恶意攻击. 选定基类后,就可 ...
-
总结javascript继承的两种方式的N中写法
最近翻看博客园,总结了一下javascript的继承方式:prototype和copy继承方式. 一.prototype方式 当一个函数被创建时,Function构造函数产生的函数会隐式的被赋予一个p ...
-
JavaScript中的几种继承方式对比
转自:http://blog.csdn.net/kkkkkxiaofei/article/details/46474069 从’严格’意义上说,JavaScript并不是一门真正的面向对象语言.这种说 ...
-
JavaScript各种继承方式和优缺点
好久没写博客啦,嘻嘻,这个月是2017年的最后一个月啦,大家应该都开始忙着写年终总结了吧,嘻嘻,小颖今天给大家分享下Javascript中的几种继承方式以及他们的优缺点. 1.借助构造函数实现继承 原 ...
随机推荐
-
【转】[教程]在 win7 / win8 下安装苹果系统 (懒人版)
前言 这篇安装教程的素材在国庆就准备好了,但那时学习任务比较重,没有时间发帖,一直拖到现在.趁这个周末有空,赶紧写完它,希望能帮助一些景友. 论坛已经有不少安装教程,如果对这篇安装教程有疑问可以去 ...
-
跟着9张思维导图学习Javascript
学习的道路就是要不断的总结归纳,好记性不如烂笔头,so,下面将 po 出我收集的 9 张 javascript 相关的思维导图(非原创). 思维导图小tips: 思维导图又叫心智图,是表达发射性思维的 ...
-
vim中如何引用自定义模板文件
我们在使用vim新建文件时可以引用自定义模板,来避免重复的数据格式处理花费太多时间. 实现方法很简单,只需要2步即可:1. 在.vim/template目录放入自己的模板文件(如shellconfig ...
-
UML中关系图解
转自http://blog.csdn.net/duran1986/article/details/5573415 最近在教软件工程项目实践,就又仔细了解了下UML中各种关系的意义,虽然有点简单,但是有 ...
-
命令行bash的基础操作
刚进入系统在光标前面会显示这样一串字符[root@centeros ~]# root表示当前的登录用户可以通过id命令查看 centeros表当前的主机名可以通过hostname查看 ~表示当前用户的 ...
-
H5中用js让页面全屏
概述 意外的发现一个网页有一个按钮能使网页全屏,查了下代码发现是H5的全屏api,于是就查了下资料,记录下来供以后开发时参考,相信对其他人也有用. 参考资料: 利用js如何做到让页面全屏和不全屏功能 ...
-
错误:java.io.FileNotFoundException: /storage/emulated/0/Documents/eclipse-inst-win64.exe
在Android服务的最佳实例中:https://www.cnblogs.com/hh8888-log/p/10300972.html,在最后运行的时候,点击Start Download按钮总是会报一 ...
-
crontab 详解
1.crontab文件格式 {minute} {hour} {day-of-month} {month} {day-of-week} {full-path-to-shell-script} ● mi ...
-
Web 应用架构基础课(转载)
Web 应用架构基础课 初级 web 应用开发者必学的基础网络架构概念 web 应用主流架构概览 上图便是我司(Storyblocks)网络架构的很好展现.如果你还没成为经验老道的 web 工程师,可 ...
-
iterm2 学习笔记
itrem 笔记 选中即复制,有两种方式. 在新Tab中自动使用前一Tab路径,该怎么用? 系统热键:option+space 自动完成:输入打头几个字母,然后输入command+“;” iterm2 ...