创建javascript对象之间的区别

Difference between creating javascript objects

本文关键字：区别 之间 对象 javascript 创建      更新时间：2023-09-26

当创建一个以OO方式使用JS的对象时，JS引擎中是否有任何区别（除了能够定义构造函数：

var Uploader = Uploader || {};

和

var Uploader = function() {
}

和

function Uploader() {
}

尤其是当以后，你希望做一些类似的事情时

Uploader.DOM = {    
    Create: function(file) {
    }
};

这都是因为个人喜好吗？还是真的有区别？

对象：

var MyObj = {
    myArr: [1,2,3],
    find: function(/*some arguments*/) {
        //some logic that finds something in this.myArr
    }
}

在MyObj.find函数中，this关键字将指向MyObj（这有点类似于this在具有类的语言中的工作方式）。您可以使用此功能进行混合:

var MyObj2 = {
    myArr: [4,2,6]
}
MyObj2.find = MyObj.find;

在MyObj2.find函数中，this关键字将指向MyObj2。

对象还支持getter和setter（适用于IE9+和所有优秀的浏览器）：

var MyObj = {
    myArr: [1,2,3],
    find: function(/*some arguments*/) {
        //some logic that finds something in this.myArr
    },
    get maxValue() {
        return Math.max.apply(null, this.myArr);// maxValue is calculated on the fly
    },
    a_: null,
    get a () {
        return this.a_;
    },
    set a (val) {
        //fire a change event, do input validation
        this.a_ = val;
    }
}

现在可以访问数组中的最大值，如下所示：MyObj.maxValue。我还添加了一个属性a_。它的名称不能与其getter和setter相同，所以添加了一个下划线。加下划线或在下划线前加下划线是不应直接访问的私有变量的命名约定。

var qwe = MyObj.a // get a_
MyObj.a = 'something'; //set a_

功能：

var u = new Uploader(); // will throw an exception
var Uploader = function() { }

上传程序是在运行时在这里定义的。当我尝试实例化它时，它还不存在。

var u = new Uploader(); //will work
function Uploader() {}

上传程序是在编译时定义的，所以它可以工作。

函数可以与暴露模式一起使用以隐藏某些成员。函数不支持getter和setter，但您可以将对象放入函数中。

function myFunc() {
    function privateFunc() {};
    function publicFunc() {};
    var obj = {
        //members, getters, setters
    };
    return {
       publicFunc: publicFunc,
       obj: obj
    }
}

您可以在myFunc之外调用muFunc.publicFunc()，因为它已返回。但是不能在外部使用privateFunc，因为它不会返回。揭示模式函数通常不需要实例化。这是因为当你实例化它时，里面的所有东西都会被复制到一个新的实例中。因此，与使用prototype添加函数相比，它将占用更多的内存。

myFunc.prototype.someFunc = function() {};

像这样，myFunc的所有实例将共享someFunc的相同实例。

结论：使用函数，您可以模拟private访问修饰符，但在对象中，this关键字的作用与您在具有类的语言中所期望的有点相似。但您始终可以使用call、apply和bind来更改函数的上下文（即"this"关键字将是什么）。

相关文章：