最近过了一遍尼古拉斯泽卡斯的高级程序设计第三版(红皮书)第六章:面向对象程序设计,现在把总结出来的东西和大家分享一下。

主要内容如下:

1.工厂模式

2.构造函数模式

3.原型模式

4.继承

一、工厂模式

工厂模式中的函数中会创建一个对象,最后return这个对象,通过每次调用时传入的参数不同来解决创建多个相似对象的问题。

// 工厂模式
function creatPerson(name, age, job) {
var o = {};
o.name = name;
o.age = age;
o.job = job;
o.sayName = function() {
console.log(this.name);
}
return o;
}
var tianjiao = creatPerson('tj',22,'fe');
console.log(tianjiao)

二、构造函数模式

构造函数本身也是函数,只不过是一个创建对象的函数

// 构造函数
function Person(name, age) {
this.name = name;
this.age = age;
this.sayName = function() {
console.log(this.name)
};
}
var tj2 = new Person('tj2', 23)
console.log(tj2)

要创建person新实例,必须使用new操作符,调用构造函数会经历以下四步:

1.创建一个新对象

2.将构造函数的作用域给了新对象(this指向新对象)

3.为新对象添加属性

4.返回新对象

创建自己定义的构造函数意味着将来可以将它的实例标识为一种特定的类型,而工厂模式则都是object,无法区别。

构造函数和其他函数的唯一区别是调用方式不同,而任何函数只要用new操作符调用,那他就可以作为构造函数。

三、原型模式

每个函数都有一个prototype属性,这个属性是一个指针,指向一个对象,这个对象的用途是包含可以由特定类型的实例共享的属性和方法。

使用原型对象的好处是可以让所有对象实例共享他所包含的属性和方法。不必在构造函数中定义对象实例的信息,而是可以将这些信息直接添加到原型对象中。

// 原型方法
function Person() { }
Person.prototype.name = 'tj3';
Person.prototype.age = 24;
Person.prototype.sayName = function(){
alert(this.name)
}
var tj3 = new Person();
console.log(tj3)
//更简单的原型方法
function Person() { }
Person.prototype = {
name:'tj4',
age:25,
sayName : function() {
alert(this.name)
}
};
var tj4 = new Person();
console.log(tj4)

  

四、组合使用构造函数和原型模式

构造函数模式用于定义实例属性,而原型模式定义方法和共享的属性。这种混合模式还支持向构造函数传递参数。

// 组合使用构造函数和原型模式
function Person(name, age, job) {
this.name = name;
this.age = age;
this.job = job;
this.sayName = function() {
alert(this.name)
}
} Person.prototype = {
sayJob : function() {
console.log(this.job);
}
} var person1 = new Person('tj', 22 , 'fe');

五、原型链继承

原型链继承的主要思想是利用原型让一个引用类型继承另一个引用类型的属性和方法。

警告:通过原型链继承是,不能使用对象字面量创建原型方法,这样会重写原型链!

// 原型链继承
function SuperType() {
this.color = ['red', 'blue'];
}
function SubType() { }
SubType.prototype = new SuperType();// 继承了SuperType
var instance1 = new SubType();
console.log(instance1);

  

六、借用构造函数继承

其实就是用call和apply实现继承

// 借用构造函数继承
function wanda() {
this.money = [1,2,3]
}
function sicong() {
wanda.call(this);
}
var sc = new sicong();
sc.money.push(666)
console.log(sc)

七、组合继承

将原型链和借用构造函数的技术组合起来一起用,好处是既能实现函数的复用,又能保证每个实例有自己的属性。

// 组合继承
function SuperType(name) {
this.name = name;
this.color = ['red', 'blue'];
}
SuperType.prototype.sayName = function() {
console.log(this.name);
};
function SubType(name, age) {
SuperType.call(this, name);//继承属性
this.age = age;
}
SubType.prototype = new SuperType();//继承方法
var instance1 = new SubType('tj', 22);
instance1.sayName();

最后还有寄生式继承和寄生组合式继承,自己工作中也没有用过,这里就不赘述了。

