javascript 模式(1)——代码复用
程序的开发离不开代码的复用,通过代码复用可以减少开发和维护成本,在谈及代码复用的时候,会首先想到继承性,但继承并不是解决代码复用的唯一方式,还有其他的复用模式比如对象组合。本节将会讲解多种继承模式以实现代码复用。
- 继承复用-默认模式
- 继承复用-apply函数
- 继承复用-临时构造
继承复用之默认模式:
每个javascript对象都和另一个对象 相关联,而这个对象就是原型(prototype),而原型又可以链接到其他原型行程原型链,如果当前对象不存在类似方法则会沿原型链查找,直到查找为止。继承的默认模式即通过这种原型链的特性实现的。
Person类为基类定义了一些属性和方法
/**
* person 基类
*/
var Person = function () {
this.name = "";
this.age = 0;
this.sex = "";
this.say = function () {
return "my name is" + this.name;
}
} Person.prototype.sayHello = function () {
return "Hello";
}
定义一个空的子函数对象
/**
* 原型继承
*/
var Engineer1 = function () { }
将子对象的原型链中加入父类和父类原型

Engineer1.prototype = new Person();
var enginneer1 = new Engineer1();
enginneer1.name = 'stephen';
console.log(enginneer1.say());
此类继承实现缺点:
不能传递构造的参数:假设person基类中可以接受构造传参,而继承的子类想通过父类构造传递参数则是不可行的。
继承复用-apply函数
apply函数定义:用于调用当前函数functionObject,并可同时使用指定对象thisObj作为本次函数执行时函数内部的this指针引用。通俗的讲,就是将当前函数对象的成员复制到this所引用的函数对象中去。
可以在子类构造中通过apply方法将父类的成员复制到子类中,而且可以通过apply传递参数,而不是绑定原型链,
var Engineer2 = function () {
Person.apply(this);
}
相反由于不是绑定原型链因此如果在父类原型中的方法是不能被继承的 ,如下代码所示
Person.prototype.sayHello = function () {
return "Hello";
}
使用示例
var enginner2 = new Engineer2();
enginner2.name = 'adam';
console.log(enginner2.say());
继承复用-临时构造
上面两种方法各有优劣,但都不完美,默认继承不能传递构造的参数,而通过Apply()函数的构造绑定又不能继承父类原型链的方法,而且有时基类有私有的方法不想被子类继承,以上两种都不能做到。而临时构造函数的方法能得到一个比较完美的解决方案。
首先生成一个临时函数对象,通过原型链共享将临时函数对象的原型链指定为父类原型链(注意这里不是绑定哦),接着将子类的原型链绑定上临时函数的原型链。

