覆盖JS中的赋值运算符

Question

var myObject = {"myKey" : "myValue"}
typeof(myObject.myKey) returns `string`

myObject.myKey = "newValue"
console.log(myObject.myKey) prints newValue

这是预期的行为。但是，类似的值写入对document.cookie

不起作用

typeof(document.cookie) returns `string`

但执行document.cookie = "value=123"后，会附加document.cookie字符串，而不是将其值设置为value=123

那么，document.cookie的分配如何被覆盖？

Answer 1

document.cookie有点神奇，但根据您的浏览器限制，您可以使用Object.defineProperty来定义具有不同 get 和 set 行为。

例如：

var obj = {};

Object.defineProperty(obj, "data", {
    get: function() {return this.val; },
    set: function(val) { this.val = JSON.stringify(val); }
});

obj.data = {a:1}; // Set as an object...
console.log(obj.data) // but retrieve as string '{"a":1}'

---

例如，要执行与cookie示例类似的操作，您可以创建类似以下的函数：

var mixinExtender = (function mixinExtender(target) {
  var rawValue = {};

  Object.defineProperty(target, "data", {
    get: function() { return JSON.stringify(rawValue); },
    set: function(val) { 
      for(var key in val) {
        rawValue[key]  = val[key];
      }
    }
  });
})

这将在data属性中混合，将 setter 值扩展为私有对象。 getter 将返回它的序列化版本。然后你可以用它：

var obj = {};
mixinExtender(obj);

obj.data = {a:1};      // Add "a" key
obj.data = {b:2};      // Add "b" key
console.log(obj.data)  // > {"a":1,"b":2} 

Answer 2

浏览器提供的主机对象的行为方式不受语言语义的限制。也就是说，document 看起来像一个JavaScript对象，但事实并非如此。它是运行时环境的一部分。

JavaScript规范是根据各种内部“方法”描述编写的。像window和document这样的主机对象具有这些内部方法的特殊版本。因此，运行时遵循关于=赋值过程如何工作的规范，但内部方法[[Put]]非常特殊。