JavaScript中的var thing和function thing()有什么区别? [英] What is the difference between var thing and function thing() in JavaScript?

查看:121
本文介绍了JavaScript中的var thing和function thing()有什么区别?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

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

I was just wondering about the difference between the following declaration of JavaScript objects. Specifically, the difference between thing object literal and thing1 object from thing class.

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();


推荐答案

静态对象/对象文字



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

Static Objects / Object Literals

Static objects, or object literals, don't require instantiation with the new operator and also behave like singletons. Consider the following example:

代码:

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 ,提供了一种对象克隆方法,可以使用如果要复制静态对象,请缓解此情况。继续前面的示例,请考虑以下事项:

Notice that changing staticObject2.b also affected staticObject1.b. However, this may not always be the desired effect. Many libraries, such as Dojo, offer an object cloning method that can alleviate this situation if you want to make a copy of a static object. Continuing the previous example, consider the following:

代码:

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 不受这些其他对象更改的影响。

Notice that the values of the members of staticObject1 and staticObject2 are the same, whereas staticObject3 is not affected by changes to these other objects.

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

Static objects are also useful for creating project or library namespaces, rather than filling up the global scope, and promotes compatibility like no one's business.

这在创建需要可移植性或互操作性的库时非常有用。这可以在流行的库中看到,例如Dojo,YUI和ExtJs,其中所有或大多数方法都被称为 dojo.examplMethod() YUI( ).exampleMethod(),或 Ext.exampleMethod()

This is useful when creating libraries that require portability or interoperability. This can be seen in popular libraries such as Dojo, YUI and ExtJs, where all or most methods are called as dojo.examplMethod(), YUI().exampleMethod(), or Ext.exampleMethod() respectively.

静态对象也可以被认为与C / C ++中 struct 的松散类似。

Static objects can also be considered loosely analogous to struct's in C/C++.

JavaScript中的类基于原型继承,这是一个复杂得多的主题,可以读取关于此处此处此处

Classes in JavaScript are based on prototypal inheritance, which is a far more complex subject and can be read about here, here and here.

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

As opposed to static objects, this method of object creation gives the unique opportunity for private scope object members and methods because of JavaScript's closuer property. Consider the following example of private class members:

代码:

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 是未定义的,并且无法在对象外部访问,但是来自内部。

Notice that typeof o.privateMember is "undefined" and not accessible outside of the object, but is from within.

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

Private methods can also be made, but are not as straight forward yet are still simple to implement. The issue lies in that the value of this inside of the private method defaults to window and one of two techniques must be applied to ensure that this refers to the object that we are working within, in this case, the instance of SomeObject. Consider the following example:

代码:

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

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

Notice that withing privateMethodWrapper(), privatemethod was executed using call and passing in this for the function's context. This is all fine; however, the following technique is preferable (in my opinion) as it simplifies the calling scope and produces identical results. The previous example can be changed to the following:

代码:

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

这个答案是上帖的基础。博客,我在其中提供了其他示例。希望有所帮助;)

This answer was the basis for a post on my blog, where I give additional examples. Hope that helps ;)

这篇关于JavaScript中的var thing和function thing()有什么区别?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