Javascript 分配和删除属性

Question

谁能给我解释一下这里到底发生了什么？

var myObject = {
  price: 20.99,
  get_price: function() {
    return this.price;
  }
};

var customObject = Object.create(myObject);
customObject.price = 19.99;
delete customObject.price;
console.log(customObject.get_price()); //returns 20.99

Answer 1

这是由于 prototype-chain 的后果造成的。声明

var customObject = Object.create(myObject);

创建一个对象，其原型设置为 myObject。现在您正在分配和删除属性 price 。但它不会改变其原型中已有的内容。

您可以尝试在删除属性 price 之前将 customObject 打印到控制台。您会看到该对象包含一个属性 price，其值设置为 19.99，但它的 __proto__ 属性的 price 仍然是 20.99。运行以下代码段，并观察浏览器控制台中的输出。

var myObject = {
  price: 20.99,
  get_price: function() {
    return this.price;
  }
};

var customObject = Object.create(myObject);
customObject.price = 19.99;
console.log(customObject);

函数get_pricereturnsthis.price，在当前对象中寻找一个属性price，没有找到则递归遍历属性的原型链。由于此属性存在于对象的直接原型中，因此返回值 20.99。

Answer 2

Javascript中的所有对象都有一个__proto__属性，称为它的原型。（它与某些功能上的 prototype 属性不同，原因我不会讨论。）

原型链是请求时查找某些名称的顺序。例如dog.bark会在dog中搜索'bark'，但是如果dog没有'bark'属性，它会在'bark'中搜索dog.__proto__ 依此类推，直到到达 原型链的末端 .

使用括号语法 ({}) 声明的新对象将 Object 作为其原型。

函数 Object.create(some) returns 一个以 some 为原型的新对象。（some 可以 null 创建一个没有原型的对象）。

var myObject = {
  price: 20.99,
  get_price: function() {
    return this.price;
  }
};
var customObject = Object.create(myObject);
customObject.price = 19.99; // *
delete customObject.price; // **
console.log(customObject.get_price());

在 * 中对象 customObject 看起来像这样：

customObject = {
  price: 19.99,
  __proto__: {
    price: 29.99,
    get_price: function() { return this.price; }
  }
};

在 ** 中对象 customObject 看起来像这样：

customObject = {
  __proto__: {
    price: 29.99,
    get_price: function() { return this.price; }
  }
};

delete operator只删除自己的属性，这意味着那些直接属于对象的属性（而不是它的原型）。

因此我们删除了 price: 19.99，现在我们在尝试获取 customObject.price 时得到 price: 29.99（这正是 get_price 所做的）。

如果我们调用 myObject.get_price()，我们得到 myObject.price，而在 customObject.get_price() 中，我们得到 customObject.price。虽然get_price函数实际上是在customObject.__proto__内部，但是函数调用中的特殊变量this指的是函数被调用的对象，而不是函数所属的对象.

如果您认为同一个函数可以属于不同的对象，这就说得通了。

Javascript 分配和删除属性

Javascript Assign and delete properties

javascript

properties

object

assign