JavaScript 对象

JavaScript 对象

JavaScript 的设计是一个简单的基于对象的范式。一个对象就是一系列属性的集合，一个属性包含一个名和一个值。一个属性的值可以是函数，这种情况下属性也被称为方法。除了浏览器里面预定义的那些对象之外，你也可以定义你自己的对象。本章节讲述了怎么使用对象、属性、函数和方法，怎样实现自定义对象。

对象概述

javascript 中的对象 (物体)，和其它编程语言中的对象一样，可以比照现实生活中的对象 (物体) 来理解它。javascript 中对象 (物体) 的概念可以比照着现实生活中实实在在的物体来理解。

在 javascript 中，一个对象可以是一个单独的拥有属性和类型的实体。我们拿它和一个杯子做下类比。一个杯子是一个对象 (物体)，拥有属性。杯子有颜色，图案，重量，由什么材质构成等等。同样，javascript 对象也有属性来定义它的特征。

对象和属性
一个 javascript 对象有很多属性。一个对象的属性可以被解释成一个附加到对象上的变量。对象的属性和普通的 javascript 变量基本没什么区别，仅仅是属性属于某个对象。属性定义了对象的特征。你可以通过点符号来访问一个对象的属性。

objectName.propertyName

和其他 javascript 变量一样，对象的名字 (可以是普通的变量) 和属性的名字都是大小写敏感的。你可以在定义一个属性的时候就给它赋值。例如，我们创建一个 myCar 的对象然后给他三个属性，make，model，year。具体如下所示：

var myCar = new Object();
myCar.make = "Ford";
myCar.model = "Mustang";
myCar.year = 1969;

对象中未赋值的属性的值为undefined（而不是null）。

myCar.noProperty; // undefined

JavaScript 对象的属性也可以通过方括号访问或者设置（更多信息查看 property accessors）. 对象有时也被叫作关联数组，因为每个属性都有一个用于访问它的字符串值。例如，你可以按如下方式访问 myCar 对象的属性：

myCar["make"] = "Ford";
myCar["model"] = "Mustang";
myCar["year"] = 1969;

一个对象的属性名可以是任何有效的 JavaScript 字符串，或者可以被转换为字符串的任何类型，包括空字符串。然而，一个属性的名称如果不是一个有效的 JavaScript 标识符（例如，一个由空格或连字符，或者以数字开头的属性名），就只能通过方括号标记访问。这个标记法在属性名称是动态判定（属性名只有到运行时才能判定）时非常有用。例如：

// 同时创建四个变量，用逗号分隔
var myObj = new Object(),
    str = "myString",
    rand = Math.random(),
    obj = new Object();

myObj.type              = "Dot syntax";
myObj["date created"]   = "String with space";
myObj[str]              = "String value";
myObj[rand]             = "Random Number";
myObj[obj]              = "Object";
myObj[""]               = "Even an empty string";

console.log(myObj);

请注意，方括号中的所有键都将转换为字符串类型，因为 JavaScript 中的对象只能使用 String 类型作为键类型。例如，在上面的代码中，当将键 obj 添加到 myObj 时，JavaScript 将调用 obj.toString() 方法，并将此结果字符串用作新键。

你也可以通过存储在变量中的字符串来访问属性：

var propertyName = "make";
  myCar[propertyName] = "Ford";

  propertyName = "model";
  myCar[propertyName] = "Mustang";

你可以在 for…in 语句中使用方括号标记以枚举一个对象的所有属性。为了展示它如何工作，下面的函数当你将对象及其名称作为参数传入时，显示对象的属性：

function showProps(obj, objName) {
  var result = "";
  for (var i in obj) {
    if (obj.hasOwnProperty(i)) {
        result += objName + "." + i + " = " + obj[i] + "\n";
    }
  }
  return result;
}

因而，对于函数调用 showProps(myCar, “myCar”) 将返回以下值：

myCar.make = Ford
myCar.model = Mustang
myCar.year = 1969

所有事物都是对象

JavaScript 提供多个内建对象，比如 String、Date、Array 等等。 对象只是带有属性和方法的特殊数据类型。

• 布尔型可以是一个对象。
• 数字型可以是一个对象。
• 字符串也可以是一个对象
• 日期是一个对象
• 数学和正则表达式也是对象
• 数组是一个对象
• 甚至函数也可以是对象

创建 JavaScript 对象

通过 JavaScript，您能够定义并创建自己的对象。

创建新对象有两种不同的方法：

• 使用 Object 定义并创建对象的实例。
• 使用函数来定义对象，然后创建新的对象实例。

使用 Object

在 JavaScript 中，几乎所有的对象都是 Object 类型的实例，它们都会从 Object.prototype 继承属性和方法。

Object 构造函数创建一个对象包装器。

Object 构造函数，会根据给定的参数创建对象，具体有以下情况：

如果给定值是 null 或 undefined，将会创建并返回一个空对象。
如果传进去的是一个基本类型的值，则会构造其包装类型的对象。
如果传进去的是引用类型的值，仍然会返回这个值，经他们复制的变量保有和源对象相同的引用地址。
当以非构造函数形式被调用时，Object 的行为等同于 new Object()。
语法格式：

// 以构造函数形式来调用
new Object([value])

value 可以是任何值。

以下实例使用 Object 生成布尔对象：

// 等价于 o = new Boolean(true);
var o = new Object(true);

这个例子创建了对象的一个新实例，并向其添加了四个属性：

person=new Object();
person.firstname="John";
person.lastname="Doe";
person.age=50;
person.eyecolor="blue";

宿主对象

首先我们来看看宿主对象

JavaScript宿主对象千奇百怪，但是前端最熟悉得无疑是浏览器环境中的宿主了。

在浏览器环境中，我们都知道全局环境对象是window，window上又有很多属性，例如document。

实际上，这个全局对象window上的属性，一部分来自JavaScript语言，一部分来自浏览器环境。

JavaScript标准中规定了全局对象属性，w3c的各种标准中规定了window对象的其它属性。

宿主对象也分固有的和用户可创建的两种，比如document.createElement来创建img元素。

内置对象-固有对象

在前面说过，固有对象是由标准规定，随着JavaScript运行时创建而自动创建的对象实例。

固有对象在任何JavaScript代码执行前就已经被创建出来了，他们通常扮演着类似基础库的角色，我们前面提到的’类’其实就是固有对象的一种。

内置对象-原生对象

我们把JavaScript中，能够通过语言本身的构造器创建的对象称为原生对象。在JavaScript标准中，提供了30多个构造器。按照我的理解，按照不同的应用场景，我把原生对象分成了一下几个种类。

通过这些构造器，我们可以用new运算符创建新的对象，所以我们把这些对象称做原生对象。

几乎所有的这些构造器的能力都是无法用纯JavaScript代码实现的，我们也无法用class/extends语法来继承。

这些构造器创建的对象多数使用了私有字段，例如：

Error: [[ErrorData]]
Boolean: [[BooleanData]]
Number: [[NumberData]]
Date: [[DateValue]]
RegExp: [[RegExpMatcher]]
Symbol: [[SymbolData]]
Map: [[MapData]]

这些字段使得原型继承方法无法正常工作，所以我们可以认为，所有这些原生对象都是为了特定能力或者性能，而设计出来的’特权对象’。