<%@ page language="java" contentType="text/html;
charset=UTF-8" pageEncoding="UTF-8"%>
<html>
<head>
<script type="text/javascript">
/*
JavaScript原型模式已经带来的弊端以及这个弊端的解决办法:
一句话概述弊端: 原型对象中的引用类型因为共享,修改了就修改了全部实例。
而又的时候我们仅仅是想每个实例有每个实例的引用类型,所以就出现了问题。
原型模式也并不是没有缺点的,首先,它省略了为构造函数传递参数的这一环节,
结果所有实例在默认情况下将取得所有相同的属性值,虽然这会在某种程度上
带来一些不方便,但还不是原型的最大的问题,原型模式的最大问题是由其共享
的本性所导致的。
原型中所有属性是被实例共享的,这种共享对于函数非常适合,对于那些包含基本值的属性
倒也说得过去,毕竟,通过在实例上添加一个同名属性,可以隐蔽原型中的对应属性。然而
,对于包含引用类型值得属性来说,问题就比较突出了,来看如下例子:
*/
function Person(){}
Person.prototype = {
constructor:Person, //应该知道这种写法带来的问题,已经过,不在赘述
name : "chenchaoyang",
age:12,
job : "Software enginner",
friends :["何胜男","何凯"],
sayName : function(){
console.log(this.name);
}
}
function onloadFunction(){
var person1 = new Person();
var person2 = new Person();
person1.friends.push("张三");
person1.friends = ["3333","34444"];
alert(person1.friends); //何胜男,何凯,张三
alert(person2.friends); //何胜男,何凯,张三
alert(person1.friends == person2.friends); //true
}
/*
因为friends属性存在于Person的prototype对象中,所以修改了person1
的friends属性,person2的friends同样就行了修改,因为他们是共享了一个
friends属性,假如我们的初衷就是像这样在所有实例中共享一个数组,那么
对这个结果我没有话可说,可是,实例一般都是要有属于自己的全部属性的,而这个
问题正是我们很少看到有人单独使用原型模式的原因所在。
于是一个我们比较常见的,最实用的使用的模式出现了,这个模式也是我们的顶级模式:
*/
/*
创建自定义类型的最常见方式,就是组合模式 = 构造模式 + 原型模式。
构造模式用来: 定义实例属性
原型模式用来:定义共享的属性
这样,每个实例都会有自己的一份实例属性的副本,但同时又共享着对象的引用,最大限度
的节省了内存。另外,这种混合模式还支持向构造函数传递参数,可谓是集两种模式之长。
下面代码重写了前面的例子,是JavaScript创建对象的顶级模式,一定要牢记:
*/
function Person(name,age,job){
this.name = name;
this.age = age;
this.job = job;
this.friends = ["何胜男","何凯"];
}
Person.prototype = {
constructor : Person,
sayName : function(){
alert(this.name);
}
}
function onloadFunction(){
var person1 = new Person("chenchaoyang",27,"Software Enginner");
var person2 = new Person("heshengnan",23,"Software Enginner");
person1.friends.push("zhagnsan");
console.log(person1.friends); // ["何胜男", "何凯", "zhagnsan"]
console.log(person2.friends); // ["何胜男", "何凯"]
console.log(person1.friends == person2.friends); //false
console.log(person1.sayName == person2.sayName); //true
console.log(person1.constructor); // Person(name, age, job)
console.log(person2.constructor); //Person(name, age, job)
console.log(person1 instanceof Object); //true
console.log(person1 instanceof Person); //true
console.log(person2 instanceof Object); //true
console.log(person2 instanceof Person); //true
}
</script>
</head>
<body onload="onloadFunction();">
</body>
</html>
分享到:
相关推荐
设计模式专题之(五)原型模式---设计模式原型模式示例代码(python--c++)
js面向对象之常见创建对象的几种方式(工厂模式、构造函数模式、原型模式).docx
本书结合设计实例从面向对象的设计中精选出23个设计模式,总结了面向对象设计中最有价值的经验,并且用简洁可复用的形式表达出来。本书分类描述了一组设计良好、表达清楚的软件设计模式,这些模式在实用环境下特别...
JAVA-设计模式-创建型模式-原型模式
1、掌握原型模式的应用场景及常用写法 1、听说过原型模式,但不知道应用场景的人群 1、类初始化消耗资源较多 2、new 产生的一个对象需要非常繁琐的过程(数据准
《JavaScript面向对象编程指南》内容包括:JavaScript作为一门浏览器语言的核心思想;面向对象编程的基础知识及其在JavaScript中的运用;数据类型、操作符以及流程控制语句;函数、闭包、对象和原型等概念,以代码...
函数、闭包、对象和原型等概念,以代码重用为目的的继承模式;BOM、DOM、浏览器事件、AJAX和JSON;如何实现JavaScript中缺失的面向对象特性,如对象的私有成员与私有方法;如何应用适当的编程模式,发挥JavaScript...
C#面向对象设计模式纵横谈(6):Prototype 原型模式(创建型模式)
书名: 设计模式可复用面向对象软件的基础 英文原书名: Design Patterns:Elements of Reusable Object-Oriented software 作者: Erich Gamma 等 译者: 李英军 马晓星 蔡敏 刘建中 书号: 7-111-07575-7 页码: 254 定价...
主要介绍了面向对象JS基础讲解,工厂模式、构造函数模式、原型模式、混合模式、动态原型模式,需要的朋友可以参考下
C#面向对象设计模式纵横谈(4):Builder 生成器模式(创建型模式) C#面向对象设计模式纵横谈(5):Factory Method 工厂方法模式(创建型模式) C#面向对象设计模式纵横谈(6):Prototype 原型模式(创建型模式) C#面向...
c++20设计模式-第4章-原型模式代码
Android源码中的模式实现Intent中使用了原型模式优点与缺点优点原型模式是在内存二进制流的拷贝,要比直接 new 一个对象性能好很多,特别是要在一个循环
JS面向对象经典案例,JS面向对象过程中用到的一些技术,例如对象、类、JS继承Call、JS原型链Prototype、JS闭包等等
javascript-原型与原型链
函数、闭包、对象和原型等概念,以代码重用为目的的继承模式;BOM、DOM、浏览器事件、AJAX和JSON;如何实现JavaScript中缺失的面向对象特性,如对象的私有成员与私有方法;如何应用适当的编程模式,发挥JavaScript...
旅游网站----原型 该.rar用于上课教学内容实践,如有雷同纯属巧合。
会议管理系统----原型,可用于实现java提供参考。 若有雷同。联系可删。
计算机后端-Java-图解java设计模式052 原型模式(4.avi