javascript的继承方法
一、构造函数继承
该方法最简单,使用call或者apply方法,将父对象的构造函数绑定到子对象上。
function Parent(name){
this.name = name;
this.color = ['red','green'];
this.getInfo = function(){
alert(this.name + '喜欢的颜色:'+ this.color)
}
}
function Child(name){
Parent.call(this,name);
}
var child1 = new Child('张三');
child1.color.push('black');
child1.getInfo();// 张三喜欢的颜色: red,green,black
var child2 = new Child('李四');
child2.getInfo(); // 李四喜欢的颜色: red,green
这样实现有一个弊端,就是每new一次,实例对象的属性和方法都会开辟内存空间,比较浪费内存,缺乏效率。
为了解决内存消耗问题,下面介绍一下原型链继承
二、原型链继承
我们知道每一个构造函数都有一个prototype属性,指向另一个对象。这个对象的所有方法和属性都会被构造函数的实例继承。所以我们可以把不变的属性和方法定义在prototype对象上。
function Parent(name){
this.name = name;
this.color = ['red','green'];
}
//不变的属性或方法定义在prototype上,prototype对象上的方法是共享的, 每次new Parent()时不需要重新开辟内存空间
Parent.prototype.getInfo = function(){
alert(this.name + '喜欢的颜色:'+ this.color)
}
function Child(name){
}
Child.prototype = new Parent();
var child1 = new Child('张三');
child1.color.push('black'); //此操作会改变Parent构造函数的color属性 color值变成[red,green,black]
child1.getInfo(); //undefined喜欢的颜色 : red,green,black
var child2 = new Child('李四');
child2.getInfo();//undefined喜欢的颜色 : red,green,black ,
原型链继承存虽然解决了构造函数消耗内存的问题,但是这种继承方式存在两个问题:
问题1: 创建子类型的实例时,无法向父类构造函数传递参数(例子中:Childh的name参数无法传给Parent中)。
问题2:如果构造行数的属性是引用类型,并且集成后改变了其值,则父构造函数中得值会被更改(例子中的color属性被更改了)
三、混合继承(构造函数和原型结合方式)
借鉴以上两种方式的优缺点,采用构造函数和原型结合方式
function Parent(name){
this.name = name;
this.color = ['red','green'];
}
//不变的属性或方法定义在prototype上,prototype对象上的方法是共享的, 每次new Parent()时不需要重新开辟内存空间
Parent.prototype.getInfo = function(){
alert(this.name + '喜欢的颜色:'+ this.color)
}
function Child(name){
//通过call或者apply实现继承Parent,相当于重新创建了Parent属性的副本
//Parent中的属性会copy出一份,重新开辟内存空间
Parent.call(this,name);
//Parent.apply(this,[name]);
}
Child.prototype = new Parent();
var child1 = new Child('张三');
child1.color.push('black');
child1.getInfo(); //张三喜欢的颜色 : red,green,black
var child2 = new Child('李四');
child2.getInfo();//李四喜欢的颜色 : red,green
javascript的继承方法的更多相关文章
- javaScript面向对象继承方法经典实现
转自原文javaScript面向对象继承方法经典实现 JavaScript的出现已经将近20多年了,但是对这个预言的褒贬还是众说纷纭.很多人都说JavaScript不能算是面向对象的变成语言.但是Ja ...
- JavaScript面向对象继承方法
JavaScript的出现已经将近20多年了,但是对这个预言的褒贬还是众说纷纭.很多人都说JavaScript不能算是面向对象的变成语言.但是JavaScript的类型非常松散,也没有编译器.这样一来 ...
- javascript实现继承3种方式: 原型继承、借用构造函数继承、组合继承,模拟extends方法继承
javascript中实现继承的三种方式:原型继承.借用构造函数继承.混合继承: /* js当中的继承 js中 构造函数 原型对象 实力对象的关系: 1 构造函数.prototype = 原型对象 2 ...
- JavaScript类继承, 用什么方法好
JavaScript类继承, 用什么方法好 一个实例: 基类Car: function Car(color, year) { this.name = "car"; this.col ...
- JavaScript 继承——三种继承方法及其优劣
原文地址 本文内容 目的 继承的第一步--最简单的继承 私有变量/成员和原型 三种继承方式及其优劣 基本的原型继承 Yahoo JavaScript 模块模式 创建闭包的构造函数 三种方法的代码执 ...
- Javascript模拟继承(赠送.net吐槽一段)
首先吐槽一句,今年的就业形势很不乐观啊,特别是搞.net的(相对java),特特别是还没出校门没有正式工作经验的,找个实习很难,前些天接了个面试电话,上来就质疑我“你一个在校大学生怎么可能做了那么多项 ...
- 详解Javascript的继承实现(二)
上文<详解Javascript的继承实现>介绍了一个通用的继承库,基于该库,可以快速构建带继承关系和静态成员的javascript类,好使用也好理解,额外的好处是,如果所有类都用这种库来构 ...
- javascript 中继承实现方式归纳
转载自:http://sentsin.com/web/1109.html 不同于基于类的编程语言,如 C++ 和 Java,javascript 中的继承方式是基于原型的.同时由于 javascrip ...
- JavaScript之继承(原型链)
JavaScript之继承(原型链) 我们知道继承是oo语言中不可缺少的一部分,对于JavaScript也是如此.一般的继承有两种方式:其一,接口继承,只继承方法的签名:其二,实现继承,继承实际的方法 ...
随机推荐
- CRegKey
1.简介 CRegKey提供了对系统注册表的操作方法,通过CRegKey类,可以方便的打开注册表的某个分支或子键(CRegKey::Open),可以方便的修改一个键的键值(CRegKey::SetVa ...
- 07CSS表格
CSS表格 表格边框 如需在 CSS 中设置表格边框,请使用 border 属性. table, th, td { border: 1px solid blue; } 折叠边框 border-coll ...
- MATLAB优化——减少for的使用
Table of Contents 1. MATLAB 2. 矩阵计算--全0行整体替换 MATLAB MATLAB作为一个强大的工具(可惜是收费的),在矩阵运算.绘制函数和数据.实现算法.创建用户界 ...
- SDOI2015约数个数和
题目描述 题解: 有一个式子: 证明先不说了. 然后倒一波反演: 然后整除分块就好了. 代码: #include<cstdio> #include<cstring> #incl ...
- 色码表 Color code table
最近打算更新设计博客页面,需要用到CSS色码表,查了一些资料现转载此处以备以后使用,点击此处查看原文,另外还发现了几个不错的网站: color-hex HTML颜色代码 色碼表 色碼表英文為 Colo ...
- ubuntu 16.4 安装mysql-python
sudo apt-get install python-pip python-dev libmysqlclient-dev pip install MySQL-python
- 10 行 Python 代码,批量压缩图片 500 张,简直太强大了
本文原创并首发于公众号[Python猫],未经授权,请勿转载. 原文地址:https://mp.weixin.qq.com/s/5hpFDgjCpfb0O1Jg-ycACw 熟悉 "Pyth ...
- ECNU 3263 丽娃河的狼人传说 (贪心)
链接:http://acm.ecnu.edu.cn/problem/3263/ 题意: 从 1 到 n 的一条数轴.有 m 个区间至少要安装一定数量的路灯,路灯只能装在整数点上,有k盏路灯已经安装好 ...
- 初入lambda表达式 (主要是c++11)
写一篇不猫的博文吧 定义 lambda表达式的定义如下 [capture](parameters) mutable ->return-type{statement} 翻译成人话就是 1.[cap ...
- 竞赛Noi_Linux使用总结(vim)
刚换完Linux,趁着教练给的改题时间(T2确实猛)自己上网找了好多博客,发现很多跟竞赛有关的内容是碎片化的,从最基本的如何用vim写代码.编译.运行,再到怎么改设置使打代码时手感强一些,最后学对拍, ...