Womit kann man Schnittstellen in JavaScript ersetzen…

Interfaces in JavaScript werden nativ nicht unterstützt, können aber ersetzt werden durch:

Laufzeit-Typprüfung (Runtime type checking): Verwendung von Bibliotheken wie Zod, Yup oder Joi, um die Datenstruktur zu beschreiben und eingehende Werte zu validieren.

// Beispiel mit Zod
import { z } from 'zod';

const UserSchema = z.object({
  id: z.number(),
  name: z.string(),
  email: z.string().email(),
});

try {
  const validUserData = UserSchema.parse({ id: 1, name: 'Alice', email: 'alice@example.com' });
  console.log('Gültige Benutzerdaten:', validUserData);
} catch (error) {
  console.error('Validierungsfehler:', error.errors);
}

JSDoc: Kommentare mit Typannotationen zur Dokumentation und Bereitstellung von Informationen für IDEs und statische Analysatoren.

/**
 * @typedef {Object} Product
 * @property {number} id - Eindeutige Produkt-ID.
 * @property {string} name - Produktname.
 * @property {number} price - Produktpreis.
 */

/**
 * Zeigt Produktinformationen an.
 * @param {Product} product - Produktobjekt.
 */
function displayProduct(product) {
  console.log(`Produkt: ${product.name}, Preis: ${product.price}`);
}

const myProduct = { id: 101, name: 'Buch', price: 500 };
displayProduct(myProduct);

Namenskonventionen und Dokumentation: Klare Vereinbarungen darüber, wie Eigenschaften und Methoden von Objekten benannt werden sollen, die in der Dokumentation des Codes beschrieben sind.

TypeScript: Der effektivste Ansatz, der die Verwendung vollständiger Schnittstellen und statischer Typisierung während der Entwicklung ermöglicht.

interface IProduct {
  id: number;
  name: string;
  price: number;
  displayInfo(): void; // Methodendefinition
}

class Book implements IProduct {
  id: number;
  name: string;
  price: number;

  constructor(id: number, name: string, price: number) {
    this.id = id;
    this.name = name;
    this.price = price;
  }

  displayInfo(): void {
    console.log(`Produkt: ${this.name}, Preis: ${this.price}`);
  }
}

const myBook: IProduct = new Book(102, 'Roman', 700);
myBook.displayInfo();

Abstrakte Klassen (in gewissem Maße): Obwohl JavaScript keine echten abstrakten Klassen hat, können sie emuliert werden, indem Fehler beim Versuch, eine Instanz einer abstrakten Klasse zu erstellen oder "abstrakte" Methoden aufzurufen, generiert werden.

class AbstractShape {
  constructor() {
    if (new.target === AbstractShape) {
      throw new Error("Kann keine Instanz der abstrakten Klasse AbstractShape erstellen");
    }
  }

  area() {
    throw new Error("Die Methode area muss in der Unterklasse implementiert werden");
  }
}

class Circle extends AbstractShape {
  radius: number;

  constructor(radius: number) {
    super();
    this.radius = radius;
  }

  area(): number { // Implementierung der abstrakten Methode
    return Math.PI * this.radius * this.radius;
  }
}

// const shape = new AbstractShape(); // Wirft Fehler
const circle = new Circle(5);
console.log("Kreisfläche:", circle.area());

Es ist wichtig zu verstehen, dass diese Methoden unterschiedliche Grade an Strenge und Überprüfung bieten. TypeScript bietet die stärkste statische Überprüfung während der Kompilierung, während die anderen Methoden eher auf Laufzeitüberprüfung oder Dokumentation ausgerichtet sind.

Womit kann man Schnittstellen in JavaScript ersetzen?