常见的对象创建模式

来源:http://www.chinese-glasses.com 作者:Web前端 人气:149 发布时间:2020-04-15
摘要:时间: 2019-09-28阅读: 183标签: 模式 10bet,最近一直在看JS高级程序设计这本书,有空来梳理一下几种创建对象的方式。话不多说,直接步入正题。 1、Object构造函数 第一种:Object构造函数

时间: 2019-09-28阅读: 183标签: 模式

10bet,最近一直在看JS高级程序设计这本书,有空来梳理一下几种创建对象的方式。话不多说,直接步入正题。

1、Object构造函数

第一种:Object构造函数创建

var obj = new Object();obj.name = 'tom';obj.age = 15;obj.sayName = function() { console.log(this.name)}
var Person = new Object();Person.name = 'Nike';Person.age = 29;

此方法的缺点十分明显那就是要写大量的代码。

这行代码创建了Object引用类型的一个新实例,然后把实例保存在变量Person中。

2、对象字面量创建

第二种:使用对象字面量表示法

var obj1 = {name: 'tom',age: 15,sayName: function() {console.log(this.name)}}var obj2 = {name: 'jock',age: 18,sayName: function() {console.log(this.name)}}
var Person = {};//相当于var Person = new Object();var Person = { name:'Nike'; age:29; }

字面量的缺点是当我i们创建多个相似的对象的时候,它仍然不够灵活,依然会产生重复代码。

对象字面量是对象定义的一种简写形式,目的在于简化创建包含大量属性的对象的过程。也就是说,第一种和第二种方式创建对象的方法其实都是一样的,只是写法上的区别不同

3、工厂模式

在介绍第三种的创建方法之前,我们应该要明白为什么还要用别的方法来创建对象,也就是第一种,第二种方法的缺点所在:它们都是用了同一个接口创建很多对象,会产生大量的重复代码,就是如果你有100个对象,那你要输入100次很多相同的代码。那我们有什么方法来避免过多的重复代码呢,就是把创建对象的过程封装在函数体内,通过函数的调用直接生成对象。

function person(name, age) { var obj = { name: name, age: age, sayName: function() { console.log(this.name) } } return obj }console.log(person('tom', 18))console.log(person('jony', '19'))

第三种:使用工厂模式创建对象

工厂函数的问题在于它所创建的对象没有具体的类型,所有通过工厂函数所创建的对象的类型都是Object

function createPerson{ var o = new Object(); o.name = name; o.age = age; o.job = job; o.sayName = function; }; return o; }var person1 = createPerson;var person2 = createPerson;

4、构造函数方式

在使用工厂模式创建对象的时候,我们都可以注意到,在createPerson函数中,返回的是一个对象。那么我们就无法判断返回的对象究竟是一个什么样的类型。于是就出现了第四种创建对象的模式。

function Person(name, age) { this.name = name; this.age = age; this.setName = function(name) { this.name = name }}var p1 = new Person('tom', 16);var p2 = new Person('jony', 18);console.log(p1)console.log(p2)

第四种:使用构造函数创建对象

通过构造函数方法创建对象代码足够简洁,所创建的对象也有自己的类,但是当我们同时创建多个对象的时候会发现,所创建的对象都包含相同的方法,这是一种浪费内存的表现。

function Person{ this.name = name; this.age = age; this.job = job; this.sayName = function; }; }var person1 = new Person;var person2 = new Person;

5、构造函数加原型

对比工厂模式,我们可以发现以下区别:

function Person(name, age) { this.name = name; this.age = age;}Person.prototype.setName = function(name) { this.name = name}

1.没有显示地创建对象

我们把构造函数的方法扩展到它的原型上,这样就不存在创建对象的时候同时创建多个方法了。

2.直接将属性和方法赋给了this对象

本文由10bet发布于Web前端,转载请注明出处:常见的对象创建模式

关键词:

上一篇:10/12 js小总结

下一篇:没有了

频道精选

最火资讯