概述

   在JavaScript中， 对象向我们提供了一种存储，操作，并在网络中传输数据的方式。同时，把对象当成键值对的集合，给我们带来了一种最常用的创建JavaScript对象的方法。

使用对象字面值(object literal)创建对象

   在JavaScript中，这是创建对象最简单的方式。语法如下:

1
2
3
4

var person = {
    firstName: 'san',
    lastName: 'zhang'
}

使用new关键字创建对象

   这种创建对象的方式，类似于在其他面向对象的语言中创建对象，如Java。顺便说一下，从ES6开始，类在JavaScript中是原生存在的，可以通过定义类来创建对象。使用new关键字创建对象，需要一个构造器函数。

   使用new关键字创建对象，有如下两种形式:

使用内建的Object构造器函数

   创建对象:

1

var person = new Object()

   向对象添加属性:

1
2

person.firtName = 'san'
person.lastName = 'zhang'

   不推荐使用这种方式创建对象，因为会涉及到作用域解析，JavaScript会去检测构造器函数是用户创建的还是系统内建的。

使用用户定义的构造器函数

   使用Object()构造器函数创建对象的问题是每次创建完对象，都需要手工去为对象添加属性。
为了避免每次都需要手工为对象添加属性，我们可以创建一个自定义函数。首先，我们创建一个构造器函数，然后使用new关键字创建对象。

1
2
3
4
5
6

function Person(firstName, lastName) {
  this.firstName = firstName
  this.lastName = lastName
}
var person = new Person("san", "zhang")
var person1 = new Person("si", "li")

   在这种创建对象的方式中，new关键字执行了以下步骤:

1. 调用函数

2. 修改this关键字指向，将该函数的this指向一个新对象

3. 将新对象的原型(prototype)绑定到函数的原型

   代码说明如下:

1
2
3
4
5
6
7
8

// new关键字
function Person(name) {
  this.name = name
}
var person = new Person("tudouya")

// 等价代码
var person1 = Object.create(Person.prototype)

原型(Prototype)方法创建对象

   使用原型方法创建对象，代码如下:

1
2
3

function Person(){};

Person.prototype.name = "tudouya";

原型和函数结合创建对象

   代码如下:

1
2
3
4
5
6

function Person(name){
  this.name = name;
} 
Person.prototype.getName = function(){
  return this.name
}

使用Object.create()方法创建对象

   使用这种方式创建对象，可以很方便的从一个已经存在的对象创建一个新对象，而不用使用new关键字。

   Object.create()方法基于一个已经存在的对象作为新创建对象的原型。

   使用Object.create()方法创建对象，只需要记住它需要传入两个参数。第一个参数可以是任意一个对象，该对象作为新创建对象的原型。第二个参数是可选参数，类型是对象，该对象包含向新创建对象添加的属性。

   假设有一个班级对象Class:  

1

var classObj = { className: "一班", studentNum: 100 }

   现在想为这个班级创建一个学生，可以使用如下方式:

1
2
3
4
5
6
7
8

var studentObj = Object.create(classObj, {
  studentName: {
    value: "小明"
  },
  studentAge: {
    value: 29
  }
})

   注意第二个参数的写法

使用Object.assign()方法创建对象

   假如我们想创建一个拥有一个以上对象的所有属性的新对象，Object.assign()方法可以实现这种目的。

   Object.assign()方法用来将一个或多个源对象的所有可枚举的属性拷贝到一个目标对象中。

   Object.assign()可以接受任意数量的对象作为参数。第一个参数是他即将创建，并且返回的参数。其余传入的对象参数，被用来将属性复制到新对象中。

   假设有如下两个对象:

1
2

var orgObj = { company: "Baidu" }
var carObj = { carName: "Kayan" }

   现在需要一个在Baidu公司开着Kayan的员工，可以使用如下方式创建对象:

1

var employee = Object.assign({}, carObj, orgObj)

singleton(单例)方法创建对象

   代码如下:

1
2
3

var person = new function(){
  this.name = "tudouya"
}

使用ES6 class创建对象

   使用ES6 class创建对象与使用用户定义的函数构造器创建对象方法类似。构造器函数被类替代，因为它遵循ES6规范。

   示例如下:

1
2
3
4
5
6
7

class Person {
  constructor(firstName, lastName) {
    this.firstName = firstName
    this.lastName = lastName
  }
}
var person = new Person("san", "zhang")

参考

• Different ways of creating an Object in javascript

• Which way is best for creating an object in JavaScript? Is var necessary before an object property?

• How to create objects in JavaScript

建议继续学习：

1. 面向对象的Shell脚本    (阅读：5141)
2. 用星际争霸讲解面向对象的概念    (阅读：4137)
3. 使用PHP创建一个面向对象的博客    (阅读：4054)
4. PHP面向对象编程的三大特性    (阅读：3325)
5. 面向对象设计模式的核心法则    (阅读：3151)
6. PHP内核介绍及扩展开发指南―类和对象    (阅读：2949)
7. 对象的消息模型    (阅读：2485)
8. jQuery之jQuery方法总是返回jQuery对象    (阅读：2354)
9. 我所偏爱的 C 语言面向对象编程范式    (阅读：2055)
10. 细说JavaScript中对象的属性和方法    (阅读：2025)