JavaScript OOP:对象实例化和使用不同语法添加属性

JavaScript OOP: Object instantiation and adding properties using different syntaxes

本文关键字：语法 添加 属性 OOP 对象 实例化 JavaScript      更新时间：2023-09-26

我正在尝试深入挖掘JavaScript OOP实践。总的来说，我理解了这个想法，但是仍然存在一些问题，特别是关于对象实例化和方法的添加。

在创建构造函数时，我过去使用过这两个版本:

function MyConstructor(someArg) {
    this.arg = someArg;
}
var MyConstructor = function(someArg) {
    this.arg = someArg;
}

都可以用相同的方式初始化，但它们是相同的吗?我之所以问这个问题，是因为在其中一个中，对象的名称是函数的名称，而在另一个中，实际的对象是在匿名函数中创建的。

当涉及到向对象添加方法时，我遇到了一些变化，这真的让我感到困惑，因为我真的不明白这只是语法不同还是它们的工作方式不同。

这个向MyConstructor的原型添加了一个函数，这意味着所有实例都可以访问它，也可以扩展MyConstructor的对象，因为它在原型链中。

MyConstructor.prototype.showArg = function() {
    console.log(this.arg);
}

有时我也会看到这样的事情:

MyConstructor.prototype = {
    showArgument:function() {
        console.log(this.arg);
    },
};

这是否与第一个例子(MyConstructor.prototype.showArg = function()…)相同?

然后我也遇到了这样的语法，这对我不起作用-这是因为showArg只添加到一个特定的实例，而不是添加到原型吗?

MyConstructor.showArg = function() {
    console.log(this.arg);
}

同样，似乎也有一种jQuery的方式来做到这一点:

$.extend(MyConstructor.prototype, {
    showArgument:function() {
        console.log(this.arg);
    },
});

这可能和前两个例子一样，因为它给原型添加了属性，对吗?

MyConstructor。原型指的是对象。当你把它赋值为

MyConstructor.prototype = {
    showArgument:function() {
        console.log(this.arg);
    },
};

它实际上是创建一个新的对象，showArgument作为一个属性。通过原型继承的所有其他默认属性都将丢失。但是当你这样做

MyConstructor.prototype.showArg = function() {
    console.log(this.arg);
}

扩展了现有的对象，增加了一个属性showArg，使其他属性保持不变。

JQuery的extend() API提供了一种扩展对象并为其添加属性的方法。

原型的例子绝对是不是一样的东西;在第二个示例中，完全删除了原型中的所有内容，除了 showArgument函数。

只设置showArg 

MyConstructor.prototype.showArg = function() {
    console.log(this.arg);
}

集原型只 showArgument 

MyConstructor.prototype = {
    showArgument:function() {
        console.log(this.arg);
    },
};
相关文章：