Anwendungsszenarien:Manchmal werden die an das Backend übergebenen Parameter in Camel Case benannt und beim Echo werden Unterstriche verwendet. In diesem Fall müssen Sie den Schlüsselwert ändern. Methode 1: Regulärer Ausdruck (empfohlen)Camel Case mit waagerechter Linie nach unten: Funktion toLowerLine(str) { var temp = str.replace(/[AZ]/g, Funktion (Übereinstimmung) { returniere "_" + match.toLowerCase(); }); if(temp.slice(0,1) === '_'){ //Wenn der erste Buchstabe ein Großbuchstabe ist, erscheint beim Ausführen von „Replace“ ein zusätzliches „_“, das Sie hier entfernen müssen. temp = temp.slice(1); } Rücklauftemperatur; }; console.log(toLowerLine("TestToLowerLine")); //Test_zur_Lower_Linie console.log(toLowerLine("testToLowerLine")); //Test_zur_Lower_Line Die untere horizontale Linie wird zum Camel Case: Funktion toCamel(str) { return str.replace(/([^_])(?:_+([^_]))/g, Funktion ($0, $1, $2) { gibt $1 + $2 zurück.toUpperCase(); }); } console.log(toCamel('test_to_camel')); //testToCamel Methode 2: Verwenden der Array-Reduce-MethodeCamel Case mit waagerechter Linie nach unten: Funktion doLowerLine(vorherigerWert, aktuellerWert, aktuellerIndex, Array){ wenn(/[AZ]/.test(aktuellerWert)){ aktuellerWert = aktuellerWert.toLowerCase(); wenn(aktuellerIndex===0){ gibt vorherigen Wert + aktuellen Wert zurück; }anders{ gibt vorherigen Wert + '_' + aktuellen Wert zurück; } }anders{ gibt vorherigen Wert + aktuellen Wert zurück; } } Funktion toLowerLine(arr){ wenn(Typ von arr === 'Zeichenfolge'){ arr = arr.split(''); } arr.reduce zurückgeben(doLowerLine,''); } var a = "TestToLowerLine"; var res1 = toLowerLine(a); //Test_zur_Unterlinie var res2 = [].reduce.call(a,doLowerLine,''); //Test_auf_niedrigere_Zeile Die untere horizontale Linie wird zum Camel Case: Funktion doCamel(vorherigerWert, aktuellerWert, aktuellerIndex, Array){ wenn(aktuellerWert === '_'){ returniere vorherigenWert + aktuellenWert.toUpperCase(); }anders{ gibt vorherigen Wert + aktuellen Wert zurück; } } Funktion toCamel(str) { wenn(Typ von str === 'Zeichenfolge'){ str = str.split(''); //In Zeichenarray konvertieren} gibt str.reduce(doCamel) zurück; } console.log(toCamel('test_to_camel')); //TestToCamel Methode 3: Verwenden der Map-Methode des ArraysCamel Case mit waagerechter Linie nach unten: Funktion doLowerLine(Wert, Index, arr){ wenn(/[AZ]/.test(val)){ wenn(index===0){ gibt val.toLowerCase() zurück; }anders{ returniere '_'+val.toLowerCase(); } }anders{ Rückgabewert; } } Funktion toLowerLine(arr){ wenn(Typ von arr === 'Zeichenfolge'){ return [].map.call(arr,doLowerLine).join(''); // Array.prototype.map.call(arr, doLowerLine).join(''); }anders{ arr.map(doLowerLine).join(''); } } var a = "TestToLowerLine"; var res1 = [].map.call(a,doLowerLine).join(''); //Test_zur_unteren_Zeile var res2 = toLowerLine(a); //Test_zur_unteren_Zeile Konvertierung der Unterstrich-Benennung in JS-Strings und der Camel-Case-Benennung1. CamelCase für Bindestrich: var s = "fooStyleCss"; s = s.replace(/([AZ])/g,"-$1").toLowerCase(); //Verwenden Sie reguläre Ausdrücke zum Ersetzen, prägnant und klar, großartig 2. Drehen Sie den Buckel var s1 = "foo-style-css"; s1 = s1.replace(//-(/w)/g, Funktion(alle, Buchstabe){ returniere letter.toUpperCase(); }); //Ich verstehe diesen Teil 2 nicht ganz. Also habe ich selbst eines geschrieben, ^_^. Dieses ist leicht zu verstehen, enthält aber etwas mehr Code. var s = "Stylesheet-Basis"; var a = s.split("-"); var o = a[0]; für(var i=1;i<a.length;i++){ o = o + a[i].slice(0,1).toUpperCase() + a[i].slice(1); } Schreiben Sie ein weiteres, diesmal mit regulären Ausdrücken: var s1 = "Stylesheet-Basis"; s1 = s1.replace(//-(/w)/g, Funktion(x){return x.slice(1).toUpperCase();}); Dies ist das Ende dieses Artikels über die Implementierung der Konvertierung zwischen JS-Unterstreichung und Camel Case (mehrere Methoden). Weitere relevante Inhalte zur Konvertierung zwischen JS-Unterstreichung und Camel Case finden Sie in früheren Artikeln auf 123WORDPRESS.COM oder in den verwandten Artikeln weiter unten. Ich hoffe, Sie werden 123WORDPRESS.COM auch in Zukunft unterstützen! Das könnte Sie auch interessieren:
|
<<: Tutorial zu HTML-Tabellen-Tags (12): Rahmenstil-Attribut FRAME
>>: Die umfassendsten 50 Mysql-Datenbankabfrageübungen
Um die Version und das Tag des Bildes anzuzeigen,...
Einführung in das Schlüsselwort void Zunächst ein...
Kernel: [root@opop ~]# cat /etc/centos-release Ce...
1. Vorbereitung Middleware: Tomcat, Redis, Nginx ...
Inhaltsverzeichnis Variablenbereich Das Konzept d...
Mysqldump wird für logische Backups in MySQL verw...
Methode 1: Verwenden Sie zur Lösung die CSS-Überl...
1. Ziel: Ändern Sie den Wert des character_set_se...
Als ich kürzlich an einem Frontend-Docking-Funkti...
Inhaltsverzeichnis Vorwort Kurzübersicht: JavaScr...
Klicken Sie auf den Ankerlink, um reibungslos zu ...
1. Regulärer Ausdrucksabgleich ~ für Groß- und Kl...
Hintergrund: Einige Experimente müssen auf dem Se...
Inhaltsverzeichnis 1. Einleitung 2. Lassen Sie un...
Der ElasticSearch-Cluster unterstützt動態請求的方式und靜態...