Javascript设置对象选项

Javascript设置对象选项,javascript,jquery,oop,object,Javascript,Jquery,Oop,Object,当我使用javaScript插件时,我经常遇到这种调整插件行为的方法 $('.mySlider').slider({status: "burnt"}); 如果我尝试用这样的对象复制这种方法 var Egg = function(){ this.details = { status: "cooked", make: "Happy Egg" } }; var egg = new Egg({status: "burnt"}); console

当我使用javaScript插件时,我经常遇到这种调整插件行为的方法

$('.mySlider').slider({status: "burnt"});
如果我尝试用这样的对象复制这种方法

var Egg = function(){

    this.details = {
        status: "cooked",
        make: "Happy Egg"
    }

};



var egg = new Egg({status: "burnt"});
console.log(egg.details.status);

我刚从控制台收到一堆未定义的消息。有人能告诉我如何创建一个对象,然后像上面的例子那样更改它的属性吗


谢谢

您的构造函数没有接受任何参数,但您在创建新实例时正在传入这些参数

你会想要

var Egg = function(props){

    this.details = props;

};
或许

var Egg = function(props){
    props = props || {}; // handle no arguments

    this.status = props.status;
    this.make = props.make || "Happy Egg";
};

然后您只需执行
egg.status
来获取属性。

您的构造函数没有接受任何参数,但在创建新实例时您正在传入它们

你会想要

var Egg = function(props){

    this.details = props;

};
或许

var Egg = function(props){
    props = props || {}; // handle no arguments

    this.status = props.status;
    this.make = props.make || "Happy Egg";
};

然后您只需执行
egg.status
即可获得属性。

您可以像这样创建默认参数(使用jQquery)


您可以像这样创建默认参数(使用jQquery)


必须在函数中放入一些代码,将参数值指定给新对象的属性。此外,如果您有一些默认值,那么应该将它们放入原型中,这样可以节省内存。因此,请使用以下代码:

function Egg(obj){
  if(typeof obj==="object"){
    this.details={}; //This overwrites the prototype property with one
                     //that's specific to this instance.
    for(i in arguments.callee.prototype.details){
      //This copies object from proto to object
      this.details[i]=arguments.callee.prototype.details[i];
    }
    for(i in object){
      this.details[i]=object[i];
    }
  }
};
Egg.prototype={
    details: {status: "cooked", make: "Happy Egg"}
}

此代码允许您使用一些默认对象,这些对象可以被参数扩展/覆盖。

您必须在函数中输入一些代码,将参数值分配给新对象的属性。此外,如果您有一些默认值,那么应该将它们放入原型中,这样可以节省内存。因此,请使用以下代码:

function Egg(obj){
  if(typeof obj==="object"){
    this.details={}; //This overwrites the prototype property with one
                     //that's specific to this instance.
    for(i in arguments.callee.prototype.details){
      //This copies object from proto to object
      this.details[i]=arguments.callee.prototype.details[i];
    }
    for(i in object){
      this.details[i]=object[i];
    }
  }
};
Egg.prototype={
    details: {status: "cooked", make: "Happy Egg"}
}

此代码允许您使用一些默认对象,这些对象可以由参数展开/覆盖。

对于简单的
Egg
对象,您需要函数接受用于设置结果对象属性的参数:

var Egg = function(options) {
  this.details = {
    status: options.status || 'cooked',
    make: options.make || 'Happy egg'
  }
};

当然,这是一个极其简化的版本。理想情况下,您希望使用
extend
函数,如jQuery或下划线提供的函数。

对于简单的
Egg
对象,您需要函数接受用于设置结果对象属性的参数:

var Egg = function(options) {
  this.details = {
    status: options.status || 'cooked',
    make: options.make || 'Happy egg'
  }
};
当然,这是一个极其简化的版本。理想情况下,您希望使用
扩展
函数,如jQuery或下划线提供的函数。

尝试以下方法:

var Egg = function(details) {
   this.details = {};
   for (var key in details) {
      this.details[key] = details[key];
   }

   return this;
};

var egg = new Egg({ status: 'burnt' }); // burnt

console.log(egg.details.status);
问题是您将参数(详细信息)传递给构造函数,但没有正确使用它们。在我的示例中,我将
详细信息
默认为空对象
{}
,然后覆盖该对象上传递的所有属性

