如何在javascript中使用函数定义对象？答案

【问题标题】：How to define objects with a function in javascript?如何在javascript中使用函数定义对象？
【发布时间】：2014-10-10 01:04:39
【问题描述】：

我想用三种略有不同的方式定义三个相同的对象。唯一的区别是我正在为每个对象访问源数据中的不同属性（通过括号表示法），如下所示

我使用的对象不是函数。例如 Object1 由

定义

var Object1  = dc.lineChart("#chart-line-hitsperday"); 


var D = "Dimension1"
Object1
    .width(200).height(200)
    .dimension(SourceData.dimension(function (d) {return d[D];}))
    .group(SourceData.dimension(function (d) {return d[D];}).group().reduceSum(function (d) {return d.Amount;}))


var D = "Dimension2"
Object2
    .width(200).height(200)
    .dimension(SourceData.dimension(function (d) {return d[D];}))
    .group(SourceData.dimension(function (d) {return d[D];}).group().reduceSum(function (d) {return d.Amount;}))


var D = "Dimension3"
Object3
    .width(200).height(200)
    .dimension(SourceData.dimension(function (d) {return d[D];}))
    .group(SourceData.dimension(function (d) {return d[D];}).group().reduceSum(function (d) {return d.Amount;}))

有没有一种方法可以用 1 行代码来定义每个代码，而不是 3 行代码。换句话说，我想把上面的转换成下面的

Object1.definition("Dimension1")
Object2.definition("Dimension2")
Object3.definition("Dimension3")

通过将“定义”定义为：

definition(D) =         
    .width(200).height(200)
    .dimension(SourceData.dimension(function (d) {return d[D];}))
    .group(SourceData.dimension(function (d) {return d[D];}).group().reduceSum(function (d) {return d.Amount;}))

这可能吗？

在此处查看 JSFiddle：http://jsfiddle.net/chrisguzman/juhaoem2/

我尝试了以下方法，但没有成功：

var definition = function(D){     
    this.width(200).height(200)
    .dimension(SourceData.dimension(function (d) {return d[D];}))
    .group(SourceData.dimension(function (d) {return d[D];}).group().reduceSum(function (d) {return d.Amount;}))
}


Object1.definition("Dimension1")

第二次尝试

Object1.prototype.definition = function(dim){
    this.width(200).height(200)
        .dimension(SourceData.dimension(function (d) {return d[dim];}))
        .group(SourceData.dimension(function (d) {return d[dim];}).group().reduceSum(function (d) {return d.Amount;}))
};

【问题讨论】：

由于您重复使用“D”的方式，您发布的代码无论如何都不会工作。
对，这就是重点。这是我希望可以工作但不起作用的代码。但是你明白我想要做什么吗？有没有办法重复使用 D 使其正常工作？
不，您的第二次尝试有一些错误，请查看我的更新答案
I've tried the following with no luck 之后的代码如果您按以下方式调用它会起作用：Object1.definition.call(Object1,"Dimension1"); 如在 Vinz243 的回答中，我已经更新了它的使用方法。

标签： javascript function object definition

【解决方案1】：

试试这个：

SuperObject.prototype.definition = function(dim){
    this.width(200).height(200)
        .dimension(SourceData.dimension(function (d) {return d[dim];}))
        .group(SourceData.dimension(function (d) {return d[dim];}).group().reduceSum(function (d) {return d.Amount;}))
};

您还应该定义以下函数：

SuperObject.prototype.width()
SuperObject.prototype.height()
SuperObject.prototype.dimenstion()
SuperObject.prototype.group()

或者把它们放在 SuperObject 原型链中。

注意SuperObject是Object1、Object2、...的构造函数

更新 #1

用法：

var obj = new SuperObject();
obj.definition("Dimension1");

【讨论】：

这只有在“Object1”是一个函数时才有意义，并且没有迹象表明在 OP 中就是这种情况。
我是原型！抵抗是徒劳的！
我使用的对象不是函数，所以原型似乎不适合我。 var Object1 = dc.lineChart("#chart-line-hitsperday");
@Chris 不，原型可用于所有 JavaScript 对象，您的对象不会是 SuperObject。而SuperObject 是您的对象的工厂/构造函数。您的对象的类型和它们应该做什么由您在 SuperObject 定义中指定
@Chris 澄清一下，你能创建一个jsfiddle.net吗？

【解决方案2】：

使用this?

definition = function(D){     
    this.width(200).height(200)
    .dimension(SourceData.dimension(function (d) {return d[D];}))
    .group(SourceData.dimension(function (d) {return d[D];}).group().reduceSum(function (d) {return d.Amount;}))
}

用途：

definition.call(Object1,"Dimension1");

【讨论】：

【解决方案3】：

您发布的代码非常不可读，因此我将尝试一个更简单的示例：

var o1={},o2={},o3={}
,dimensions = ['Dimension1','Dimension2','Dimension3']
,objects=[o1,o2,o3]
,len=dimensions.length,i=-1;
while(++i<len){
  //function returning function creating a closure
  //  in a while loop
  objects[i].somefn=(function(d){
    return function(){
      console.log(d);
    }
  }(dimensions[i]));
  objects[i].sameForAll='anything';
}
o1.somefn();
o2.somefn();
o3.somefn();

当变量名以大写字母开头时，通常意味着它是一个构造函数，所以我建议不要使用大写字母，除非它们都是大写字母来表示它们是常量。

[更新]

这是应用于您的代码的样子：

//wrap in IIFE
(function(dimensions,objects){
  var i=-1,len=dimensions.length;
  //for every object and dimension
  while(++i<len){
    //wrap in IIFE for closure
    (function(object,D){//see later what object and D is
      object
        .width(200).height(200)
        .dimension(
          SourceData.dimension(
            function (d) {
              return d[D];
            }
          )
        )
        .group(
          SourceData.dimension(
            function (d) {
              return d[D];
            }
          )
          .group()
          .reduceSum(
            function (d) {
              return d.Amount;
            }
          )
        );
    }(objects[i],dimensions[i]));//pass object and D
  }
}(['Dimension1','Dimension2','Dimension3'],[Object1,Object2,Object3]))

【讨论】：