LabEx
LoginBeitreten

Erstellen von URL-freundlichen Slugs mit JavaScript

Beginner

This tutorial is from open-source community. Access the source code

Einführung

In diesem Lab werden wir untersuchen, wie man mithilfe von JavaScript einen String in einen URL-freundlichen Slug umwandelt. Der Prozess umfasst die Normalisierung des Strings, indem man ihn in Kleinbuchstaben umwandelt und Sonderzeichen entfernt, gefolgt von der Ersetzung von Leerzeichen, Bindestrichen und Unterstrichen durch Bindestriche. Am Ende dieses Labs wirst du eine Funktion haben, die aus jedem gegebenen String einen Slug generieren kann, was es einfacher macht, ihn in URLs und anderen webbasierten Anwendungen zu verwenden.

Funktion zum Konvertieren eines Strings in einen URL-Slug

Um einen String in einen Slug umzuwandeln, der in einer URL verwendet werden kann, folge diesen Schritten:

  1. Öffne das Terminal/SSH und tippe node, um mit der Codeausführung zu beginnen.
  2. Verwende die Methoden String.prototype.toLowerCase() und String.prototype.trim(), um den String zu normalisieren.
  3. Verwende die Methode String.prototype.replace(), um Leerzeichen, Bindestriche und Unterstriche durch - zu ersetzen und Sonderzeichen zu entfernen.
  4. Implementiere folgenden Code:
const slugify = (str) =>
  str
    .toLowerCase()
    .trim()
    .replace(/[^\w\s-]/g, "")
    .replace(/[\s_-]+/g, "-")
    .replace(/^-+|-+$/g, "");
  1. Teste die Funktion mit der Eingabe slugify('Hello World!'); und es sollte die Ausgabe 'hello-world' zurückgeben.

Zusammenfassung

Herzlichen Glückwunsch! Du hast das Lab "String to Slug" abgeschlossen. Du kannst in LabEx weitere Labs absolvieren, um deine Fähigkeiten zu verbessern.