js关于创建对象的几种模式

本文详细介绍了JavaScript中创建对象的几种常见模式,包括工厂模式、构造函数模式、原型模式及组合模式,并比较了它们之间的优劣。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

工厂模式:js中是没有类的概念,就通过用函数来封装以特定接口来创建对象,为对象添加属性和方法,然后返回对象,这种模式可以解决创建多个相似对象写大量重复代码的问题,但是它却不能解决对象识别的问题。

function createrPerson(name,age){
                var o = new Object();
                o.name = name;
                o.age = age;
                o.sayName = function(){
                    alert(this.name);
                };
                return o;
            }
            var person1 = new createrPerson("aaa",18);
            var person2 = new createrPerson("bbb",8);
            
            person1.sayName();  
            person2.sayName();

构建函数模式:构造函数可以用来创建特定类型的的对象(原生和自定义),可以向创建内置对象实例一样使用new操作符,此模式可以通过instanceof检测对象类型,这是超过工厂模式的地方,但是它是缺点是构造函数里的方法在每个实例上都会创建一次,因为它的每个成员都无法得到复用。注意这两段代码的区别

function createrPerson(name,age){
                this.name = name;
                this.age = age;
                this.sayName = function(){
                    alert(this.name);
                };
            }
            var person1 = new createrPerson("aaa",18);
            var person2 = new createrPerson("bbb",8);
            
            person1.sayName();  
            person2.sayName();

原型模式:使用构造函数的prototype属性来指定那些应该共享的属性和方法,这样person1和person2实例都共享了同一个sayname方法,所以在最后一行是打印true,

这是与构造函数不同的地方。但是这种模式对于包含有引用类型的属性就有问题了,因为是共享的,如果想改变一个实力的属性,而其他的实力也会随时被更改。

function Person(){}
Person.prototype.name = "aaa";
Person.prototype.age = 18;
Person.prototype.sayName = function(){
alert(this.name);
};

var person1 = new Person();
person1.sayName();
var person2 = new Person();
person2.sayName();
alert(person1.sayName == person2.sayName);

 

 

组合模式:是结合构造函数和原型模式的,使用构造函数定于实力属性,用原型定义共享属性和方法。这样就保证了每个实例都有自己的属性

function Person(name,age){
                this.name = name;
                this.age = age;
                this.friends = ["ccc","ddd"];
            }
            Person.prototype = {
                constructor : Person
                sayName : function(){
                    alert(this.name);
                }
            }
            var person1 = new Person("aaa",12);
            var person2 = new Person("bbb",3);
            person1.friends.push("eee");
            alert(person1.friends);
            alert(person2.friends);
            alert(person1.friends === person2.friends);
            alert(person1.sayName === person2.sayName);

 

 

转载于:https://www.cnblogs.com/minna123/p/6680240.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值