Buenas me encuentro migrando a typeScript y me encuentro con este pase de parametros en casi toda la aplicacion. Me resulta muy extraña, quisiera saber si conviene modificarla por una clase con un constructor o tratar de imitarlo en typeScript.
Funcion a exportar:
import Palette from '../chart/palette/palette.js';
import Default from './draws/default.js';
import Range from './draws/range.js';
import Secuential from './draws/secuential.js';
import Semantic from './draws/semantic.js';
export default function Legend() {
var container = {};
var data = {};
var dataChart = {};
var config = {};
var dataMap = [];
var type = "";
var maskTitle = function(value){ return value };
var d3 = null;
var range = null;
var object = {};
object.draw = function() {
let formatSuffix = d3.format(".3s");
let legendContent = d3.select(container)
.append("div")
.attr("class", "legendContainer layout-column")
.style("width", "100%")
.style("height", "100%")
.style("padding", "9px");
if (data.length == 0) {
return;
}
let colorPalette = new Palette;
let color = colorPalette.d3(d3).setRange(dataChart,config,dataMap);
if (type == 'Semantics') {
let legend = new Semantic;
legend.$el(legendContent).config(config).color(color).maskTitle(maskTitle);
legend.render(config.pallet,dataMap);
} else if (type == 'Secuential') {
let legend = new Secuential;
legend.$el(legendContent).config(config).color(color).maskTitle(maskTitle).formatSuffix(formatSuffix);
legend.render(config.dataSerieColors,dataMap);
} else if (type == 'range') {
let legend = new Range;
legend.$el(legendContent).config(config).color(color).maskTitle(maskTitle).formatSuffix(formatSuffix);
legend.render(range,dataMap);
} else {
let legend = new Default;
legend.$el(legendContent)
.config(config)
.color(color)
.maskTitle(maskTitle);
legend.render(data,dataMap);
}
if (config.orientation) {
if (config.orientation === "horizontal") {
legendContent.attr("class", "legendContainer g-row row-space-between")
} else
legendContent.attr("class", "legendContainer g-column")
} else {
if (config.align === "b" || config.align === "t" ) {
legendContent.attr("class", "legendContainer g-row row-space-between")
} else {
legendContent.attr("class", "legendContainer g-column");
}
}
return object;
}
object.container = function(value){
if (!arguments.length) return container;
container = value;
return object;
};
object.data = function(value){
if (!arguments.length) return data;
data = value;
return object;
};
object.dataChart = function(value){
if (!arguments.length) return dataChart;
dataChart = value;
return object;
};
object.config = function(value){
if (!arguments.length) return config;
config = value;
return object;
};
object.dataMap = function(value){
if (!arguments.length) return dataMap;
dataMap = value;
return object;
};
object.maskTitle = function(value){
if (!arguments.length) return maskTitle;
maskTitle = value;
return object;
};
object.type = function(value){
if (!arguments.length) return type;
type = value;
return object;
};
object.d3 = function(value){
if (!arguments.length) return d3;
d3 = value;
return object;
};
object.range = function(value){
if (!arguments.length) return range;
range = value;
return object;
};
return object;
}
Y se declara y envian valores desde otro archivo asi:
Donde se declara y usa la funcion
let legend = new Legend;
legend.container(this.container.nativeElement)
.type(type)
.data(values)
.dataChart(dataChart)
.config(this.data.legendConfig)
.dataMap(this.data.rowFieldMap)
.maskTitle(this.chartService.parseName)
.range(this.data.range)
.d3(d3);
legend.draw();
Actualmente encontre la manera de mandar parametros usando una clase con constructor. Pero me esta pasando que toda la aplicacion tiene esta modalidad de pasar parametros usando object y una funcion declarada por cada parametro ademas de crear una variable por cada dato que se va a usar en dicha funcion. Es decir, se crea un object con una funcion para cada parametro y a la vez crea en la funcion misma a exportar una variable por cada parametro para no tener error de undefined. La verdad no lo entiendo. ¿Es correcto la forma en que usa object y function aca? ¿Que seria lo mas acertado para typeScript? ¿Function o Class?
object
dentro de la clase principal, crearas una clase aparte, y queobject
sea una instancia de esa clase, clase la cual contendra todas las propiedades y metodos que estabas definiendo de manera explicita dentro de otra clase.