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 条评论
登录 后参与评论

相关文章

来自专栏Golang语言社区

厚土Go学习笔记 | 28. go语言没有类 却可以在结构体或任意类型定义方法

在go语言中没有类。可是,是有方法的。 给结构体定义方法,在对应的 func 和方法名之间,加上方法的接收者就可以了。 比如,我们定义了一个结构体 type V...

3678
来自专栏一名叫大蕉的程序员

大数据计数原理1+0=1这你都不会算(一)No.47

hello哈,大家是不是好久没见到我啦?我也是一直在摸索小伙伴们喜欢看到什么东西,不喜欢看什么东西,还请大家多多支持。为了表示感谢。小蕉在这给你们一鞠躬,二鞠躬...

1885
来自专栏java达人

HashMap庖丁解牛

感谢erixhao的作品,长文需细品: Code Walkthrough是我们新的一个系列,主要以阅读,分析源代码为主要目的,特此介绍一下。我们先以最经典的JD...

1929
来自专栏Java爬坑系列

【Java入门提高篇】Day26 Java容器类详解(八)HashSet源码分析

  前面花了好几篇的篇幅把HashMap里里外外说了个遍,大家可能对于源码分析篇已经讳莫如深了。

684
来自专栏lonelydawn的前端猿区

Node.js力破江苏网警刑侦科推理试题

月前,江苏网警 在微博发布了一套《2018年刑侦科目推理试题》,可谓难倒了诸多英雄好汉,评论区内更是一片皮皮之音。 @二向箔icon: 高考前班主任教过我们,...

2627
来自专栏熊二哥

JDK1.8快速入门

JDK8提供了非常多的便捷用法和语法糖,其编码效率几乎接近于C#开发,maven则是java目前为止最赞的jar包管理和build工具,这两部分内容都不算多,就...

1849
来自专栏霍丙乾的专栏

你绝对想不到 Kotlin 泛型给反射留下了怎样的坑!

今天就要给大家展示一段有坑的代码。本文需要你对泛型和反射有相对深入的了解,反正。阅读过程中有任何不适,本人概不负责。:)逃

2.8K1
来自专栏落影的专栏

程序员进阶之算法练习(九)附两道扩展题答案

前言 在上文程序员进阶之算法练习(八)附两道搜狐笔试题中,在搜狐笔试题的基础上稍微改编后的题目: 《宝石二》 有一串宝石首尾相连,用一个大写字母表示一个宝...

4037
来自专栏Golang语言社区

厚土Go学习笔记 | 29. 接口

在go语言中,接口类型是由一组方法定义的集合。 一个类型是否实现了一个接口,就看这个类型是否实现了接口中定义的所有方法。在go语言中,无需特别的指明? 定义一个...

36312
来自专栏difcareer的技术笔记

JNI实现源码分析【四 函数调用】正文0x01:dvmCallMethodV0x02:nativeFunc0x03: 何时赋值

有了前面的铺垫,终于可以说说虚拟机是如何调用JNI方法的了。JNI方法,对应Java中的native方法,所以我们跟踪对Native方法的处理即可。

664

扫描关注云+社区