js面向对象小结(工厂模式,构造函数,原型方法,继承)的更多相关文章

  1. JS面向对象之工厂模式

    js面向对象 什么是对象 "无序属性的集合,其属性可以包括基本值.对象或者函数",对象是一组没有特定顺序的的值.对象的没个属性或方法都有一个俄名字,每个名字都映射到一个值. 简单来 ...

  2. js面向对象(对象/类/工厂模式/构造函数/公有和原型)

    https://www.cnblogs.com/sandraryan/ 什么是对象 js中一切都是对象(有行为和特征).js允许自定义对象,也提供了内建对象(string date math等) 对象 ...

  3. JavaScript提高篇之面向对象之单利模式工厂模型构造函数原型链模式

    1.单例模式 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UT ...

  4. js设计模式:工厂模式、构造函数模式、原型模式、混合模式

    一.js面向对象程序 var o1 = new Object();     o1.name = "宾宾";     o1.sex = "男";     o1.a ...

  5. 面向对象+闭包+三种对象的声明方式(字面式、new Object、构造函数、工厂模式、原型模式、混合模式)

    面向对象: 对代码的一种抽象,对外统一提供调用接口的编程思想 对象的属性:事物自身拥有的东西 对象的方法:事物的功能 对象:事物的一个实例 对象的原型:.prototype -> 内存地址 -& ...

  6. JS面向对象(1)——构造函数模式和原型模式

    1.构造函数模式 构造函数用来创建特定的类型的对象.如下所示: function Person(name,age,job){ this.name=name; this.job=job; this.ag ...

  7. [JS设计模式]:工厂模式(3)

    简单工厂模式是由一个方法来决定到底要创建哪个类的实例, 而这些实例经常都拥有相同的接口. 这种模式主要用在所实例化的类型在编译期并不能确定, 而是在执行期决定的情况. 说的通俗点,就像公司茶水间的饮料 ...

  8. JS设计模式之工厂模式

    1 什么是工厂模式? 工厂模式是用来创建对象的一种最常用的设计模式.我们不暴露创建对象的具体逻辑,而是将将逻辑封装在一个函数中,那么这个函数就可以被视为一个工厂.工厂模式根据抽象程度的不同可以分为: ...

  9. JS设计模式--简单工厂模式

    在JS中创建对象会习惯的使用new关键字和类构造函数(也是可以用对象字面量). 工厂模式就是一种有助于消除两个类依赖性的模式. 工厂模式分为简单工厂模式和复杂工厂模式,这篇主要讲简单工厂模式. 简单工 ...

随机推荐

  1. unity3d 血液

    这里的人物头像和血条是在3d世界生成的,所以有真正的纵深感和遮挡关系,废话不多说,看我是怎么实现的. 第一步.先在UI Root里制作头像和血条. 这个制作步骤基本和我前面一篇文章介绍头像血条的制作步 ...

  2. Node.js日志框架选型比較:Winston

    日志对于问题定位.调试,系统性能调优至关重要,尤其是系统复杂以及在线执行的情况下. 好的开发框架都会有一个可开启关闭/可配置记录级别的日志系统.我们从下面几个方面来做选型: 1. 每行日志都须要有准确 ...

  3. Javascript多线程引擎(三)

    Javascript多线程引擎(三) 完成对ECMAScript-262 3rd规范的阅读后, 列出了如下的限制条件 1. 去除正则表达式( 语法识别先不编写) 2. 去除对Function Decl ...

  4. Windows平台分布式架构实践负载均衡

    Windows平台分布式架构实践 - 负载均衡 概述 最近.NET的世界开始闹腾了,微软官方终于加入到了对.NET跨平台的支持,并且在不久的将来,我们在VS里面写的代码可能就可以通过Mono直接在Li ...

  5. [置顶] 纯手工打造漂亮的垂直时间轴,使用最简单的HTML+CSS+JQUERY完成100个版本更新记录的华丽转身!

    前言 FineUI控件库发展至今已经有 5 个年头,目前论坛注册的QQ会员 5000 多人,捐赠用户 500 多人(捐赠用户转化率达到10%以上,在国内开源领域相信这是一个梦幻数字!也足以证明Fine ...

  6. String类重写

    #include <iostream> #include<string.h> using namespace std; class String { int length; i ...

  7. AngularJS1

    Ⅰ.AngularJS的点点滴滴--引导   AngularJS已经被很多人像炒冷饭一样炒过啦,大部分都是直接复制官方文档没有说明一些注意事项,不过什么都要从头开始吧 ###页面引导实例化 * * * ...

  8. VIJOS1107 求树的最长链

    vijos1107环游大同80天 学习了一下求树的最长链的方法 最简单的思路就是两次dfs 两次dfs分别有什么用呢? 第一次dfs,求出某个任意的点能到达的最远的点 第二次dfs,从所搜到的最远的点 ...

  9. D12

    orz!=-=今天莫名爆人品..表示受到了惊吓.. 一下子从rank20-30+,突然间蹦到了rank3..=-=可怕.. 或许是因为T1有看过啊类似的啊..然后T3又被40指点了一下,T2打了个暴力 ...

  10. Django模板引擎的研究

    Django模板引擎的研究 原创博文,转载请注明出处. 以前曾遇到过错误Reverse for ‘*’ with arguments '()' and keyword arguments' not f ...