`
axl234
  • 浏览: 260643 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

js原型模式创建对象+动态原型模式的优点

 
阅读更多

原型模式创建对象也有自己的缺点 , 它省略了构造函数传参初始化这一过程 , 带来的缺点就是初始化的值都是一致的。而原型最大的缺点就是它最大的优点,那就是共享。
原型中所有属性是被很多实例共享的 , 共享对于函数非常合适 , 对于包含基本值的属性也还可以。但如果属性包含引用类型,就存在一定的问题:

function Box() {};
Box.prototype = {
constructor : Box,
name : 'Lee',
age : 100,
family : [' 父亲 ', ' 母亲 ', ' 妹妹 '], // 添加了一个数组属性
run : function () {
return this.name + this.age + this.family;
}
};
var box1 = new Box();
box1.family.push(' 哥哥 '); // 在实例中添加 ' 哥哥 '
alert(box1.run());
var box2 = new Box();
alert(box 2 .run()); // 共享带来的麻烦,也有 ' 哥哥 ' 了


PS :数据共享的缘故,导致很多开发者放弃使用原型,因为每次实例化出的数据需要
保留自己的特性,而不能共享。


为了解决构造传参和共享问题,可以 组合构造函数 +  原型模式 :
function Box(name, age) { // 不共享的使用构造函数
this.name = name;
this.age = age;
this. family = [' 父亲 ', ' 母亲 ', ' 妹妹 '];
};
Box.prototype = { // 共享的使用原型模式
constructor : Box,
run : function () {
return this.name + this.age + this.family;
}
};


PS : 这种混合模式很好的解决了传参和引用共享的大难题 。 是创建对象比较好的方法 。

 

 

原型模式 , 不管你是否调用了原型中的共享方法 , 它都会初始化原型中的方法 , 并且在
声明一个对象时 , 构造函数 + 原型部分让人感觉又很怪异 , 最好就是把构造函数和原型封装
到一起。为了解决这个问题,我们可以使用 动态原型模式 。


function Box(name ,age) { // 将所有信息封装到函数体内
this.name = name;
this.age = age;
if (typeof this.run != 'function') { // 仅在第一次调用的初始化
Box.prototype.run = function () {
return this.name + this.age + ' 运行中 ...';
};
}
}
var box = new Box('Lee', 100);
alert(box.run());


当第一次调用构造函数时, run() 方法发现不存在,然后初始化原型。当第二次调用 , 就
不会初始化 , 并且第二次创建新对象 , 原型也不会再初始化了 。 这样及得到了封装 , 又实现
了原型方法共享,并且属性都保持独立。

 

 

分享到:
评论

相关推荐

    Axure原型+动态排名+中继器

    这是用Axure8.1制作的用中继器设计的动态排名原型案例; Axure原型+动态排名+中继器; Axure原型+动态排名+中继器;

    js面向对象之常见创建对象的几种方式(工厂模式、构造函数模式、原型模式).docx

    js面向对象之常见创建对象的几种方式(工厂模式、构造函数模式、原型模式).docx

    设计模式 创建型模式 Prototype模式(原型)

    Prototype模式允许一个对象再创建另外一个可定制的对象,根本无需知道任何如何创建的细节,工作原理是:通过将一个原型对象传给那个要发动创建的对象,这个要发动创建的对象通过请求原型对象拷贝它们自己来实施创建。...

    原型模式实践代码

    原型模式实践代码

    原型模式(c++,Qt实现).zip

    用原型实例指定创建对象的种类,并通过拷贝这些原型创建新的对象 从一个对象再创建另外一个可定制的对象,而且不需知道任何创建的细节 克隆的优点 一般在初始信息不发生变化的情况下,克隆是最好的办法,这既...

    【JavaScript源代码】怎样用JavaScript实现原型模式.docx

     概述 原型模式是指原型实例指向创建对象的种类,并通过拷贝这些原型创建新的对象,是一种用来创建对象的模式,也就是创建一个对象作为另一个对象的prototype属性; prototype警告:学习了解原型模式前需先学习...

    day02 工厂模式+原型模式+建造者模式

    day02 工厂模式+原型模式+建造者模式

    设计模式之原型模式

    java 23种设计模式之原型模式:用原型实例指定创建对象的种类,并通过复制、克隆这些原型创建新的对象。

    Axure原型模板原型元件库+常用组件源码(下载即用).zip

    Axure原型模板原型元件库+常用组件源码(下载即用).zip 代码完整下载即用无需修改。 Axure原型模板原型元件库+常用组件源码(下载即用).zip 代码完整下载即用无需修改。Axure原型模板原型元件库+常用组件源码...

    源码+原型+数据库 人事管理系统

    源码+原型+数据库 人事管理系统源码+原型+数据库 人事管理系统源码+原型+数据库 人事管理系统源码+原型+数据库 人事管理系统源码+原型+数据库 人事管理系统源码+原型+数据库 人事管理系统源码+原型+数据库 人事管理...

    原型模式(Prototype Pattern)原理图

    原型模式是一种创建型设计模式,它通过复制一个现有的对象来创建新的对象,而不是通过调用构造函数的方式。这种方式可以在运行时动态地创建和修改对象,而不需要知道具体的创建细节 。 原型模式的基本概念包括以下...

    Axure原型设计身高标尺+rp文件

    Axure原型设计身高标尺+rp文件;Axure原型设计身高标尺+rp文件;Axure原型设计身高标尺+rp文件;Axure原型设计身高标尺+rp文件

    源码+原型+数据库 宠物管理系统

    源码+原型+数据库 宠物管理系统源码+原型+数据库 宠物管理系统源码+原型+数据库 宠物管理系统源码+原型+数据库 宠物管理系统源码+原型+数据库 宠物管理系统源码+原型+数据库 宠物管理系统源码+原型+数据库 宠物管理...

    源码+原型+数据库 请假管理系统

    源码+原型+数据库 请假管理系统源码+原型+数据库 请假管理系统源码+原型+数据库 请假管理系统源码+原型+数据库 请假管理系统源码+原型+数据库 请假管理系统源码+原型+数据库 请假管理系统源码+原型+数据库 请假管理...

    创建型模式之原型模式(Prototype Pattern)

    6、原型模式(Prototype Pattern) 用意:通过拷贝创建一个新的对象

    深入了解js原型模式

    原型模式是把所有实例共享的方法和属性放在一个叫做prototype(原型)的属性中 ,在创建一个函数时都会有个prototype属性, 这个属性是一个指针,指向一个对象,是通过调用构造函数而创建的那个对象实例的原型对象。...

    js原型和对象

    该代码为JavaScript中关于原型对象的描述

    设计模式_原型模式.zip

    原型模式(Prototype Pattern)是用于创建重复的对象,同时又能保证性能。这种类型的设计模式属于创建型模式,它提供了一种创建对象的最佳方式。 这种模式是实现了一个原型接口,该接口用于创建当前对象的克隆。当...

    源码+原型+数据库 图书管理器

    源码+原型+数据库 图书管理器源码+原型+数据库 图书管理器源码+原型+数据库 图书管理器源码+原型+数据库 图书管理器源码+原型+数据库 图书管理器源码+原型+数据库 图书管理器源码+原型+数据库 图书管理器源码+原型+...

    源码+原型+数据库 花卉管理系统

    源码+原型+数据库 花卉管理系统源码+原型+数据库 花卉管理系统源码+原型+数据库 花卉管理系统源码+原型+数据库 花卉管理系统源码+原型+数据库 花卉管理系统源码+原型+数据库 花卉管理系统源码+原型+数据库 花卉管理...

Global site tag (gtag.js) - Google Analytics