var temp = function (){};
temp.prototype = Person.prototype;
Engineer1.prototype = new temp();
var enginner3 = new Engineer1();
enginner3.name = "stphen";
console.log(enginner3.say());
通过上面代码的处理,子对象拥有了临时函数的原型链,却没有继承父类在函数中定义的成员,这样如果想要定义私有的方法则可以在函数定义中,如果想定义可继承方法可在函数prototype中,从而比较完美的解决继承。
小结:
在javascript中实现继承有许多方法,在本节中讲解了三种主要的方法,每种方法继承都有各自的优势和缺点,可以在开发项目时约定使用某一种方式,当然除了继承外还可以使用apply借用某一个方法从而达到复用的目的,毕竟为了使用某一个方法而建立长长的原型链并不是一种可取的方式。
参考内容
《javascript 模式》 stoyan stefanov
javascript 模式(1)——代码复用的更多相关文章
- 初涉JavaScript模式 (13) : 代码复用 【上】
引子 博客断了一段时间,不是不写,一是没时间,二是觉得自己沉淀不够,经过一段时间的学习和实战,今天来总结下一个老生常谈的东西: 代码复用. 为何复用 JS门槛低,故很多人以为写几个特效就会JS,其实真 ...
- 【读书笔记】读《JavaScript模式》 - 函数复用模式之现代继承模式
现代继承模式可表述为:其他任何不需要以类的方式考虑得模式. 现代继承方式#1 —— 原型继承之无类继承模式 function object(o) { function F() {}; F.protot ...
- 【读书笔记】读《JavaScript模式》 - 函数复用模式之类式继承模式
实现类式继承的目标是通过构造函数Child()获取来自于另外一个构造函数Parent()的属性,从而创建对象. 1.类式继承模式#1 —— 默认方式(原型指向父函数实例) function Paren ...
- 常用的JavaScript模式
模式是解决或者避免一些问题的方案. 在JavaScript中,会用到一些常用的编码模式.下面就列出了一些常用的JavaScript编码模式,有的模式是为了解决特定的问题,有的则是帮助我们避免一些Jav ...
- 《JavaScript模式》第6章 代码复用模式
@by Ruth92(转载请注明出处) 第6章:代码复用模式 GoF 在其著作中提出的有关创建对象的建议原则: -- 优先使用对象组合,而不是类继承. 传统模式:使用类继承: 现代模式:"类 ...
- javascript代码复用模式(二)
前面说到,javascript的代码复用模式,可分为类式继承和非类式继承(现代继承).这篇就继续类式继承. 类式继承模式-借用构造函数 使用借用构造函数的方法,可以从子构造函数得到父构造函数传任意数量 ...
- javascript代码复用模式
代码复用有一个著名的原则,是GoF提出的:优先使用对象组合,而不是类继承.在javascript中,并没有类的概念,所以代码的复用,也并不局限于类式继承.javascript中创建对象的方法很多,有构 ...
- 深入理解JavaScript系列(46):代码复用模式(推荐篇)
介绍 本文介绍的四种代码复用模式都是最佳实践,推荐大家在编程的过程中使用. 模式1:原型继承 原型继承是让父对象作为子对象的原型,从而达到继承的目的: function object(o) { fun ...
- 深入理解JavaScript系列(45):代码复用模式(避免篇)
介绍 任何编程都提出代码复用,否则话每次开发一个新程序或者写一个新功能都要全新编写的话,那就歇菜了,但是代码复用也是有好要坏,接下来的两篇文章我们将针对代码复用来进行讨论,第一篇文避免篇,指的是要尽量 ...
随机推荐
- ie6 z-index不起作用的解决方法
一.概念 z-index伴随着层的概念产生的.网页中,层的概念与photoshop或是flash中层的概念是一致的.熟悉photoshop或是flash的应该知道,层级越高(图层越靠上),越在上面显示 ...
- Hammer.js手势库 安卓4.0.4上的问题
Hammer.JS - v1.0.7dev - 2014-02-18 1.Hammer.JS 在安卓4.0.4 , 4.1上 touchmove事件丢失 https://code.google.com ...
- ASP.NET Core 中的依赖注入 [共7篇]
一.控制反转(IoC) ASP.NET Core在启动以及后续针对每个请求的处理过程中的各个环节都需要相应的组件提供相应的服务,为了方便对这些组件进行定制,ASP.NET通过定义接口的方式对它们进行了 ...
- 初学ReactJS,写了一个RadioButtonList组件
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>React Demo</title> ...
- AngularJS之ng-class(十一)
前言 本节我们来讲讲指令中的ng-class,通过添加ng-class来生成对应的样式,有时候得根据不同的条件来选择对应的样式,本节我们来看看ng-class的灵活性用法. ng-class使用字符串 ...
- 确保 PHP 应用程序的安全
开始之前在本教程中,您将学习如何在自己的 PHP Web 应用程序中添加安全性.本教程假设您至少有一年编写 PHP Web 应用程序的经验,所以这里不涉及 PHP 语言的基本知识(约定或语法).目标是 ...
- 玩转Jquery,告别前端知道思路忘记知识点的痛苦
本节内容: 本章主要讲解一下jquery,主要是工作中用的前端框架是datetables框架,然后datetables框架又是基于jqeury研发的,所以要想学一个东西,就必须要了解其底层,不然走路都 ...
- 把《c++ primer》读薄(4-1 c和c++数组)
督促读书,总结精华,提炼笔记,抛砖引玉,有不合适的地方,欢迎留言指正. c和c++的数组和指针都属于低级的复合数据类型,比如c++的数组,类似vector容器,指针类似迭代器.低级的数据类型优势是速度 ...
- Oracle同义词+dblink的实际应用
Oracle同义词+dblink的实际应用 业务需求:原数据库(10.2.0.4.0),新数据库(11.2.0.3) 由于程序的需求原因,现在需要把新库上的某个用户直接映射到老库用户下: 1. 备份原 ...
- ssh整合问题总结--运行项目时报java.lang.StackOverflowError(堆栈溢出)异常
今天在整合ssh项目中,碰到一个异常,当我提交购物车数据到订单时,浏览器报了一个这样的异常. 当时,我就吓坏了.尼玛,这不是内存溢出了吗?吓得我赶紧去检查了每一个有遍历语句的代码,结果没有发现一个死循 ...