javascript - javascript类定义之间有什么区别？

Question

如您所知，就语法而言，JavaScript 是一种非常灵活的面向对象语言，但我的问题是 JavaScript 中哪种定义函数的方式流行？

是否只有 javascript 提供多种方式来帮助了解一些替代方案以便阅读其他人的代码或多种方式是基于性能原因？

<强>1。使用函数

function Apple (type) {
    this.type = type;
    this.color = "red";
    this.getInfo = getAppleInfo;
    function getAppleInfo() {
        return this.color + ' ' + this.type + ' apple';
    }
}

<强>2。使用对象字面量

var apple = {
    type: "macintosh",
    color: "red",
    getInfo: function () {
        return this.color + ' ' + this.type + ' apple';
    }
}

<强>3。使用函数的单例

var apple = new function() {
    this.type = "macintosh";
    this.color = "red";
    this.getInfo = function () {
        return this.color + ' ' + this.type + ' apple';
    };
}

Answer 1

首先，我必须告诉你，我不是专家，你可能会找到关于这个主题的更好(完整)的答案。

原型(prototype)

这 3 种方式的最大区别在于原型(prototype)。方法 1 [Usin a function] 将允许您绑定(bind)不在其他对象之间共享的原型(prototype)对象。

您可以为 Apple 对象以及 Object 对象添加原型(prototype)方法。参见示例:

//init
Object.prototype.hello = 'Hello';
Apple.prototype.world = ' World';

//Method 1
alert(apple.hello + apple.world); //Hello World

//Method 2
alert(apple.hello + apple.world); //Helloundefined

//Method 3
alert(apple.hello + apple.world); //Helloundefined

可重用性

如果你想要同一个对象的多个实例，如果没有第一个方法，你会遇到麻烦。如您的示例所示，如果您想要 2 个不同的苹果，则需要复制/粘贴并更改属性(第一种方法除外)。

//Method 1
var macintosh = new Apple('macintosh');

var otherApple = new Apple('Heisenberg')

//Method 2
var macintosh = {
    type: "macintosh",
    color: "red",
    getInfo: function () {
        return this.color + ' ' + this.type + ' apple';
    }
}

var otherApple = {
    type: "I'm not good with apple's name",
    color: "red",
    getInfo: function () {
        return this.color + ' ' + this.type + ' apple';
    }
}

//Method 3
var macintosh = new (function(type) {
    this.type = type;
    this.color = "red";
    this.getInfo = function () {
        return this.color + ' ' + this.type + ' apple';
    };
})('macintosh');

var otherApple = new (function(type) {
    this.type = type;
    this.color = "red";
    this.getInfo = function () {
        return this.color + ' ' + this.type + ' apple';
    };
})('Still not better');

可变范围

在方法一和方法三中，可以有局部变量。在对象外部不可访问的元素。

当你的对象中有事件处理函数时，这很有用。在那些函数中，您丢失了 this 引用。幸运的是，您可以将其保存在局部变量中。以 timeout 为例，不要用 .bind() 之类的东西作弊:

//Method 2
var apple = {
    getMe : 'YES!',
    setTimer : function(){
        setTimeout(this.goGetHim, 500);
    },
    goGetHim : function(){
        //alert(this.getMe); Do not work
        alert(apple.getMe); //Kinda lame
    }
}

// Method 1, 3
yourinitfn(){
    var self = this
    this.getMe : 'YES!',
        this.setTimer : function(){
            setTimeout(this.goGetHim, 500);
        },
            this.goGetHim : function(){
                alert(self.getMe); //YES!
            }
}

apple.self;//Undefined

识别

我最后想到的就是身份证明。基本上，您可以使用方法 #1 轻松知道该对象是一个苹果:

//Method 1
alert(apple instanceof Object); //True
alert(apple instanceof Apple); //True

//Method 2
alert(apple instanceof Object); //True
alert(apple instanceof Apple); //False

//Method 2
alert(apple instanceof Object); //True
alert(apple instanceof Apple); //False

肯定还有其他优势

如果有人能在这些主题上找到其他优势，我将不胜感激:

• 内存
• 表现
• 可读性
• 编程语言兼容性(例如:通过 JSON 将对象转换为 PHP)
• 其他想不起来的...

---

最后一个音符

我从来没有使用过，也永远不会使用单例函数来创建对象。我在某处读到(现在找不到引用资料)，使用 new function 是一种不好的做法并且会严重影响性能。请注意，我在这里可能是错的......