通过使用原型,您可以更进一步。假设您想要公开一个可以更改细节的函数

var Egg = function(details) {
   this.details = {};
   for (var key in details) {
      this.details[key] = details[key];
   }

   return this;
};

Egg.prototype.updateDetail = function(name, value) {
    this.details[name] = value;
};

var egg = new Egg({ status: 'burnt' });

console.log(egg.details.status); // burnt

egg.updateDetail('status', 'scrambled');

console.log(egg.details.status); // scrambled
试试这个:

var Egg = function(details) {
   this.details = {};
   for (var key in details) {
      this.details[key] = details[key];
   }

   return this;
};

var egg = new Egg({ status: 'burnt' }); // burnt

console.log(egg.details.status);
问题是您将参数(详细信息)传递给构造函数,但没有正确使用它们。在我的示例中,我将
详细信息
默认为空对象
{}
,然后覆盖该对象上传递的所有属性

通过使用原型,您可以更进一步。假设您想要公开一个可以更改细节的函数

var Egg = function(details) {
   this.details = {};
   for (var key in details) {
      this.details[key] = details[key];
   }

   return this;
};

Egg.prototype.updateDetail = function(name, value) {
    this.details[name] = value;
};

var egg = new Egg({ status: 'burnt' });

console.log(egg.details.status); // burnt

egg.updateDetail('status', 'scrambled');

console.log(egg.details.status); // scrambled

我举了一个例子,在这个例子中,我构造了一个对象,然后通过向构造函数传递参数覆盖它的值,就像在slider对象中一样。该示例与您的示例不完全相同,但更多的是您询问的滑块示例

var Egg = function(){
this.status = 'Some';
    this.detail = 'another';
   //the magic line which makes it possible
    for (var n in arguments[0]) { this[n] = arguments[0][n];}

};

var egg = new Egg({status: 'burnt', make: 'hj'});
alert(egg.status );
通过添加此行

for (var n in arguments[0]) { this[n] = arguments[0][n];}
对于构造函数,您已经为用户提供了更改任何默认参数的灵活性。它们可以按任何顺序指定参数,也可以省略不需要的参数


下面是一个例子,我制作了一个例子,在这个例子中,我构造了一个对象,然后通过向构造函数传递参数来覆盖它的值,就像在slider对象中一样。该示例与您的示例不完全相同,但更多的是您询问的滑块示例

var Egg = function(){
this.status = 'Some';
    this.detail = 'another';
   //the magic line which makes it possible
    for (var n in arguments[0]) { this[n] = arguments[0][n];}

};

var egg = new Egg({status: 'burnt', make: 'hj'});
alert(egg.status );
通过添加此行

for (var n in arguments[0]) { this[n] = arguments[0][n];}
对于构造函数,您已经为用户提供了更改任何默认参数的灵活性。它们可以按任何顺序指定参数,也可以省略不需要的参数


下面是示例

此代码不可能工作,因为您传递给构造函数的参数刚刚被忽略。此代码不可能工作,因为您传递给构造函数的参数刚刚被忽略。行
this.make:props.make | |“Happy Egg”
看起来像是您混淆了JavaScript分配和JSON格式?我想说的是,我的方法(见下文)更具动态性,而且更常用。我不希望对所有内容都使用jquery。如果你唯一的工具是锤子,那么每个问题都是钉子。太好了!谢谢,所以它只是创建了一个以对象文字作为参数的构造函数
看起来像是您混淆了JavaScript分配和JSON格式?我想说的是,我的方法(见下文)更具动态性,而且更常用。我不希望对所有内容都使用jquery。如果你唯一的工具是锤子,那么每个问题都是钉子。太好了!谢谢,所以它只是创建了一个以对象文本作为参数的构造函数。但是这会改变创建的每个实例的属性,不是吗?不,不会。构造函数仅作用于正在创建的实例
Egg.prototype={…}
部分只是定义了
Egg
类的?当我实例化一个Egg并通过构造函数设置状态,然后通过prototype更改status时,实例化对象的status参数也会更改。当然可以。如果您更改了原型中的某些内容,它会立即更改在所有实例中没有覆盖该属性的内容。因此,如果您想更改某些内容,请更改对象,而不是原型。还有,刚才注意到上面有一个很大的叫声。但这会改变创建的每个实例的属性,不是吗?不,不会。构造函数仅作用于正在创建的实例