JavaScript对象创建的九种方式

1、标准创建对象模式

1 var person = new Object();
2 person.name = "Nicholas";
3 person.age = 29;
4 person.job = "Software Engineer";
5 person.sayName = function(){alert(this.name);};

2、字面量模式

1 var person = {
2     name: "Nicholas",
3     age: 29,
4     job: "Software Engineer",
5     sayName: function(){alert(this.name);}
6 };

3、工厂模式

 1 function createPerson(name, age, job){
 2     var o = new Object();
 3     o.name = name;
 4     o.age = age;
 5     o.job = job;
 6     o.sayName = function(){alert(this.name);};
 7     return o;
 8 }
 9 var person1 = createPerson("Nicholas", 29, "Software Engineer");
10 var person2 = createPerson("Greg", 27, "Doctor");

4、构造函数模式

1 function Person(name, age, job){
2     this.name = name;
3     this.age = age;
4     this.job = job;
5     this.sayName = function(){alert(this.name);};
6 }
7 var person1 = new Person("Nicholas", 29, "Software Engineer");
8 var person2 = new Person("Greg", 27, "Doctor");

5、原型模式

 1 function Person(){}
 2 Person.prototype.name = "Nicholas";
 3 Person.prototype.age = 29;
 4 Person.prototype.job = "Software Engineer";
 5 Person.prototype.sayName = function(){alert(this.name);};
 6 var person1 = new Person();
 7 person1.sayName(); //"Nicholas"
 8 var person2 = new Person();
 9 person2.sayName(); //"Nicholas"
10 alert(person1.sayName == person2.sayName); //true

6、组合构造函数和原型模式

 1 function Person(name, age, job){
 2     this.name = name;
 3     this.age = age;
 4     this.job = job;
 5     this.friends = ["Shelby", "Court"];
 6 }
 7 Person.prototype = {
 8     constructor : Person,
 9     sayName : function(){alert(this.name);}
10 }
11 var person1 = new Person("Nicholas", 29, "Software Engineer");
12 var person2 = new Person("Greg", 27, "Doctor");
13 person1.friends.push("Van");
14 alert(person1.friends); //"Shelby,Count,Van"
15 alert(person2.friends); //"Shelby,Count"
16 alert(person1.friends === person2.friends); //false
17 alert(person1.sayName === person2.sayName); //true

7、动态原型模式(这里只在 sayName()方法不存在的情况下,才会将它添加到原型中。)

 1 function Person(name, age, job){
 2     this.name = name;
 3     this.age = age;
 4     this.job = job;
 5     if (typeof this.sayName != "function"){
 6         Person.prototype.sayName = function(){alert(this.name);};
 7     }
 8 }
 9 var friend = new Person("Nicholas", 29, "Software Engineer");
10 friend.sayName(); 

8、寄生构造函数模式(除了使用 new 操作符并把使用的包装函数叫做构造函数之外,这个模式跟工厂模式其实是一模一样的。)

 1 function Person(name, age, job){
 2     var o = new Object();
 3     o.name = name;
 4     o.age = age;
 5     o.job = job;
 6     o.sayName = function(){alert(this.name);};
 7     return o;
 8 }
 9 var friend = new Person("Nicholas", 29, "Software Engineer");
10 friend.sayName(); //"Nicholas"

9、稳妥构造函数模式(一是新创建对象的实例方法不引用 this;二是不使用 new 操作符调用构造函数)

function Person(name, age, job){
    var o = new Object();
    o.sayName = function(){alert(name);};
    return o;
}
var friend = Person("Nicholas", 29, "Software Engineer");
friend.sayName(); //"Nicholas"

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏LinkedBear的个人空间

Excel的复合表头设计——Poi+树型数据结构 顶

一个MIS中,可能多多少少会跟报表扯上关系,对于Java开发中,可能用的比较多的报表设计就是POI构造Excel了吧。前些时间专门把这部分拿出来又回头看了看,品...

502
来自专栏一个会写诗的程序员的博客

使用 layui 后端分页的实例

https://github.com/KotlinSpringBoot/saber

782
来自专栏一个会写诗的程序员的博客

《Kotlin 程序设计》第十一章 Kotlin实现DSL

DSL 即 domain-specific languages,领域特定语言。和一般的编程语言不同,领域特定语言只能用于特定的领域中并且表现形式有限。领域特定语...

852
来自专栏我就是马云飞

Retrofit源码模拟

如果要进行网络请求,你可能会这样写一个简单的OKHttp请求 public class CallExector { public static fin...

19710
来自专栏数据结构与算法

震惊!Vector两行代码求逆序对,六行代码过普通平衡树

Vector两行代码求逆序对 背景:济南集训Day7上午T2,出了一道逆序对的裸题,SB的我没看出是逆序对来,于是现场推了一个很刁钻的求逆序对的方法 首先...

2725
来自专栏noteless

【JAVA集合框架一 】java集合框架官方介绍 Collections Framework Overview 集合框架总览 翻译 javase8 集合官方文档中文版

https://docs.oracle.com/javase/8/docs/technotes/guides/collections/overview.html

462
来自专栏Hellovass 的博客

魔改 TypeAdapterFactory

感慨:Retrofit2 虽好,但是,有时候总感觉 Java 这门语言还是美中不足啊!

681
来自专栏个人随笔

C#编写影院售票系统(A project with a higher amount of gold )(2:相关代码)

此篇文章为项目代码,,,需要项目需求 ,思路分析与窗体效果请访问:http://www.cnblogs.com/lsy131479/p/8367304.html...

2655
来自专栏葬爱家族

Android高德之旅(14)行政区划搜索废话简介总结

前后两千万,拍照更清晰。大家好,这里是OPPO R11独家冠名赞助播出的大型情感类电视连续剧《Android高德之旅》,我是主持人大公爵。(开篇占位)

801
来自专栏IT可乐

mybatis源码解读(五)——sql语句的执行流程

873

扫码关注云+社区