将原型添加到JavaScript对象字面量

Question

STORE = {
   item : function() {
  }
};
STORE.item.prototype.add = function() { alert('test 123'); };
STORE.item.add();

我已经努力研究这个问题很久了，但是还是不知道为什么它不起作用。然而，当我使用以下代码时，它可以正常工作：

STORE.item.prototype.add();

- John

Answer 1

原型对象旨在用于构造函数，基本上是使用new运算符调用的函数，以创建新的对象实例。

JavaScript中的函数是一等公民对象，这意味着您可以向其中添加成员并像处理普通对象一样对待它们：

var STORE = {
   item : function() {
  }
};

STORE.item.add = function() { alert('test 123'); };
STORE.item.add();

如我之前所说，原型对象的典型用法是通过使用new操作符调用构造函数来实例化对象，例如：

function SomeObject() {} // a constructor function
SomeObject.prototype.someMethod = function () {};

var obj = new SomeObject();

所有的SomeObject实例都会继承自SomeObject.prototype的成员，因为这些成员将通过原型链进行访问。

JavaScript中的每个函数都有一个原型对象，因为无法知道哪些函数是要用作构造函数。

- Christian C. Salvadó

---

我们也可以像这样分配原型 Object.create(prototype)。更多信息在此处。 - JohnnyQ

换句话说，只有使用构造函数（带有“new”关键字）创建的对象才能访问在原型中定义的属性和函数。从示例中的问题开始，这将起作用：var storeItem = new STORE.item()storeItem.add(); - bingeScripter

Answer 2

经过多年的等待，当 JavaScript (ES2015) 到来时，我们终于拥有了 Object.setPrototypeOf() 方法。

const STORE = {
  item: function() {}
};


Object.setPrototypeOf(STORE.item, {
  add: function() {
    alert('test 123');
  }
})


STORE.item.add();

- Krzysztof Safjanowski

---

这在搜索链时何时变得有价值？ - serkan

嗨 @serkan，你能再解释一下你的问题吗？我不太确定你的意思。 - Derek Morrison

Answer 3

截至目前，可以通过使用__proto__属性实现此操作。以防万一有人现在或将来查看此处。

const dog = {
    name: 'canine',
    bark: function() {
        console.log('woof woof!')
    }
}

const pug = {}
pug.__proto__ = dog;

pug.bark();

然而，在这种情况下添加原型的推荐方法是使用Object.create。因此，上述代码将被翻译为：

const pug = Object.create(dog)

pug.bark();

或者你也可以使用Object.setPrototypeOf，正如其中一个回答中所提到的。

希望能对你有所帮助。

- JohnnyQ

---

使用这种方法将函数添加到原型中最终导致了一些意外后果。它实际上搞乱了项目中的其他一些函数。我还不知道为什么，因为我只是将这些函数作为对象属性添加，而不是添加到原型中。（我正在对一个对象字面量进行所有操作，而不是构造函数。） - Chris Sharp

Answer 4

您可以使用JSON revivers在解析时将JSON转换为类对象。ECMAScript 5草案采用了JSON2修复程序方案，该方案在http://JSON.org/js.html中有描述。

var myObject = JSON.parse(myJSONtext, reviver);

可选的reviver参数是一个函数，将在最终结果的每个级别的每个键和值上调用。每个值都将被替换为reviver函数的结果。这可以用于将通用对象转换为伪类的实例，或将日期字符串转换为Date对象。

myData = JSON.parse(text, function (key, value) {
    var type;
    if (value && typeof value === 'object') {
        type = value.type;
        if (typeof type === 'string' && typeof window[type] === 'function') {
            return new (window[type])(value);
        }
    }
    return value;
});

- Mike Samuel

---

很高兴知道这个信息。+1。如果有更详细的示例，包括myJSONtext和type函数的详细信息，那就更好了，但无论如何感谢这个信息！ - Anmol Saraf

Answer 5

STORE = {
   item : function() {
  }
};

这条命令将创建一个STORE对象。您可以通过typeof STORE;来检查。它应该返回'object'。如果您键入STORE.item;，它将返回'function...'。

由于它是普通对象，因此如果您想更改item函数，只需使用此命令访问其属性/方法即可。

STORE.item = function() { alert('test 123'); };

尝试使用STORE.item;，它仍应返回'function..'。 尝试STORE.item();，然后将显示警报。

- YGautomo