JavaScript高级程序设计学习笔记--面向对象程序设计

时间:2021-08-09 20:39:17

工厂模式

虽然Object构造函数或对象字面量都可以用来创建单个对象,但这些方式有个明显的缺点:使用同一个接口创建很多对象,会产生大量的重复代码。为解决这个问题,人们开始使用
工厂模式的一种变体。

function createPerson(name,age,job){
var o=new Object();
o.name=name;
o.age=age;
o.job=job;
o.sayName=function(){
alert(this.name);
};
return o;
} var person1=createPerson("Nicholas",29,"Software Engineer");
var person2=createPerson("Grey",27,"Doctor");

函数createPerson()能够根据接受的参数来构建一个包含所有必要信息的Person对象。可以无数次的调用这个函数,而每次它都会返回一个包含三个属性一个方法的对象。
工厂模式虽然解决了创建多个相似对象的问题,但却没有解决对象识别的问题(即怎样知道一个对象的类型)。

构造函数模式

function Person(name,age,job){
this.name=name;
this.age=age;
this.job=job;
this.sayName=function(){
alert(this.name);
}
} var person1=new Person("Nicholas",29,"Software Engineer");
var person2=new Person("Grey",27,"Doctor");

在这个例子中,Person()函数取代了createPerson函数。我们注意到,Person()中的代码除了与createPerson()中相同的部分外,还存在以下不同之处:
(1):没有显式的创建对象;
(2):直接将属性和方法赋给了this对象;
(3):没有return语句

原型模式

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

function Person(){
} Person.prototype.name="Nicholas";
Person.prototype.age=29;
Person.prototype.sayName=function(){
alert(this.name);
} var person1=new Person();
person1.sayName(); //"Nicholas" var person2=new Person();
person2.sayName(); //"Nicholas" alert(person1.sayName==person2.sayName); //true

虽然可以通过对象实例访问保存在原型中的值,但却不能通过对象实例重写原型中的值。如果我们在实例中添加一个属性,而该属性与实例原型中的一个属性同名,那我们就在实例
中创建该属性,该属性将会屏蔽原型中的属性。

原型的动态性

由于在原型中查找值的过程是一次搜索,因此我们对原型对象所做的任何个修改都能够立即从实例上反映出来--即使先创建了实例后个性原型也照样如此。请看下面的例子:

var friend=new Person();
Person.prototype.sayHi=function(){
alert("HI");
}
friend.sayHi(); //"HI" (没有问题!)

以上代码先创建了Person的一个实例,并将其保存在person中,然后,下一条语句在Person.prototype中添加了一个方法sayHi().即使person实例是在添加新方法之前创建的,
但它仍然可以访问这个新方法。
尽管可以随时为原型添加属性和方法,并且个性能够立即在所有对象实例中反映出来,但如果是重写整个原型对象,那么情况就不一样了。我们知道,调用构造函数时会为实例
添加一个指向最初原型的[[Prototype]]指针,而把原型修改为另外一个对象就等于切断了构造函数与最初原型之间的联系。请记住:实例中的指针仅指向原型,而不指向构造
函数。看下面的例子:

function Person(){
}
var friend=new Person(); Person.prototype={
constructor:Person,
name:"Nicholas",
age:29,
job:"Software Engineer",
sayName:function(){
alert(this.name);
}
};
friend.sayName(); //error

动态原型模式

可以通过检查某个应该存在的方法是否有效,来决定是否需要初始化原型。来看下面一个例子:

function Person(name,age,job){
this.name=name;
this.age=age;
this.job=job;
if(typeof this.sayName!="function"){
Person.prototype.sayName=function(){
alert(this.name);
}
}
}
var friend=new Person("Nicholas",29,"Software Engineer");
friend.sayName();

寄生构造函数模式

通常,在前述几种模式都不适用的情况下,可以使用寄生(parasitic)构造函数模式。这种模式的基本思想是创建一个函数,该函数的作用仅仅是封装创建对象的代码,然后再返回
新创建的对象;但从表面上看,这个函数又很像是典型的构造函数。下面是一个例子:

function Person(name,age,job)(
var o=new Object();
o.name=name;
o.age=age;
o.job=job;
o.sayName=function(){
alert(this.name);
}
return o;
}
var friend=new Person("Nicholas",29,"Software Engineer");
friend.sayName(); //"Nicholas"

在这个例子中,通过在构造函数的末尾添加一个return语句,可以重写调用构造函数时返回的值。
这个模式可以在特殊情况下用来为对象创建构造函数。假设我们想创建一个具有额外方法的特殊数组。由于不能直接修改Array构造函数,因此可以使用这个模式。

function SpeicalArray(){
var values=new Array(); //创建数组
values.push.apply(values,arguments); //添加值
values.toPipedString=function(){
return this.join("|");
}
return values; //返回数组
}
var colors=new SpeicalArray("red","blue","green");
alert(colors.toPipedString()); //"red|blue|green"

