JS创建自定义对象的几种常见方式与比较

发布时间：2018-10-07 05:04:20 所属栏目：模式来源：站长网

导读：初学 Java Script，正在读 Nicholas C. Zakas 的《JavaScript高级程序设计》，看到了创建对象，简单的对书中内容做了一下总结！ Copy to Clipboard 引用的内容：[www.veryhuo.com]!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www

初学JavaScript，正在读 Nicholas C. Zakas 的《JavaScript高级程序设计》，看到了创建对象，简单的对书中内容做了一下总结！

Copy to Clipboard Liehuo.Net Codes

引用的内容：[www.veryhuo.com] <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<body>
<script type="text/javascript">
//1.创建Object，为其添加属性方法
var person = new Object();
person.name = "Nicholas";
person.age = 29;
personal.job = "Software Engineer";

personal.sayName = function () {
alert(this.name);
};

/*
缺点：使用一个接口创建很多对象，会产生大量重复代码
*/

//2.工厂模式
function createPersonal(name, age, job) {
var o = new Object();
o.name = name;
o.age = age;
o.job = job;
o.sayName = function () {
alert(this.name);
};
return o;
}

/*
工厂模式解决了对象相似问题，却没有解决对象识别问题（怎样知道一个对象的类型）
*/

//3.构造函数模式
function Person(name, age, job) {
this.name = name;
this.age = age;
this.job = job;
this.sayName = function () {
alert(this.name);
};
}

/*
构造函数模式没有显式的创建对象，直接将方法和属性赋给了this对象，没有return语句
要创建Person的新实例，必须使用new操作符，实际经历4个步骤
a.创建一个新对象
b.将构造函数的作用域赋给新对象（this指向这个新对象）
c.执行构造函数，为新对象添加属性
d.返回新对象
构造函数模式创建的对象可以识别其类型，但每个方法都要在每个实例上重建一遍
*/

//创建两个实例，创建两个相同的方法没必要，可以把函数定义转到方法外部
function Person(name, age, job) {
this.name = name;
this.age = age;
this.job = job;
this.sayName = sayName;
}

function sayName() {
alert(this.name);
}

/*
这样解决了两个方法做同一件事的的问题，但在全局作用域上定义的函数只能被某个对象调用，如果对象定义需要很多方，就要定义很多全局函数，自定义的引用类型就没有封装性了
*/

//4.原型模式
function Person() {
}

Person.prototype.name = "Nocholas";
Person.prototype.age = 29;
Person.prototype.job = "Software Engineer";
Person.prototype.sayName = function () {
alert(this.name);
}

/*
原型模式所有参数默认取得相同的值，属性若为引用类型，多个实例之间互相影响
*/

//5.构造函数原型混合模式
function Person(name, age, job) {
this.name = name;
this.age = age;
this.job = job;
}

Person.prototype.sayName = function () {
alert(this.name);
}

/*
构造函数用于定义实例属性，原型用于定义方法和共享属性，。eigenvalue实例都会有一份自己实例属性的副本，

同时享用着对共享方法的引用，目前来看几乎是最合适的创建对象方式了 */

</script>
</body>
</html>

（编辑：莆田站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!