Zwei Lösungen zum automatischen Hinzufügen von 0 zum Datum und zur Uhrzeit im regulären JS-Format

Hintergrund

Die Notwendigkeit, Uhrzeit und Datum zu formatieren, ist weit verbreitet und es gibt viele toolbasierte Konvertierungsmethoden. Sie müssen beispielsweise ein Datumsformat wie 2022-3-4 in 2022-03-04 konvertieren, was bedeutet, dass einstelligen Monaten oder Tagen automatisch 0 vorangestellt wird. Dies ist auch mithilfe der API von Drittanbieterbibliotheken wie moment.js und dayjs problemlos möglich. Versuchen wir, es selbst zu implementieren.

Lösung 1

Ideen:

Schauen wir uns zunächst den konventionellen Ansatz an. Nehmen wir als Beispiel das Datum 2022-3-4. Wir teilen die Zeichenfolge zunächst gemäß - auf, um ein Array zu erhalten, und identifizieren dann einstellige Daten wie 3 und 4. Wenn <10, fügen wir vorne 0 hinzu, andernfalls wird keine Operation ausgeführt.

Code:

Funktion formatDate(str) {
  //Return str entsprechend dem - Symbol aufteilen
    .Teilt("-")
    .map((Element) => {
      // +item wandelt den Item-String in eine Zahl um // Wenn er kleiner als 10 ist, füge ein Präfix 0 hinzu
      wenn (+Element < 10) {
        gibt "0" zurück + +Element;
      }

      // Wenn der Wert größer als 10 ist, muss keine 0 hinzugefügt werden
      Artikel zurückgeben;
    })
    .join("-"); // Zum Schluss wieder zusammenbauen }

// Test formatDate("2022-03-4"); // Ausgabe '2022-03-04'

Die obige Lösung eignet sich nur für einfache Konvertierungen wie 2022-3-4 in 2022-03-04. Komplexere Datumsformate oder Datums- und Zeitformate wie 2022-3-4 1:2:3 können nicht abgeglichen werden. Außerdem erkennen wir hier nur das Format -. Was ist, wenn es auch 2022/3/4 und 2022.3.4 gibt?

Lösung 2

Ideen:

Werfen wir einen Blick auf die Verwendung regulärer Ausdrücke. Die Verwendung regulärer Ausdrücke kann den Code nicht nur vereinfachen, sondern auch die Kompatibilität mit mehr Situationen verbessern.

Unsere Kernidee besteht darin, mithilfe von Look-Ahead und Look-Back die Zahlen in der Mitte des Datumsverbinders zu identifizieren und dann zu bestimmen, ob die Zahlen mit 0 aufgefüllt werden müssen. Bevor wir schreiben, machen wir uns mit der Verwendung einiger regulärer Ausdrücke vertraut.

1. Nach vorne schauen: (?=), zurückschauen: (?<=),

Um es einfach auszudrücken:

// Vorausschauend:
A(?=B) //Finde A vor B

// Rückblick:
(?<=B)A //Finde A nach B

// Negativer Vorausblick:
A(?!B) //Finde A, auf das nicht B folgt

// Negativer Rückblick:
(?<!B)A //Suche A, dem kein B vorangeht

Wir können es hier verwenden, um Zahlen zwischen Zeichen wie -, / und zu identifizieren.

2. Wortgrenze: \b

• Wörter beziehen sich auf die Zeichen, mit denen \w übereinstimmen kann, nämlich Zahlen, Groß- und Kleinbuchstaben sowie Unterstriche [0-9a-zA-Z_].
• Mit dem Rahmen ist der Raum um die Platzhalterzeichen herum gemeint.
  

Wir können es hier verwenden, um die Zahlen am Anfang oder Ende des Datums zu identifizieren. Beispielsweise sind in 2022-3-4 1:2:5 die Lücke nach 4, die Lücke vor 1 und die Lücke nach 5 alles Wortgrenzen.

3. Die Ersetzungsmethode ersetzt die passende Zeichenfolge: $&.

Nach dem Abgleichen einer einstelligen Zahl müssen Sie 0 hinzufügen. $& stellt die übereinstimmende Zahl dar und 0$& kann zum Hinzufügen von 0 verwendet werden.

Code:

// Verwenden Sie $&, um die Funktion formatDate(str) { abzugleichen.
  /*  
        Der erste Parameter von replace ist regulär (?<=\/|-|\.|:|\b)\d{1} verwendet Lookbehind und sucht nach / oder - oder. oder: oder einer Wortgrenze oder einer Zahl nach T\d{1}(?=\/|-|\.|:|\b) verwendet Lookahead und sucht nach / oder - oder. oder: oder einer Wortgrenze oder einer Zahl vor T. Der zweite Parameter von replace "0$&" fügt 0 an den Anfang der übereinstimmenden Zeichenfolge ein.

    */
  return str.replace(/(?<=\/|-|\.|:|\b|T)\d{1}(?=\/|-|\.|:|\b|T)/g, "0$&");
}

// Verwende $1, um die Funktion formatDate(str) { abzugleichen.
  /*
        Der erste Parameter von replace ist derselbe wie oben. Der zweite Parameter ist eine Funktion. Der erste Parameter ist der erste übereinstimmende Parameter. Sie können 0 in der Funktion verarbeiten und eintragen.
    */
  return str.replace(
    /(?<=\/|-|\.|:|\b|T)\d{1}(?=\/|-|\.|:|\b|T)/g,
    Funktion ($1) {
      gibt "0" + $1 zurück;
    }
  );
}

// Test formatDate("2022-3-4 1:2:3"); // Ausgabe '2022-03-04 01:02:03'
formatDate("2022/3/4"); // Ausgabe '2022/03/04'
formatDate("2022.3.4"); // Ausgabe '2022.03.04'
formatDate("2020/8/9T1:2:3"); // Ausgabe '2020/08/09T01:02:03'

Zusammenfassen

Wir haben hier nur eine normale String-Konvertierung durchgeführt, die auch einige Mängel aufweist

1. Die Datumsüberprüfung ist nicht integriert
2. Kurzformige Datumsformate wie beispielsweise 01.10.07 werden nicht berücksichtigt.
   

Interessierte Freunde können damit herumspielen und unsere Konvertierungsmethoden bereichern.

siehe

• js regulärer Lookahead und Lookbehind und nicht erfassende Gruppen
• Grenzen regulärer Ausdrücke
• String.prototype.replace()
• Behauptung