I have three identical objects that I'd like to define in three slightly different ways. The only difference is that I'm accessing a different property within my source data (via Bracket Notation) for each object as shown below
The object I'm using is not a function. For example Object1 is defined by
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;}))
Is there a way that I can define each with 1 line of code as oppose to three lines of code. In other words, I'd like to convert above into the following
Object1.definition("Dimension1")
Object2.definition("Dimension2")
Object3.definition("Dimension3")
by defining 'definition' as something like :
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;}))
Is this possible?
See JSFiddle Here: http://jsfiddle.net/chrisguzman/juhaoem2/
I've tried the following with no luck:
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")
Second Try
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;}))
};
Try this:
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;}))
};
Also you should define the following functions as well:
SuperObject.prototype.width()
SuperObject.prototype.height()
SuperObject.prototype.dimenstion()
SuperObject.prototype.group()
Or put them in the SuperObject prototype chain.
Note that SuperObject
is the constructor of Object1
, Object2
,...
UPDATE #1
Usage:
var obj = new SuperObject();
obj.definition("Dimension1");
Using 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;}))
}
Use:
definition.call(Object1,"Dimension1");
The code as you posted is highly unreadable so I'll try with a simpler example:
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();
When a variable name starts with a capital it usually means it's a constructor so I'd advice not to use capitals unless they are all caps to indicate they are constants.
[update]
Here is what it looks like applied to your code:
//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]))
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.