JavaScript中实现继承
今天即兴研究了下JS,查阅了相关资料 ,发现Js中没有"子类"和"父类"的概念,也没有"类"(class)和"实例"(instance)的区分,全靠一种很奇特的"原型链"(prototype chain)模式,来实现继承。下面大概介绍一下Js中五种继承模式!
1、构造函数绑定:使用apply或是call
function Animal() {
this.species = "动物";
}
function Cat(name, color) {
//Animal.apply(this, arguments);
//Animal.call(this);
this.color = color;
this.name = name;
}
var cat1 = new Cat("cat1", "white");
alert(cat1.species);
2、prototype模式
Cat.prototype = new Animal();
//任何一个prototype对象都有一个constructor属性,指向它的构造函数.
Cat.prototype.constructor = Cat;
var cat1 = new Cat("大毛", "黄色");
alert(cat1.species); // 动物 //直接继承prototype 优点是效率比较高(不用执行和建立Animal的实例了),比较省内存。缺点是 Cat.prototype和Animal.prototype现在指向了同一个对象,那么任何对
Cat.prototype的修改,都会反映到Animal.prototype。
function Animal() { }
Animal.prototype.species = "动物";
Cat.prototype = Animal.prototype;
Cat.prototype.constructor = Cat;
3、利用空对象作为中介 F是空对象,所以几乎不占内存。这时,修改Cat的prototype对象,就不会影响到Animal的prototype对象。
var F = function () { };
F.prototype = Animal.prototype;
Cat.prototype = new F();
Cat.prototype.constructor = Cat;
//对上面封装
function extend(Child, Parent) {
var F = function () { };
F.prototype = Parent.prototype;
Child.prototype = new F();
Child.prototype.constructor = Child;
Child.uber = Parent.prototype; //可以直接调用父对象的方法
}
extend(Cat, Animal);
var cat1 = new Cat("大毛", "黄色");
alert(cat1.species); // 动物
4、拷贝继承
function extend2(Child, Parent) {
var p = Parent.prototype;
var c = Child.prototype;
for (var i in p) {
c[i] = p[i];
}
c.uber = p;
}
5、 原型式继承
//clone()函数用来创建新的类Person对象
var clone = function (obj) {
var _f = function () {
};
//这句是原型式继承最核心的地方,函数的原型对象为对象字面量
_f.prototype = obj;
return new _f;
};
//先声明一个对象字面量 var Person = {
name: 'Darren',
getName: function () {
return this.name;
}
};
//不需要定义一个Person的子类,只要执行一次克隆即可
var Programmer = clone(Person);
//可以直接获得Person提供的默认值,也可以添加或者修改属性和方法
alert(Programmer.getName());
Programmer.name = 'Darren2';
alert(Programmer.getName());
//声明子类,执行一次克隆即可
var Someone = clone(Programmer);
初步接触Javascript感觉挺简单,可是当我慢慢的深入其中,发现Javascript其实也是一门很复杂的语言!只有慢慢的深入了!
JavaScript中实现继承的更多相关文章
- JavaScript学习13 JavaScript中的继承
JavaScript学习13 JavaScript中的继承 继承第一种方式:对象冒充 <script type="text/javascript"> //继承第一种方式 ...
- 浅谈JavaScript中的继承
引言 在JavaScript中,实现继承的主要方式是通过原型链技术.这一篇文章我们就通过介绍JavaScript中实现继承的几种方式来慢慢领会JavaScript中继承实现的点点滴滴. 原型链介绍 原 ...
- JavaScript中的继承(原型链)
一.原型链 ECMAScript中将原型链作为实现继承的主要方法,基本思想是利用原型让一个引用类型继承另一个引用类型的属性和方法. 实例1: function SupType() { this.pro ...
- 彻底搞懂JavaScript中的继承
你应该知道,JavaScript是一门基于原型链的语言,而我们今天的主题 -- "继承"就和"原型链"这一概念息息相关.甚至可以说,所谓的"原型链&q ...
- 浅谈 JavaScript 中的继承模式
最近在读一本设计模式的书,书中的开头部分就讲了一下 JavaScript 中的继承,阅读之后写下了这篇博客作为笔记.毕竟好记性不如烂笔头. JavaScript 是一门面向对象的语言,但是 ES6 之 ...
- 关于JavaScript中实现继承,及prototype属性
感谢Mozilla 让我弄懂继承. JavaScript有八种基本类型,函数属于object.所以所有函数都继承自object.//扩展:对象,基本上 JavaScript 里的任何东西都是对象,而且 ...
- javascript中各种继承方式的优缺点
javascript中实现继承的方式有很多种,一般都是通过原型链和构造函数来实现.下面对各种实现方式进行分析,总结各自的优缺点. 一 原型继承 let Super = functioin(name = ...
- javascript中实现继承的几种方式
javascript中实现继承的几种方式 1.借用构造函数实现继承 function Parent1(){ this.name = "parent1" } function Chi ...
- 深入理解JavaScript中的继承
1前言 继承是JavaScript中的重要概念,可以说要学好JavaScript,必须搞清楚JavaScript中的继承.我最开始是通过看视频听培训班的老师讲解的JavaScript中的继承,当时看的 ...
- javascript 中的继承实现, call,apply,prototype,构造函数
javascript中继承可以通过call.apply.protoperty实现 1.call call的含义: foo.call(thisObject, args...) 表示函数foo调用的时候, ...
随机推荐
- Shell 括号辨识(转http://blog.csdn.net/taiyang1987912/article/details/39551385)
一.小括号,圆括号() 1.单小括号 () ①命令组.括号中的命令将会新开一个子shell顺序执行,所以括号中的变量不能够被脚本余下的部分使用.括号中多个命令之间用分号隔开,最后一个命令可以没有 ...
- 手游LTV(用户终生价值)计算公式
在承接APP推广项目中,手游价值变现最直接,核心是获取更多的充值,其中LTV(Lifetime-Value生命周期价值)是一个重要参考指标,可以理解为玩家在其生命周期内对游戏的平均贡献值,为什么要计算 ...
- POJ 2484 A Funny Game [博弈]
题意:n枚硬币围成一个圈,每次每个人可以从中取走一枚或者相邻的两枚(如果两枚硬币原本中间隔着一枚硬币,后来被取走,这两枚硬币不算相邻).谁取走最后一枚硬币谁就赢了. 思路:我们可以找找规律. 首先,n ...
- 2016北京集训测试赛(十六)Problem C: ball
Solution 这是一道好题. 考虑球体的体积是怎么计算的: 我们令\(f_k(r)\)表示\(x\)维单位球的体积, 则 \[ f_k(1) = \int_{-1}^1 f_{k - 1}(\sq ...
- BZOJ 3029 守卫者的挑战
题面 Description 打开了黑魔法师Vani的大门,队员们在迷宫般的路上漫无目的地搜寻着关押applepi的监狱的所在地.突然,眼前一道亮光闪过."我,Nizem,是黑魔法圣殿的守卫 ...
- 全面了解Nginx主要应用场景
http://www.raye.wang/2017/02/24/quan-mian-liao-jie-nginxdao-di-neng-zuo-shi-yao/
- 开篇有益:为什么选择MongoDB?
为啥用MongoDB? 赶NoSQL时髦? Auto-shard等激动人心的特性? •No! 08年,还都是浮云. 最初的想法是寻找一个可靠的分布式K/V解决MySQL的问题. NoSQL(NoSQL ...
- PHP实现RabbitMQ的Publish/Subscribe
<?php /** * Created by PhpStorm. * User: 豆腐居士 * Date: 2018/5/30 * Time: 上午11:01 */ class AqiTask ...
- ios notification
apps can use local or push notifications to let people know when interesting things happen, such as: ...
- 规划设计系列3 | SketchUp+实景三维,方案现状一起看
将SketchUp中建立的模型与实景三维模型进行集成,既可以充分发挥实景三维在地理空间记录方面的优势,又可以去除SketchUp在周边环境设计上的不足. 同时借助Wish3D Earth丰富的场景浏览 ...