Heim > Artikel > Web-Frontend > 10 fantastische JS-String-Tricks, die Sie vielleicht noch nicht kennen
Verwandte Empfehlungen: „Javascript-Video-Tutorial“
Wir nennen eine Zeichenfolge einen String. Dies ist einer der Grundtypen, die in fast allen Programmiersprachen vorkommen. Hier zeige ich Ihnen 10
tolle Tipps zu JS-Strings. Sie kennen sie vielleicht noch nicht? 10
个很棒的技巧,你可能还不知道哦?
JS 字符串允许简单的重复,与纯手工复制字符串不同,我们可以使用字符串的repeat
方法。
const laughing = '小智'.repeat(3) consol.log(laughing) // "小智小智小智" const eightBits = '1'.repeat(8) console.log(eightBits) // "11111111"
有时,我们希望字符串具有特定长度。 如果字符串太短,则需要填充剩余空间,直到达到指定的长度为止。
过去,主要还是使用库 left-pad。 但是,今天我们可以使用padStart
和SpadEnd
方法,选择哪种方法取决于是在字符串的开头还是结尾填充字符串。
// 在开头添加 "0",直到字符串的长度为 8。 const eightBits = '001'.padStart(8, '0') console.log(eightBits) // "00000001" //在末尾添加“ *”,直到字符串的长度为5。 const anonymizedCode = "34".padEnd(5, "*") console.log(anonymizedCode) // "34***"
有多种方法可以将字符串分割成字符数组,我更喜欢使用扩展操作符(...
):
const word = 'apple' const characters = [...word] console.log(characters) // ["a", "p", "p", "l", "e"]
注意,这并不总是像预期的那样工作。有关更多信息,请参见下一个技巧。
可以使用length
属性。
const word = "apple"; console.log(word.length) // 5
但对于中文来说,这个方法就不太靠谱。
那怎么去判断呢,使用解构操作符号(...
)
这种方法在大多数情况下都有效,但是有一些极端情况。 例如,如果使用表情符号,则有时此长度也是错误的。 如果真想计算字符正确长度,则必须将单词分解为 字素簇(Grapheme Clusters) ,这超出了本文的范围,这里就不在这说明。
反转字符串中的字符是很容易的。只需组合扩展操作符(...
)、Array.reverse
方法和Array.join
方法。
const word = "apple" const reversedWord = [...word].reverse().join("") console.log(reversedWord) // "elppa"
和前面一样,也有一些边缘情况。遇到边缘的情况就有需要首先将单词拆分为字素簇。
一个非常常见的操作是将字符串的第一个字母大写。虽然许多编程语言都有一种本地方法来实现这一点,但 JS 需要做一些工作。
let word = 'apply' word = word[0].toUpperCase() + word.substr(1) console.log(word) // "Apple"
另一种方法:
// This shows an alternative way let word = "apple"; // 使用扩展运算符(`...`)拆分为字符 const characters = [...word]; characters[0] = characters[0].toUpperCase(); word = characters.join(""); console.log(word); // "Apple"
假设我们要在分隔符上分割字符串,第一想到的就是使用split
方法,这点,智米们肯定知道。 但是,有一点大家可能不知道,就是split
可以同时拆分多个分隔符, 使用正则表达式就可以实现:
// 用逗号(,)和分号(;)分开。 const list = "apples,bananas;cherries" const fruits = list.split(/[,;]/) console.log(fruits); // ["apples", "bananas", "cherries"]
字符串搜索是一项常见的任务。 在 JS 中,你可以使用String.includes
方法轻松完成此操作。 不需要正则表达式。
const text = "Hello, world! My name is Kai!" console.log(text.includes("Kai")); // true
在字符串的开头或结尾进行搜索,可以使用String.startsWith
和String.endsWith
方法。
const text = "Hello, world! My name is Kai!" console.log(text.startsWith("Hello")); // true console.log(text.endsWith("world")); // false
有多种方法可以替换所有出现的字符串。 可以使用String.replace
方法和带有全局标志的正则表达式。 或者,可以使用新的String.replaceAll
const text = "I like apples. You like apples." console.log(text.replace(/apples/g, "bananas")); // "I like bananas. You like bananas." console.log(text.replaceAll("apples", "bananas")); // "I lik
2. So füllen Sie eine Zeichenfolge auf eine bestimmte Länge aufManchmal möchten wir, dass eine Zeichenfolge eine bestimmte Länge hat. Wenn die Zeichenfolge zu kurz ist, muss der verbleibende Platz aufgefüllt werden, bis die angegebene Länge erreicht ist.
Früher wurde hauptsächlich der linke Block der Bibliothek verwendet. Heute können wir jedoch die Methoden
rrreeepadStart
undSpadEnd
verwenden. Welche Sie wählen, hängt davon ab, ob Sie die Zeichenfolge am Anfang oder am Ende auffüllen möchten.
3. So teilen Sie eine Zeichenfolge in ein Zeichenarray auf
Es gibt viele Möglichkeiten, eine Zeichenfolge in ein Zeichenarray aufzuteilen. Ich bevorzuge die Verwendung des Spread-Operators (...
): 🎜rrreee🎜🎜Hinweis🎜, das funktioniert nicht immer wie erwartet. Weitere Informationen finden Sie im nächsten Tipp. 🎜🎜🎜4. So zählen Sie Zeichen in einer Zeichenfolge🎜🎜🎜Sie können das Attribut length
verwenden. 🎜rrreee🎜Aber für Chinesisch ist diese Methode nicht sehr zuverlässig. 🎜🎜🎜🎜🎜🎜Wie urteilen? Nun, verwenden Sie das Destrukturierungsoperatorsymbol (...
)🎜🎜🎜🎜Diese Methode funktioniert in den meisten Fällen, es gibt jedoch einige Randfälle. Wenn Sie beispielsweise Emoticons verwenden, ist manchmal auch diese Länge falsch. Wenn Sie wirklich die richtige Länge von Zeichen berechnen möchten, müssen Sie das Wort in 🎜Graphem-Cluster🎜 zerlegen, was den Rahmen dieses Artikels sprengt und hier nicht erläutert wird. 🎜🎜🎜5. So kehren Sie die Zeichen in einer Zeichenfolge um 🎜🎜🎜Das Umkehren der Zeichen in einer Zeichenfolge ist einfach. Kombinieren Sie einfach den Spread-Operator (...
), die Methode Array.reverse
und die Methode Array.join
. 🎜rrreee🎜Wie zuvor gibt es einige Randfälle. Bei Grenzfällen ist es notwendig, das Wort zunächst in 🎜Graphem-Cluster🎜 aufzuteilen. 🎜🎜🎜6. So schreiben Sie den ersten Buchstaben einer Zeichenfolge groß 🎜🎜🎜Eine sehr häufige Operation besteht darin, den ersten Buchstaben einer Zeichenfolge groß zu schreiben. Während viele Programmiersprachen dafür eine native Möglichkeit haben, erfordert JS einige Arbeit. 🎜rrreee🎜Eine andere Methode:🎜rrreee🎜🎜7. So teilen Sie eine Zeichenfolge in mehrere Trennzeichen auf 🎜🎜🎜Angenommen, wir möchten eine Zeichenfolge in Trennzeichen aufteilen. Das erste, was uns in den Sinn kommt, ist die Verwendung des Codes split >Methode, Smartphones wissen das definitiv. Was Sie jedoch möglicherweise nicht wissen, ist, dass <code>split
mehrere Trennzeichen gleichzeitig aufteilen kann, was mit regulären Ausdrücken erreicht werden kann: 🎜rrreee🎜🎜8 So überprüfen Sie, ob eine Zeichenfolge ein bestimmtes enthält Sequenz🎜 🎜🎜Die Suche nach Zeichenfolgen ist eine häufige Aufgabe. In JS können Sie dies einfach mit der Methode String.includes
tun. Keine regulären Ausdrücke erforderlich. 🎜rrreee🎜🎜9. So überprüfen Sie, ob eine Zeichenfolge mit einer bestimmten Sequenz beginnt oder endet. 🎜🎜🎜Um am Anfang oder Ende einer Zeichenfolge zu suchen, können Sie String.startsWith
und verwenden String.endsWithMethode. 🎜rrreee🎜🎜10. So ersetzen Sie alle Vorkommen einer Zeichenfolge🎜🎜🎜Es gibt mehrere Möglichkeiten, alle Vorkommen einer Zeichenfolge zu ersetzen. Sie können die Methode <code>String.replace
und reguläre Ausdrücke mit globalen Flags verwenden. Alternativ können Sie die neue Methode String.replaceAll
verwenden. Bitte beachten Sie, dass diese neue Methode nicht in allen Browsern und Node.js-Versionen verfügbar ist. 🎜rrreee🎜🎜Zusammenfassung🎜🎜🎜Strings sind einer der grundlegendsten Datentypen in fast allen Programmiersprachen. Gleichzeitig ist es auch einer der ersten Datentypen, die neue Entwickler erlernen. Allerdings kennen viele Entwickler insbesondere in JavaScript einige interessante Details über Strings nicht. Ich hoffe, dieser Artikel ist hilfreich für Sie. 🎜🎜🎜Originaladresse: https://dev.to/kais_blog/10-awesome-string-tips-you-might-not-know-about-4ep2🎜🎜Autor: Kai🎜🎜Übersetzungsadresse: https://segmentfault .com/a/1190000038542256🎜🎜🎜Weitere Kenntnisse zum Thema Programmierung finden Sie unter: 🎜Einführung in die Programmierung🎜! ! 🎜Das obige ist der detaillierte Inhalt von10 fantastische JS-String-Tricks, die Sie vielleicht noch nicht kennen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!