Heim  >  Artikel  >  Web-Frontend  >  10 fantastische JS-String-Tricks, die Sie vielleicht noch nicht kennen

10 fantastische JS-String-Tricks, die Sie vielleicht noch nicht kennen

青灯夜游
青灯夜游nach vorne
2021-01-08 10:14:432095Durchsuche

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个很棒的技巧,你可能还不知道哦?

1.如何多次复制一个字符串

JS 字符串允许简单的重复,与纯手工复制字符串不同,我们可以使用字符串的repeat方法。

const laughing = '小智'.repeat(3)
consol.log(laughing) // "小智小智小智"

const eightBits = '1'.repeat(8)
console.log(eightBits) // "11111111"

2. 如何填充一个字符串到指定的长度

有时,我们希望字符串具有特定长度。 如果字符串太短,则需要填充剩余空间,直到达到指定的长度为止。

过去,主要还是使用库 left-pad。 但是,今天我们可以使用padStartSpadEnd方法,选择哪种方法取决于是在字符串的开头还是结尾填充字符串。

// 在开头添加 "0",直到字符串的长度为 8。
const eightBits = '001'.padStart(8, '0')
console.log(eightBits) // "00000001"

//在末尾添加“ *”,直到字符串的长度为5。
const anonymizedCode = "34".padEnd(5, "*")
console.log(anonymizedCode) // "34***"

3.如何将字符串拆分为字符数组

有多种方法可以将字符串分割成字符数组,我更喜欢使用扩展操作符(...):

const word = 'apple'
const characters = [...word]
console.log(characters) // ["a", "p", "p", "l", "e"]

注意,这并不总是像预期的那样工作。有关更多信息,请参见下一个技巧。

4.如何计算字符串中的字符

可以使用length属性。

const word = "apple";
console.log(word.length) // 5

但对于中文来说,这个方法就不太靠谱。

10 fantastische JS-String-Tricks, die Sie vielleicht noch nicht kennen

10 fantastische JS-String-Tricks, die Sie vielleicht noch nicht kennen

那怎么去判断呢,使用解构操作符号(...)

10 fantastische JS-String-Tricks, die Sie vielleicht noch nicht kennen

这种方法在大多数情况下都有效,但是有一些极端情况。 例如,如果使用表情符号,则有时此长度也是错误的。 如果真想计算字符正确长度,则必须将单词分解为 字素簇(Grapheme Clusters) ,这超出了本文的范围,这里就不在这说明。

5.如何反转字符串中的字符

反转字符串中的字符是很容易的。只需组合扩展操作符(...)、Array.reverse方法和Array.join方法。

const word = "apple"
const reversedWord = [...word].reverse().join("")
console.log(reversedWord) // "elppa"

和前面一样,也有一些边缘情况。遇到边缘的情况就有需要首先将单词拆分为字素簇

6. 如何将字符串中的第一个字母大写

一个非常常见的操作是将字符串的第一个字母大写。虽然许多编程语言都有一种本地方法来实现这一点,但 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"

7.如何在多个分隔符上分割字符串

假设我们要在分隔符上分割字符串,第一想到的就是使用split方法,这点,智米们肯定知道。 但是,有一点大家可能不知道,就是split可以同时拆分多个分隔符, 使用正则表达式就可以实现:

// 用逗号(,)和分号(;)分开。

const list = "apples,bananas;cherries"
const fruits = list.split(/[,;]/)
console.log(fruits); // ["apples", "bananas", "cherries"]

8.如何检查字符串是否包含特定序列

字符串搜索是一项常见的任务。 在 JS 中,你可以使用String.includes方法轻松完成此操作。 不需要正则表达式。

const text = "Hello, world! My name is Kai!"
console.log(text.includes("Kai")); // true

9.如何检查字符串是否以特定序列开头或结尾

在字符串的开头或结尾进行搜索,可以使用String.startsWithString.endsWith方法。

const text = "Hello, world! My name is Kai!"

console.log(text.startsWith("Hello")); // true

console.log(text.endsWith("world")); // false

10.如何替换所有出现的字符串

有多种方法可以替换所有出现的字符串。 可以使用String.replace方法和带有全局标志的正则表达式。 或者,可以使用新的String.replaceAll

1. So kopieren Sie einen String mehrmals

JS-Strings ermöglichen eine einfache Wiederholung von Strings.

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 auf

Manchmal 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 padStart und SpadEnd verwenden. Welche Sie wählen, hängt davon ab, ob Sie die Zeichenfolge am Anfang oder am Ende auffüllen möchten.

rrreee

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. 🎜🎜10 fantastische JS-String-Tricks, die Sie vielleicht noch nicht kennen🎜🎜🎜🎜Wie urteilen? Nun, verwenden Sie das Destrukturierungsoperatorsymbol (...)🎜🎜10 fantastische JS-String-Tricks, die Sie vielleicht noch nicht kennen🎜🎜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!

Stellungnahme:
Dieser Artikel ist reproduziert unter:segmentfault.com. Bei Verstößen wenden Sie sich bitte an admin@php.cn löschen