1.最简单的创建对象方法

var person = new Object();
person.name = "sam wu";
person.age = 25;
person.job = "frontend engineer";
person.sayName = function(){
alert(this.name);
}; person.sayName();

2.工厂模式创建对象

function createPerson(name, age, job){
var o = new Object();
o.name = name;
o.age = age;
o.job = job;
o.sayName = function(){
alert(this.name);
};
return o;
} var person1 = createPerson("sam", 29, "frontend Engineer");
var person2 = createPerson("rendy", 27, "Python"); person1.sayName(); //"sam"
person2.sayName(); //"rendy"

3.构造函数模式

function Person(name, age, job){
this.name = name;
this.age = age;
this.job = job;
this.sayName = function(){
alert(this.name);
};
} var person1 = new Person("sam", 29, "frontend Engineer");
var person2 = new Person("rendy", 27, "Python"); person1.sayName(); //"sam"
person2.sayName(); //"rendy" alert(person1 instanceof Object); //true
alert(person1 instanceof Person); //true
alert(person2 instanceof Object); //true
alert(person2 instanceof Person); //true alert(person1.constructor == Person); //true
alert(person2.constructor == Person); //true alert(person1.sayName == person2.sayName); //false

4.原型模式

可以让多个实例,共享属性和方法。

function Person(){
} Person.prototype.name = "sam";
Person.prototype.age = 25;
Person.prototype.job = "Software Engineer";
Person.prototype.sayName = function(){
alert(this.name);
}; var person1 = new Person();
person1.sayName(); //"sam" var person2 = new Person();
person2.sayName(); //"sam" alert(person1.sayName == person2.sayName); //true alert(Person.prototype.isPrototypeOf(person1)); //true
alert(Person.prototype.isPrototypeOf(person2)); //true //only works if Object.getPrototypeOf() is available.ECMA5支持
if (Object.getPrototypeOf){
alert(Object.getPrototypeOf(person1) == Person.prototype); //true
alert(Object.getPrototypeOf(person1).name); //"sam"
}

4.1 实例对象属性和原型属性的优先级

function Person(){
} Person.prototype.name = "sam";
Person.prototype.age = 29;
Person.prototype.job = "Software Engineer";
Person.prototype.sayName = function(){
alert(this.name);
}; var person1 = new Person();
var person2 = new Person(); person1.name = "Rendy";
alert(person1.name); //"Rendy" – from instance 来自对象
alert(person2.name); //"sam" – from prototype 来自原型属性

4.2 同名,只是屏蔽,非覆盖

function Person(){
} Person.prototype.name = "sam";
Person.prototype.age = 29;
Person.prototype.job = "Software Engineer";
Person.prototype.sayName = function(){
alert(this.name);
}; var person1 = new Person();
var person2 = new Person(); person1.name = "rendy";
alert(person1.name); //"rendy" – from instance
alert(person2.name); //"sam" – from prototype delete person1.name;
alert(person1.name); //"sam" - from the prototype

5.组合使用构造函数模式和原型模式

function Person(name, age, job){
this.name = name;
this.age = age;
this.job = job;
this.friends = ["Shelby", "Court"];
} Person.prototype = {
constructor: Person,
sayName : function () {
alert(this.name);
}
}; var person1 = new Person("sam", 29, "Frontend Engineer");
var person2 = new Person("rendy", 27, "Python"); person1.friends.push("christ"); alert(person1.friends); //"Shelby,Court,christ"
alert(person2.friends); //"Shelby,Court"
alert(person1.friends === person2.friends); //false
alert(person1.sayName === person2.sayName); //true

6.寄生构造函数函数模式

function Person(name, age, job){
var o = new Object();
o.name = name;
o.age = age;
o.job = job;
o.sayName = function(){
alert(this.name);
};
return o;
} // 这里用了new关键字,但是Person函数的内容是返回一个对象。这样就不会生成一个新的实例。而是跟工厂模式效果一样。
var friend = new Person("sam", 25, "Front Engineer");
friend.sayName(); //"sam"

以上内容来自《JavaScript高级程序设计第三版》

