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

工厂模式

虽然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高级程序设计学习笔记--面向对象程序设计

时间: 2024-10-05 10:37:40

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

javascript高级编程学习笔记(二)

写读书笔记的好处在于加深记忆,前一篇总结了编程中创建的对象的几种方式,以及常用的方式,这一篇总结实现继承的方式: 1.对象冒充: function ClassA(sColor) { this.color = sColor; this.sayColor = function () { alert(this.color); }; } function ClassB(sColor, sName) { this.newMethod = ClassA; this.newMethod(sColor); de

JavaScript高级编程(学习笔记)

一 内存分配 1,栈:由计算机管理,先进后出,快但不自由  堆:由程序员控制,自由 2,引用类型存于堆,值类型存于声明它的地方 二 垃圾回收 1,找出不再使用的变量(堆内存中,没有栈内存指向它),然后释放掉其占用的内存,但是这个过程不是时时的,因为其开销比较大,所以垃圾回收器会按照固定的时间间隔周期性的执行. 2,离开作用域标记可删,大部分浏览器都是使用这种方式进行垃圾回收,区别在于如何标记及垃圾回收间隔而已 3,JavaScript对象通过标记清除的方式进行垃圾回收,但非JavaScript原

JavaScript高级程序设计学习笔记--基本概念

1.语句 ECMAScript中的语句以一个分号结尾:如果省略分号,则由解析器确定语句的结尾,如下例所示: var sum=a+b //即使没有分号也是有效的语句--推荐 var diff=a-b; //有效的语句--推荐 虽然语句结尾的分号不是必需的,但我们建议任何时候都不要省略它.两个原因:1.加上分号可以避免很多错误 2.加上分号也会在某些情况下增进代码的性能,因为这样解析器就不必再花时间 推测应该在哪里插入分号了. 2.变量 var message="hi"; 像这样初始化变量

JavaScript高级程序设计学习笔记--错误处理与调试

try-catch语句 只要代码中包含finally子句,则无论try或catch语句块中包含什么代码--甚至return语句,都不会阻止finally子句的执行,来看下面这个函数: function testFinally(){ try{ return 2; }catch(error){ return 1; }finally{ return 0; } } 调用这个函数会返回0(PS:但我实际执行的时候会先返回0,再返回2) 抛出错误 与try-catch语句相配的还有一个throw操作符,用于

Javascript高级程序设计学习笔记

3. 基本概念 基本数据类型:Undefined,Null,Boolean,Number,String. 复杂数据类型:Object. 3.6 语句 switch比较值时用的是全等运算符 “===” ,因此不会进行类型转换.例如 “10” 不等于10. 3.7 函数 ECMAScript函数不介意传递进来多少个参数,也不在乎参数的类型.即使定义的函数只接受两个参数,在调用的时候也可以传递任意多个或者0个.因为ECMAScript的参数在内部是用一个数组表示的,在函数体内部可以通过argument

JavaScript高级程序设计学习笔记--高级技巧

惰性载入函数 因为浏览器之间行为的差异,多数JavaScript代码包含了大量的if语句,将执行引导到正确的代码中,看看下面来自上一章的createXHR()函数. function createXHR(){ if (typeof XMLHttpRequest != "undefined"){ return new XMLHttpRequest(); } else if (typeof ActiveXObject != "undefined"){ if (typeo

JavaScript高级程序设计学习笔记--DOM

DOM(文档对象模型)是针对HTML和XML文档的一个API(应用程序接口). Document类型 文档的子节点 虽然DOM标准规定Document节点的子节点可以是DocumentType,Element,ProcessingInstruction或Comment,但还有两个内置的访问其子节点的快捷方式.第一个就是documnetElement属性,该属性始终指向HTML页面中的<html>元素.另一个就是通过childNodes列表访问文档元素,但通过documentElement属性则

JavaScript高级程序设计学习笔记--BOM

window对象 BOM的核心对象是window,它表示浏览器的一个实例.在浏览器中,window对象有双重角色,它既是通过JavaScript访问浏览器窗口的一个接口,又是ECMScript规定的Global对象. 全局作用域 由于window对象同时扮演着ECMAScript中Global对象的角色,因此所有在全局作用域中声明的变量.函数都会变成window对象的属性和方法.来看下面的例子: var age=29; function sayAge(){ alert(this.age); }

JavaScript高级程序设计学习笔记--引用类型

Object类型 对象字面量表示法: var person={ name:"Nicholas", age:29, 5:true }; 这人例子会创建一个对象,包含三个属性:name,age和5.但这里的数值属性名会自动转换为字符串. 对象属性的访问:点表示法和方括号语法 alert(person["name"]); // "Nicholas" alert(person.name); // "Nicholas" 从功能上看,这两