深入理解javascript的4种对象创建方式

来源:互联网 发布:昆医教务网络管理系统 编辑:程序博客网 时间:2024/06/05 04:22

创建一个对象,都有这么多种方式。

有没有感觉,javascript真的很灵活呢。

1.工厂模式

function person(name,age,tel){    var obj = {};    obj.name = name;    obj.age = age;    obj.tel = tel;    return obj;}var person1 = person('章鱼小丸子','21','110');

每次实例化都要创建一个对象的拷贝,方法函数也跟着拷贝了。
如果偏要共享方法函数,那这个方法就不能实现了呢。

2.构造函数模式

function Person(name,age,tel){    this.name = name;    this.age = age;    this.tel = tel;}var person1 = new Person('章鱼小丸子','21','110');

Person 作为构造函数。

通过new,我们构造出一个实例,实例的原型的构造器指针指向Person,然后将Person上的属性复制到person1中。返回this(this已指向person1)。

什么意思呢?属性都被复制了一份?yes。没错。

所以,

构造函数模式也存在同样的问题:

每次实例化都要创i按一个对象的拷贝,方法函数也跟着拷贝了。

如果偏要共享方法函数,那这个方法就不能实现了。

3.原型模式

function Person(name,age,tel){    this.name = name;    this.age = age;    this.tel = tel;}Person.sayName = function(){    console.log(this.name);}var person1 = new Person('章鱼小丸子','21','110');

原型模式构造模式的基础上,通过原型链,加入了方法共享

非常不错的一种办法。

4.动态原型模式

我们记得c++语言的类,我们可以初始化,就是某些函数,在类的初始化的时候执行一次,之后就不执行了。

js的类可以做到吗?

function Person(name,age,tel){    this.name = name;    this.age = age;    this.tel = tel;    if(typeof this.sayName != "function"){            alert('初始化只执行一次哦');        Person.prototype.sayName = function(){            console.log(this.name);        }    }}var person1 = new Person('章鱼小丸子','21','110');person1.sayName();//弹出alert框person1.sayName();//不弹alert框

只有在sayName不存在的时候,才会弹出alert框,并创建sayName函数。

那么我们第一次去执行person1.sayName();的时候,就可以理解为一个初始化,弹出alert。

后面再去执行多少遍person1.sayName();,都不会触发alert了。

0 0
原创粉丝点击