Vengo de un entorno de codificación que no es javascript y una de las cosas que estoy acostumbrado a hacer es encapsular código en una clase.
Entonces tengo un archivo de clase y funciona, pero la referencia constante a this. Le falta cierta elegancia que me hace pensar que estoy haciendo las cosas mal. Especialmente cuando trato de hacer referencia a this. desde dentro de un "nivel" de código en un método y tengo que llevar la referencia en una variable local para que funcione.
Así que aquí hay un ejemplo de lo que tengo.
class catalogue { constructor () { this.currentDoc = null; this.dataDirectory = "data/"; } loadJSON(filepath) { // there is actual code in the real class } loadHTML(filePath) { // there is actual code in the real class } loadExternalData() { let filePath = `${this.dataDirectory}${this.currentDoc.filepath}`; let dataIsJson = this.currentDoc.filepath.indexOf('.json') != -1; let me = this; // this again :-( if (dataIsJson) { me.loadJSON(filePath); } else { me.loadHTML(filePath); } } } El método loadExternalData() se llama desde el código que crea una instancia de la clase. Luego determina cómo cargar los datos que requiere y llama a varios métodos según el tipo de datos.
En los "viejos tiempos", habría almacenado una referencia a la clase como una propiedad de la clase y luego la habría usado para llamar a los métodos. El principal problema es que, como sabemos, this. es contextual y tan pronto como usas un condicional o algo similar, el contexto, por alguna extraña razón, cambia y this. ya no es útil para mi clase.
Así que todo esto me hace pensar que no estoy haciendo las cosas al estilo de Javascript .
¿Hay alguna manera más fácil de referirse a métodos y propiedades sin usar this. o tengo que mirar a volver a trabajar el código?
Lo que estás haciendo es perfectamente normal y común. Si lo que te preocupa es:
El principal problema es que, como sabemos, esto. es contextual y tan pronto como usas un condicional o algo similar, el contexto, por alguna extraña razón, cambia y esto. ya no es útil para mi clase.
Un ajuste muy simple es usar campos de clase de función de flecha en su lugar, de modo que this siempre se refiera a la instancia, sin tener que preocuparse por un contexto de llamada cambiante.
class catalogue { constructor () { this.currentDoc = null; this.dataDirectory = "data/"; } loadJSON = (filepath) => { // there is actual code in the real class } loadHTML = (filePath) => { // there is actual code in the real class } loadExternalData = () => { let filePath = `${this.dataDirectory}${this.currentDoc.filepath}`; let dataIsJson = this.currentDoc.filepath.indexOf('.json') != -1; if (dataIsJson) { this.loadJSON(filePath); } else { this.loadHTML(filePath); } } }¿Hay alguna manera más fácil de referirse a métodos y propiedades sin usar este
No particularmente, aunque supongo que si las funciones están vinculadas a this correctamente, también podría extraerlas primero en variables independientes, tal vez en la primera línea de la función. En mi opinión, no es una mejora, sino YMMV. P.ej
loadExternalData() { let filePath = `${this.dataDirectory}${this.currentDoc.filepath}`; let dataIsJson = this.currentDoc.filepath.indexOf('.json') != -1;podría cambiar a
loadExternalData() { const { dataDirectory, currentDoc } = this; let filePath = `${dataDirectory}${currentDoc.filepath}`; let dataIsJson = currentDoc.filepath.indexOf('.json') != -1;Probablemente también podría cambiar la última línea a
const dataIsJson = currentDoc.filePath.endsWith('.json');para ser preciso.