Javascript静态与实例，原型(prototype)关键字

Question

我想知道下面两段代码的区别

我的理解是这是静态的，因为无需使用 new 关键字创建实例，就可以调用 getCookie 和 setCookie 函数。

var CookieHandler = function () {};

CookieHandler.getCookie = function (key) {

};

CookieHandler.setCookie = function (key, value) {
};

这是实例。在这种情况下，您需要创建一个实例来调用函数。

var CookieHandler = function () {};

CookieHandler.prototype.getCookie = function (key) {

};

CookieHandler.prototype.setCookie = function (key, value) {
};

我是一名 java 程序员，几乎不了解 JS 概念，请帮助我解决这个问题。

Answer 1

在 Javascript 中，任何函数也是一个对象，因此任何函数都可以具有分配给它的属性。这就是您的第一段代码所做的。它只是将属性分配给 CookieHandler 函数。如果 CookieHandler 是一个对象定义，那么虽然不完全相同，但它们类似于其他 OO 语言中的类静态属性。

如果它不是一个对象定义，那么 CookieHandler 就像一个 Javascript 命名空间，而 getCookie 和 setCookie 就像该命名空间中的属性。

您的第二个代码块是为原型(prototype)分配属性。这些属性将由实例化的 CookieHandler 对象继承。

---

因此，对于您的第一个代码块:

var CookieHandler = function () {};
CookieHandler.getCookie = function (key) {
};
CookieHandler.setCookie = function (key, value) {
};

您可以随时随意调用CookieHandler.getCookie()。 CookieHandler 就像一个命名空间对象，getCookie 和 setCookie 是命名空间上的属性。

如果您创建一个 CookieHandler 对象，例如:

var x = new CookieHandler();
x.getCookie();    // does not work
x.setCookie();    // does not work

那么，x 将不会有 getCookie() 或 setCookie() 方法。这些方法只存在于 CookieHandler 对象上。它们不是由 CookieHandler 的实例继承的。

---

第二个代码块:

var CookieHandler = function () {};
CookieHandler.prototype.getCookie = function (key) {
};
CookieHandler.prototype.setCookie = function (key, value) {
};

您正在定义 CookieHandler 实例将继承的属性(实例继承原型(prototype)上的属性)。所以，当您这样做时:

var x = new CookieHandler();
x.getCookie();    // works
x.setCookie();    // works

---

因此，当您想要定义对象实例将继承的属性(通常是方法)时，请使用原型(prototype)。如果您不想定义实例方法，则只需将方法放在任何对象上，就像在您的第一个代码块中一样。