面向对象的JavaScript系列一,创建对象的更多相关文章

  1. 面向对象的JavaScript系列二,继承

    1.原型链 function SuperType(){ this.property = true; } SuperType.prototype.getSuperValue = function(){ ...

  2. 面向对象的 JavaScript

    面向对象的javascript 一.创建对象 创建对象的几种方式: var obj = {}; var obj = new Object(); var obj = Object.create(fath ...

  3. (一)我的Javascript系列:Javascript的面向对象旅程(上)

    今宵酒醒何处,杨柳岸,晓风残月 导引 我的JavaScript系列文章是我自己对JavaScript语言的感悟所撰写的系列文章.现在还没有写完.目前一共出了下面的系列: (三)我的JavaScript ...

  4. javaScript系列 [06]-javaScript和this

    在javaScript系列 [01]-javaScript函数基础这篇文章中我已经简单介绍了JavaScript语言在函数使用中this的指向问题,虽然篇幅不长,但其实最重要的部分已经讲清楚了,这篇文 ...

  5. 深入理解JavaScript系列(18):面向对象编程之ECMAScript实现(推荐)

    介绍 本章是关于ECMAScript面向对象实现的第2篇,第1篇我们讨论的是概论和CEMAScript的比较,如果你还没有读第1篇,在进行本章之前,我强烈建议你先读一下第1篇,因为本篇实在太长了(35 ...

  6. 深入理解JavaScript系列(10):JavaScript核心(晋级高手必读篇)

    本篇是ECMA-262-3 in detail系列的一个概述(本人后续会翻译整理这些文章到本系列(第11-19章).每个章节都有一个更详细的内容链接,你可以继续读一下每个章节对应的详细内容链接进行更深 ...

  7. JavaScript系列--浅析原型链与继承

    一.前言 继承是面向对象(OOP)语言中的一个最为人津津乐道的概念.许多面对对象(OOP)语言都支持两种继承方式::接口继承 和 实现继承 . 接口继承只继承方法签名,而实现继承则继承实际的方法.由于 ...

  8. 前端开发:面向对象与javascript中的面向对象实现(二)构造函数与原型

    前端开发:面向对象与javascript中的面向对象实现(二)构造函数与原型 前言(题外话): 有人说拖延症是一个绝症,哎呀治不好了.先不说这是一个每个人都多多少少会有的,也不管它究竟对生活有多么大的 ...

  9. javascript系列之this

    原文:javascript系列之this 引言 在这篇文章里我们将会讨论与执行上下文直接相关的更多细节.讨论的主题就是this关键字.实践证明,这个主题是足够难的并且在不同的执行上下文中判定this的 ...

随机推荐

  1. spring 事件(Application Event)

    spring 事件为bean 与 bean之间传递消息.一个bean处理完了希望其余一个接着处理.这时我们就需要其余的一个bean监听当前bean所发送的事件. spring事件使用步骤如下: 1.先 ...

  2. LR 常见问题收集及总结

    一:LoadRunner常见问题整理 1.LR 脚本为空的解决方法: 1.去掉ie设置中的第三方支持取消掉 2.在系统属性-高级-性能-数据执行保护中,添加loadrunner安装目录中的vugen. ...

  3. win7中搜索文件内容的方法

    打开“控制面板”,选择“大类别”或“小类别”,然后打开 “索引选项”.点击“高级”按钮,在弹出的对话框中打开“文件类型”标签,在下方的输入框中“将新扩展名添加到列表中”,添加要搜索的未知文本文件的扩展 ...

  4. 几个常见的Laravel报错及解决方法

    报错:「Can't swap PDO instance while within transaction」 transactions >= 1) {throw new RuntimeExcept ...

  5. mina

    http://bsr1983.iteye.com/blog/1886296 http://blog.csdn.net/defonds/article/category/1844073(这个网站原创最全 ...

  6. C#:DataTable内容转换为String(XML)

    //DataTable转String方法 public static String DataTable2String(DataTable dt) { string strXML = "< ...

  7. myeclipse 常用快捷键总结

    1 shift+enter 不管鼠标在当前行的什么位置,重新开启一行(向下) 2 shift+ctrl+enter 不管鼠标在当前行的什么位置,重新开启一行(向上) 3 Ctrl+D     删除一行 ...

  8. java double类型保留两位小数4种方法【转】

    4种方法,都是四舍五入,例: import java.math.BigDecimal; import java.text.DecimalFormat; import java.text.NumberF ...

  9. (java)==和equals()的使用小结

    1.如果两个变量说基本数据类型,且都是数值类型,eg.65f,65(不一定要求数据类型严格相同),只要两个变量的值相等,就将返回true int it=65; float fl=65.0f; char ...

  10. 深入Linux网络核心堆栈(对于netfilter的用法和讲解)

    http://blog.csdn.net/wswifth/article/details/5115475 注册一个hook函数是围绕nf_hook_ops数据结构的一个非常简单的操作,nf_hook_ ...