Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/370.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 我应该使用对象文字还是构造函数?_Javascript - Fatal编程技术网

Javascript 我应该使用对象文字还是构造函数?

Javascript 我应该使用对象文字还是构造函数?,javascript,Javascript,我对应该用哪种方式在javascript中创建对象感到困惑。看来至少有两种方法。一种是使用对象文字符号,而另一种是使用构造函数。一种方法比另一种方法有优势吗?使用对象文字,通过引入初始值,它更为简洁,扩展性更好。这取决于您想做什么。如果要在对象中使用(半)私有变量或函数,可以使用构造函数。如果您的对象只包含属性和方法,那么对象文字就可以了 function SomeConstructor(){ var x = 5; this.multiply5 = function(i){

我对应该用哪种方式在javascript中创建对象感到困惑。看来至少有两种方法。一种是使用对象文字符号,而另一种是使用构造函数。一种方法比另一种方法有优势吗?

使用对象文字,通过引入初始值,它更为简洁,扩展性更好。

这取决于您想做什么。如果要在对象中使用(半)私有变量或函数,可以使用构造函数。如果您的对象只包含属性和方法,那么对象文字就可以了

function SomeConstructor(){
    var x = 5;
    this.multiply5 = function(i){
        return x*i;
    }
}
var myObj = new SomeConstructor;

var SomeLiteral = {
    multiply5: function(i){ return i*5; }
}

现在
myObj
SomeLiteral
中的方法
multiply5
做了完全相同的事情。唯一的区别是myObj使用私有变量。后者在某些情况下可能有用。大多数情况下,一个对象文字就足够了,这是创建JS对象的好方法。

如果没有与对象相关的行为(即,如果对象只是数据/状态的容器),我会使用对象文字

var data = {
    foo: 42,
    bar: 43
};
应用。如果您不需要一个简单的数据容器以外的任何东西,请使用一个简单的文本

如果您想向对象添加行为,您可以使用构造函数,在构建过程中向对象添加方法,或者为类提供一个原型

function MyData(foo, bar) {
    this.foo = foo;
    this.bar = bar;

    this.verify = function () {
        return this.foo === this.bar;
    };
}

// or:
MyData.prototype.verify = function () {
    return this.foo === this.bar;
};
类似这样的类也可以充当数据对象的模式:您现在有了某种契约(通过构造函数)对象初始化/包含的属性。自由文本只是一个无定形的数据块

您还可以使用一个作用于普通旧数据对象的外部
verify
函数:

var data = {
    foo: 42,
    bar: 43
};

function verify(data) {
    return data.foo === data.bar;
}

然而,这对于封装来说并不有利:理想情况下,与实体相关的所有数据+行为都应该共存。

本质上归结为是否需要对象的多个实例;使用构造函数定义的对象允许您拥有该对象的多个实例。对象文本基本上是单例的,其变量/方法都是公共的

// define the objects:
var objLit = {
  x: 0,
  y: 0,
  z: 0,
  add: function () {
    return this.x + this.y + this.z;
  }
};

var ObjCon = function(_x, _y, _z) {
  var x = _x; // private
  var y = _y; // private
  this.z = _z; // public
  this.add = function () {
    return x + y + this.z; // note x, y doesn't need this.
  };
};

// use the objects:
objLit.x = 3; 
objLit.y = 2; 
objLit.z = 1; 
console.log(objLit.add());    

var objConIntance = new ObjCon(5,4,3); // instantiate an objCon
console.log(objConIntance.add());
console.log((new ObjCon(7,8,9)).add()); // another instance of objCon
console.log(objConIntance.add()); // same result, not affected by previous line

以统一方式创建对象的另一种方法是使用返回对象的函数:

function makeObject() {
    var that = {
        thisIsPublic: "a public variable"
        thisIsAlsoPublic: function () {
            alert(that.thisIsPublic);
        }
    };

    var secret = "this is a private variable"

    function secretFunction() { // private method
        secret += "!"; // can manipulate private variables
        that.thisIsPublic = "foo";     
    }

    that.publicMethod = function () {
        secret += "?"; // this method can also mess with private variables
    }

    that.anotherPublicVariable = "baz";

    return that; // this is the object we've constructed
}

makeObject.static = "This can be used to add a static varaible/method";

var bar = makeObject();
bar.publicMethod(); // ok
alert(bar.thisIsPublic); // ok
bar.secretFunction(); // error!
bar.secret // error!
由于JavaScript中的函数是闭包,我们可以使用私有变量和方法,避免使用
new


下面的代码显示了创建对象的三种方法:对象文字语法、函数构造函数和
object.create()
。Object literal语法只是动态创建对象,因此它的
\uuuuu prototype\uuuu
就是
对象
对象,它可以访问
对象
的所有属性和方法。严格地说,从设计模式的角度来看,应该使用简单的对象文本来存储单个数据实例

函数构造函数有一个名为
.prototype
的特殊属性。此属性将成为由函数构造函数创建的任何对象的
\uuuuu prototype\uuu
。添加到函数构造函数的
.prototype
属性的所有属性和方法都将可用于它创建的所有对象。如果需要数据的多个实例或需要对象的行为,则应使用构造函数。注意,当您想要模拟私有/公共开发模式时,函数构造函数也是最好的使用方法。记住将所有共享方法放在
.prototype
上,这样它们就不会在每个对象实例中创建

使用
对象创建对象。create()
将对象文字用作此方法创建的对象的
原型。添加到对象文字的所有属性和方法将可用于通过真正的原型继承从中创建的所有对象。这是我喜欢的方法

//Object Example

//Simple Object Literal
var mySimpleObj = {
    prop1 : "value",
    prop2 : "value"
}

// Function Constructor
function PersonObjConstr()  {
    var privateProp = "this is private";
    this.firstname = "John";
    this.lastname = "Doe";
}
PersonObjConstr.prototype.greetFullName = function()    {
    return "PersonObjConstr says: Hello " + this.firstname + 
    " " + this.lastname;
};

// Object Literal
var personObjLit = {
    firstname : "John",
    lastname: "Doe",
    greetFullName : function() {
        return "personObjLit says: Hello " + this.firstname +
        ", " + this.lastname;
    }
} 

var newVar = mySimpleObj.prop1;
var newName = new PersonObjConstr();
var newName2 = Object.create(personObjLit);

//对象文字和对象构造函数

function MyData(foo, bar) {
        this.foo = foo;
        this.bar = bar;

    }
MyData.prototype.verify = function () {
        return this.foo === this.bar;
    };

//add property using prototype

var MD  = new MyData;//true.
var MD = new MyData();//true.
MD.verify// return only the function structure.
MD.verify(); //return the verify value and in this case return true coz both value is null. 
var MD1  = new MyData(1,2); // intialized the value at the starting. 
MD1.verify// return only the function structure.
MD1.verify(); // return false coz both value are not same.
MD1.verify(3,3);// return false coz this will not check this value intialized at the top 
MyData.prototype.verify = function (foo,bar) {
    return this.foo === this.bar;
};
var MD1  = new MyData(1,2);
MD1.verify();
MD1.verify(3,3);// return false coz this keyword used with foo and bar that will check parent data 

您是否希望页面只包含一个对象实例--Literal

是否只将数据(如DTO)传输到简单对象集:-Literal

是否要创建具有方法行为、多实例-构造函数函数、遵循OOP原则、继承:-构造函数函数的真实对象

下面是youtube视频,详细解释了什么是文字、什么是构造函数以及它们之间的区别

如中所述

使用对象文字,您可以在one中定义创建one对象 声明

对象文字仅创建单个对象。有时候,我们喜欢 一种对象类型,可用于创建一种类型的多个对象

Object()构造函数有点慢,而且更详细。作为 因此,在JavaScript中创建新对象的推荐方法是 使用文字符号


事实上,我认为,我们可以在对象文本中使用私有方法。考虑下面的代码:

var myObject = {

   publicMethod: function () {
      privateMethod1();
      privateMethod2(); 
      function privateMethod1(){
          console.log('i am privateMethod1');
      } 
      function privateMethod2(){
          console.log('i am privateMethod2');
      } 
   }

}

品味的问题,但我更喜欢在可能的情况下使用对象文字

下面是一个基准测试,它显示了访问文本、构造函数和类属性的访问时间。这可能需要一段时间,但它显示了访问属性的几乎所有方法。对我来说,这个基准测试显示文字属性的访问时间总体上比类和构造函数属性的访问时间稍慢。最糟糕的执行时间来自对象文本的getter和setter。与类和构造函数上的getter和setter不同,它们似乎比大多数其他访问时间都要快。 基准:

很好的解释,但是把函数放在对象文本中怎么样?我以前见过这种情况。实际上,下面的帖子有一个例子。如果您将函数定义作为对象文本的一部分,或者使用
this.fn=function…
方法