详解JavaScript的Object对象

一、Object 是什么？

Object 是 JavaScript 的一种 数据类型 ，用于存储各种键值集合和更复杂的实体，几乎所有对象都是 Object 类型的实例，它们都会从 Object.prototype 继承属性和方法，虽然大部分属性都会被覆盖（shadowed）或者说被重写了（overridden）。

一个对象就是一系列属性的集合，属性包括名字和值。如果属性值是函数，那么称之为方法。

---

1、创建新对象

• 法一：使用 对象初始化器 创建对象

var myCar = {
  name: "john",
  age: 22
}

• 法二：使用 new 关键字创建对象

function Car(make, model, year) {
  this.make = make;
  this.model = model;
  this.year = year;
}
var mycar = new Car("Eagle", "Talon TSi", 1993);

• 法三：使用 Object.create 创建对象

// Animal properties and method encapsulation
var Animal = {
  type: "Invertebrates", // 属性默认值
  displayType : function() {  // 用于显示type属性的方法
    console.log(this.type);
  }
}

// 创建一种新的动物——animal1
var animal1 = Object.create(Animal);
animal1.displayType(); // Output:Invertebrates

---

2、设置和删除属性

// 3中设置属性的方式
var myCar = new Object();
myCar.make = "Ford";
myCar["model"] = "Mustang";
var propertyName = "other";
myCar[propertyName] = "title";
console.log(myCar);

// 删除属性
delete myCar.make;

---

3、遍历对象属性

三种方式遍历对象中属性。

var myCar = {
  name:"john",
  age:22
}

// 法一：
function showProps(obj, objName) {
  var result = "";
  for (var i in obj) {
    if (obj.hasOwnProperty(i)) {
        result += objName + "." + i + " = " + obj[i] + "\n";
    }
  }
  return result;
}
console.log(showProps(myCar, "myCar")); 

// 法二
console.log(Object.keys(myCar));
// 法三
console.log(Object.getOwnPropertyNames(myCar));

---

4、定义方法

用函数作为对象的属性值，称之为方法。set、get等更多内容，看这里！

var myObj = {
  myMethod: function(params) {
    // ...do something
  }

  // 或者 这样写也可以

  myOtherMethod(params) {
    // ...do something else
  }
};

---

5、对象比较

两个对象实例永远不会相等，即时他们的属性完全相同。

// 两个变量, 两个具有同样的属性、但不相同的对象
var fruit = {name: "apple"};
var fruitbear = {name: "apple"};
fruit == fruitbear // return false
fruit === fruitbear // return false

// 两个变量, 同一个对象
var fruit = {name: "apple"};
var fruitbear = fruit;  
fruit == fruitbear // return true
fruit === fruitbear // return true

---

二、Object 常用方法

1、Object.defineProperty

• 功能：增加或修改对象的属性值。更多内容，看这里！

  // 1、语法
  Object.defineProperty(obj, prop, descriptor)

  // 2、使用方法
  const object1 = {};
  
  Object.defineProperty(object1, 'property1', {
    value: 42,
    writable: false
  });
  
  object1.property1 = 77;
  // throws an error in strict mode
  
  console.log(object1.property1);
  // expected output: 42

---

2、Object.assign

• 功能：通过复制一个或多个对象来创建一个新的对象。。更多内容，看这里！

  // 语法
  Object.assign(target, ...sources)

  // 1、复制一个对象
  const obj = { a: 1 };
  const copy = Object.assign({}, obj);
  console.log(copy); // { a: 1 }
  
  // 2、合并相同属性
  const o1 = { a: 1, b: 1, c: 1 };
  const o2 = { b: 2, c: 2 };
  const o3 = { c: 3 };
  const obj = Object.assign({}, o1, o2, o3);
  console.log(obj); // { a: 1, b: 2, c: 3 }
  
  // 3、继承和非可枚举属性不能拷贝
  const obj = Object.create({foo: 1}, { // foo 是个继承属性。
      bar: {
          value: 2  // bar 是个不可枚举属性。
      },
      baz: {
          value: 3,
          enumerable: true  // baz 是个自身可枚举属性。
      }
  });
  const copy = Object.assign({}, obj);
  console.log(copy); // { baz: 3 }

---

3、Object.create

• 功能：使用指定的对象和属性创建一个新对象。更多内容，看这里！

  const person = {
    isHuman: false,
    printIntroduction: function() {
      console.log(`My name is ${this.name}. Am I human? ${this.isHuman}`);
    }
  };
  
  const me = Object.create(person);
  
  me.name = 'Matthew'; // "name" is a property set on "me", but not on "person"
  me.isHuman = true; // inherited properties can be overwritten
  
  me.printIntroduction();
  // expected output: "My name is Matthew. Am I human? true"

---

三、prototype (继承)

JavaScript 的每个实例对象都有一个指向上一层对象的私有属性（称之为 __proto__） ，上一层对象又指向再上一层对象，就这样层层向上直至 __proto__ 属性为 null ，最后这个对象就是 Object 。

这种通过 __proto__ 属性来链接对象的方法，称之为 原型链 。继承特性也是基于它。详细内容，看这里！

---

四、参考文档

• 详解JavaScript的Object对象