JavaScript高级程序设计学习笔记--面向对象程序设计的更多相关文章

  1. JavaScript高级程序设计学习笔记--面向对象的程序设计(二)-- 继承

    相关文章: 面向对象的程序设计(一) — 创建对象 http://www.cnblogs.com/blackwood/archive/2013/04/24/3039523.html 继承 继承是OO语 ...

  2. Javascript高级编程学习笔记(18)—— 引用类型(7)单体内置对象

    什么是内置对象呢? js高级程序设计中给出的定义为:由ES规定不依赖于宿主环境的对象,这些对象在JS执行前就已经存在 前面我们介绍的引用类型都是内置对象 除了这些对象外ECMA还规定了两个单体内置对象 ...

  3. Javascript高级编程学习笔记(10)—— 作用域、作用域链

    昨天介绍了,JS中函数的作用域 什么词法环境之类的,可能很多小伙伴不太明白. 在今天的内容开始之前,先做个简短的声明: 词法环境这一概念是在ES5中提出的,因为词法环境主要用于保存let.const声 ...

  4. Javascript高级编程学习笔记(3)—— JS中的数据类型(1)

    前一段时间由于事情比较多,所以笔记耽搁了一段时间,从这一篇开始我会尽快写完这个系列. 文章中有什么不足之处,还望各位大佬指出. JS中的数据类型 上一篇中我写了有关JS引入的Script标签相关的东西 ...

  5. JavaScript高级编程学习笔记(第三章之一)

    继续记笔记,JavaScript越来越有意思了. 继续... 第三章:JavaScript基础 ECMAScript语法在很大程度上借鉴了C和其它类似于C的语言,比如Java和Perl. 大小写敏感: ...

  6. Javascript高级编程学习笔记(98)—— WebGL(4) WebGL上下文(2)

    错误 Javascript与WebGL之间的一个最大区别在于,WebGL的操作一般不会抛出错误 如果希望获取WebGL的错误信息,那么就需要手动调用  gl.getError() 方法 该方法会返回以 ...

  7. Javascript高级编程学习笔记(97)—— WebGL(3) WebGL上下文(1)

    WebGL上下文 在支持WebGL的浏览器中,WebGL的名字为 "experimental-webgl",这是由于 webgl 的规范仍未制定完成 制定完成后名字就会改为简单的 ...

  8. Javascript高级编程学习笔记(96)—— WebGL(2) 类型化视图

    类型化视图 类型化视图一般也被认为是一种类型化数组. 因为其元素必须是某种特定的数据类型,类型化视图都继承自 Dataview Int8Array: 表示8位二补整数(即二进制补数) Uint8Arr ...

  9. Javascript高级编程学习笔记(1)—— JS简介

    此系列文章,用于记录所学,如有错误欢迎指出. Javascript组成 1.核心(ECMAScript) 2.文档对象模型(DOM) 3.浏览器对象模型(BOM) 1.核心(ECMAScript) E ...

随机推荐

  1. EF6.0 Code First使用mysql的各种错误和解决办法!!

    1.修改或者添加connectionStrings <connectionStrings> <add name="MvcDBContext" connection ...

  2. Windows Store App 网络通信 HttpWebRequest

    如果希望更好地控制HTTP请求,可以使用System.Net类库中的HttpWebRequest类,该类对HTTP协议进行了完整的封装,并且提供了很多对HTTP协议中的 Header.Content和 ...

  3. jquery-migrate&period;js

    这个插件可以用来检测和恢复在jQuery1.9版本中已删除或已过时的API.

  4. 20135231 —— Linux 基础入门学习

    20135231 何佳 学习计时:共12小时 读书:5 代码:2 作业:2 博客:3 一.学习目标 1. 能够独立安装Linux操作系统 2. 能够熟练使用Linux系统的基本命令 3. 熟练使用Li ...

  5. mysql时该如何估算内存的消耗,公式如何计算?

    经常有人问配置mysql时该如何估算内存的消耗.那么该使用什么公式来计算呢? 关心内存怎么使用的原因是可以理解的.如果配置mysql服务器使用太少的内存会导致性能不是最优的;如果配置了太多的内存则会导 ...

  6. 【linux】iptables 开启80端口

    经常使用CentOS的朋友,可能会遇到和我一样的问题.开启了防火墙导致80端口无法访问,刚开始学习centos的朋友可以参考下. 经常使用CentOS的朋友,可能会遇到和我一样的问题.最近在Linux ...

  7. Keepalived &plus; HAProxy 搭建【第一篇】HAProxy 的安装和配置

    第一步:准备 1. 操作系统 CentOS-7-x86_64-Everything-1511 2. 安装包 haproxy-1.7.2.tar.gz 第二步:安装 # tar zxvf haproxy ...

  8. ES2015 类 class 语法

    在ES2015之前,定义类的方法只能通过原型链来模拟 function Animal(family,species) { this.family = family; this.species = sp ...

  9. javascript属性访问表达式

    属性访问表达式运算得到一个对象属性或一个数组元素的值.js为属性访问定义了2中语法: expression.identifier expression["expression"] ...

  10. Hibernate中cascade作用

    Hibernate中cascade作用 只有“关系标记”才有cascade属性: 一个操作因级联cascade可能触发多个关联操作.前一个操作叫“主控操作”,后一个操作叫“关联操作”. cascade ...