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就像该命名空间中的属性一样。

您的第二个代码块是为原型分配属性。这些属性将由实例化的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实例将继承的属性（实例继承原型上的属性）。所以，当你这样做时：

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

因此，当您想要定义对象实例将继承的属性（通常是方法）时，请使用prototype。如果您没有尝试定义实例方法，那么只需将方法放在任何对象上，就像在第一个代码块中一样。

Answer 2

更多详情

@jfriend00已经提供了有关JavaScript如何处理对象的非常有用的详细信息。让我在两种情况下添加一些关于this关键字差异的详细信息：

静态案例

如果通过对象的属性定义静态函数，则函数中的this关键字引用函数范围，而不是父对象。

参见示例：

var F = function(){ this.a = 500; };
F.G = function(){ return this.a; };

// call it
F.G(); // returns undefined, because `this` refers to F.G()
       // but the variable a in F.G() has not been defined yet

原型案例

如果通过对象的原型定义函数，则函数中的this关键字是指您从该原型创建的对象实例，而不是函数范围。

参见示例：

var F = function(){ this.a = 500; };
F.prototype.G = function(){ return this.a };

// Make an object and call the function
var f = new F();
f.G(); // returns 500 because `this` refers to instance f

Javascript静态vs实例，原型关键字

2 个答案: