ES6 moduli e l'eredità

Question

ho i seguenti file JavaScript:

src/js/classes/Lexus.js:

import {Car} from 'src/js/classes/Car'; 

export class Lexus extends Car { 
    constructor() { 
    super("Lexus"); 
    } 
} 

src/js/classes/Mercedes.js:

import {Car} from 'src/js/classes/Car'; 

export class Mercedes extends Car { 
    constructor() { 
    super("Mercedes"); 
    } 
} 

src/js/classes/Car.js:

import {Lexus} from 'src/js/classes/Lexus'; //either of those imports works, but not both! 
import {Mercedes} from 'src/js/classes/Mercedes'; //either of those imports works, but not both! 

export class Car { 
    constructor(make) { 
    this.make = make; 
    } 

    static factory(msg) { 
    switch(msg) { 
     case "Lexus": 
     return new Lexus(); 
     case "Mercedes": 
     return new Mercedes(); 
    } 
    } 
} 

e app.js:

import {Lexus} from 'src/js/classes/Lexus'; 
import {Mercedes} from 'src/js/classes/Mercedes'; 
import {Car} from 'src/js/classes/Car'; 

var car = Car.factory("Lexus"); 
console.log(car); 

La cosa interessante, se importare siaLexus o Mercedes alla classe Auto e chiamare il metodo factory in app.js - tutto funziona bene ; se posso importare siaLexus e Mercedes alla classe Car ho ottenuto un errore:

Super expression must either be null or a function, not undefined

Cosa mi manca?

Answer 1

In genere, si desidera non avere dipendenze circolari come questa. Dipendenze circolari nel migliore dei casi, rompere tutto e non compilare (o traspare). Le dipendenze circolari nel peggiore dei casi, causano conflitti di versione e di unione, causano un codice veramente difficile da discernere, sembrano funzionare perfettamente finché non si interrompono, con qualche terribile errore causato da alcune terribili ipotesi di stato.

La tua soluzione (se sei impostato su questa forma di ereditarietà) sarà quello di estrarre Car nel proprio file/classe, che può essere importato separatamente, e di avere la Factory separata dalla classe.

Che, in inglese ha senso.
Le automobili non costruiscono le Lexus (Lexi?).

Inoltre, se si ha desidera mantenere questo (non una grande idea), allora si dovrebbe avere un metodo di registro, non una soluzione a livello di codice, per cui si registra "Lexus" e la funzione che fa un nuovo Lexus.

import Car from "./car"; 
class Lexus extends Car { 
    constructor() { 
    super("Lexus"); 
    } 
    // starting to look like a bad idea 
    static make() { 
    return Car.make("Lexus"); 
    } 
    // starting to look worse 
    static register() { 
    /* this register method does nothing, so that Lexus can't make other cars... */ 
    } 
} 

Car.register("Lexus",() => new Lexus()); 

export default Lexus; 

Si va peggio, ma questo è già molto male.

Se si va l'altro itinerario:

// carfactory.js 

const carTypes = new Map(); 
class CarFactory { 
    static register (name, implementation) { 
    carTypes.set(name, implementation); 
    return CarFactory; 
    } 
    static make (name) { 
    const makeCar = carTypes.get(name); 
    return makeCar(); 
    } 

    register (name, implementation) { 
    CarFactory.register(name, implementation); 
    return this; 
    } 
    make (name) { return CarFactory.make(name); } 
} 

export default CarFactory; 


// index.js 
import Car from "./classes/car"; 
import Lexus from "./classes/lexus"; 

import CarFactory from "./factories/car"; 

CarFactory 
    .register("Lexus",() => new Lexus()) 
    .register("Bentley",() => new Bentley()); 

init(CarFactory); 

function init (Car) { 
    const lexus = Car.make("Lexus"); 
} 

Ora, classi hanno bisogno di sapere cose che non dovrebbero avere a.