JavaScript中的var thing和function thing()有什么区别？

Question

我只是想知道以下JavaScript对象声明之间的区别.具体来说,事物类中的事物对象文字和事物1对象之间的区别.

码:

var thing = {
    sanity:0,
    init:function(){
        //code
    },
    send:function(){
        //code
    }
}

function thing(){
    this.sanity = 0;
    this.init = function(){
        //code
    };
    this.send = function(){
        //code
    };
}

thing1 = new thing();

Answer 1

静态对象/对象文字

静态对象或对象文字不需要使用new运算符进行实例化,也可以像单例一样运行.请考虑以下示例:

码:

var staticObject1 = {
 a: 123,
 b: 456
};
var staticObject2 = staticObject1;
console.log(staticObject1, staticObject2);
staticObject2.b = "hats";
console.log(staticObject1, staticObject2);

输出:

Object a=123 b=456  Object a=123 b=456
Object a=123 b=hats Object a=123 b=hats

请注意,改变staticObject2.b也受到了影响staticObject1.b.然而,这可能并不总是期望的效果.许多库(如Dojo)提供了一种对象克隆方法,如果要复制静态对象,可以缓解这种情况.继续前面的示例,请考虑以下事项:

码:

var staticObject3 = dojo.clone(staticObject1); // See the doc in the link above
staticObject1.a = "pants";
console.log(staticObject1, staticObject2, staticObject3);

输出:

Object a=pants b=hats Object a=pants b=hats Object a=123 b=hats

请注意,成员的值staticObject1和staticObject2它们是相同的,而staticObject3不受这些其他对象的更改的影响.

静态对象对于创建项目或库命名空间也很有用,而不是填满全局范围,并提升兼容性,就像没有人的业务一样.

在创建需要可移植性或互操作性的库时,这非常有用.这可以在流行的库比如Dojo,YUI和ExtJS的,其中全部或大部分方法被称为可以看出dojo.examplMethod(),YUI().exampleMethod()或Ext.exampleMethod()分别.

静态对象也可以被认为与structC/C++中的静态对象类似.

类构造函数/实例化对象

JavaScript中的类基于原型继承,这是一个更复杂的主题,可以在这里,这里和这里阅读.

与静态对象相反,由于JavaScript的closuer属性,这种对象创建方法为私有范围对象成员和方法提供了独特的机会.请考虑以下私有类成员示例:

码:

var SomeObject = function() {
    var privateMember = "I am a private member";
    this.publicMember = "I am a public member";

    this.publicMethod = function() {
        console.log(privateMember, this.publicMember);
    };
};

var o = new SomeObject();
console.log(typeof o.privateMember, typeof o.publicMember);
o.publicMethod();

输出:

undefined string
I am a private member I am a public member

请注意,它typeof o.privateMember是"未定义的",无法在对象外部访问,但是来自内部.

也可以制作私有方法,但不是那么简单,但仍然很容易实现.问题在于this私有方法内部的值默认为,window并且必须应用两种技术之一来确保this引用我们正在其中工作的对象,在本例中是指实例SomeObject.请考虑以下示例:

码:

var SomeObject = function() {
    var privateMember = "I am a private member";
    var privateMethod = function() {
        console.log(this.publicMember);
    };

    this.publicMember = "I am a public member";
    this.publicMethod = function() {
        console.log(privateMember, this.publicMember);
    };
    this.privateMethodWrapper = function() {
        privateMethod.call(this);
    }
};

var o = new SomeObject();
console.log(typeof o.privateMethod, typeof o.publicMethod, typeof o.privateMethodWrapper);
o.privateMethodWrapper();

输出:

undefined function function
I am a public member

请注意,withing privateMethodWrapper(),privatemethod使用被执行call并传入this该函数的上下文.这一切都很好; 但是,以下技术是优选的(在我看来),因为它简化了调用范围并产生相同的结果.上一个示例可以更改为以下内容:

码:

var SomeObject = function() {
    var self          = this;
    var privateMember = "I am a private member";
    var privateMethod = function() {
        console.log(self.publicMember);
    };

    this.publicMember = "I am a public member";
    this.publicMethod = function() {
        console.log(privateMember, this.publicMember);
    };
    this.privateMethodWrapper = function() {
        privateMethod();
    }
};

var o = new SomeObject();
console.log(typeof o.privateMethod, typeof o.publicMethod, typeof o.privateMethodWrapper);
o.privateMethodWrapper();

输出:

undefined function function
I am a public member

这个答案是我博客上帖子的基础,我在这里给出了更多的例子.希望有所帮助;)

Answer 2

案例2引用了javascript 类构造函数.一个明显的区别是变量还不是一个对象,所以你不能在内部引用thing1.sanity.您必须在调用任何内部成员之前通过创建所述类的实例来初始化该类:

var myConstructor = function() {
    this.sanity = 0;
}

// wont work
alert(myConstructor.sanity);

// works
var thing1 = new myConstructor();
alert(thing1.sanity);

这篇文章比我的快速示例更深入:

类构造函数与对象文字