Wie konvertiert man eine Zeichenfolge in ein Zeichenarray in JavaScript?
Ich denke, einen String wie "Hello world!"das Array zu bekommen
['H','e','l','l','o',' ','w','o','r','l','d','!']
Wie konvertiert man eine Zeichenfolge in ein Zeichenarray in JavaScript?
Ich denke, einen String wie "Hello world!"das Array zu bekommen
['H','e','l','l','o',' ','w','o','r','l','d','!']
Antworten:
Hinweis: Dies ist nicht Unicode-kompatibel.
"I💖U".split('')führt zu einem 4-Zeichen-Array,["I", "�", "�", "u"]das zu gefährlichen Fehlern führen kann. In den Antworten unten finden Sie sichere Alternativen.
Teilen Sie es einfach durch eine leere Zeichenfolge.
var output = "Hello world!".split('');
console.log(output);Siehe die String.prototype.split()MDN-Dokumente .
"randomstring".length; //12 "randomstring"[2]; //"n"
str.lengthnicht die Anzahl der Zeichen in der Zeichenfolge an, da einige Zeichen mehr Platz beanspruchen als andere. str.lengthgibt Ihnen die Anzahl der 16-Bit-Zahlen an.
Wie Hippietrail vorschlägt , kann die Antwort des Meders Ersatzpaare brechen und „Zeichen“ falsch interpretieren. Zum Beispiel:
// DO NOT USE THIS!
> '𝟘𝟙𝟚𝟛'.split('')
[ '�', '�', '�', '�', '�', '�', '�', '�' ]Ich schlage vor, eine der folgenden ES2015-Funktionen zu verwenden, um diese Zeichenfolgen korrekt zu handhaben.
> [...'𝟘𝟙𝟚𝟛']
[ '𝟘', '𝟙', '𝟚', '𝟛' ]> Array.from('𝟘𝟙𝟚𝟛')
[ '𝟘', '𝟙', '𝟚', '𝟛' ]uFlag> '𝟘𝟙𝟚𝟛'.split(/(?=[\s\S])/u)
[ '𝟘', '𝟙', '𝟚', '𝟛' ]Verwenden Sie /(?=[\s\S])/uanstelle von " /(?=.)/uweil" .nicht mit Zeilenumbrüchen übereinstimmt .
Wenn Sie sich noch in der ES5.1-Ära befinden (oder wenn Ihr Browser diesen regulären Ausdruck nicht richtig verarbeitet - wie Edge), können Sie diese Alternative verwenden (von Babel transpiliert ):
> '𝟘𝟙𝟚𝟛'.split(/(?=(?:[\0-\uD7FF\uE000-\uFFFF]|[\uD800-\uDBFF][\uDC00-\uDFFF]|[\uD800-\uDBFF](?![\uDC00-\uDFFF])|(?:[^\uD800-\uDBFF]|^)[\uDC00-\uDFFF]))/);
[ '𝟘', '𝟙', '𝟚', '𝟛' ]Beachten Sie, dass Babel versucht, auch nicht übereinstimmende Surrogate korrekt zu behandeln. Dies scheint jedoch nicht für unübertroffene niedrige Surrogate zu funktionieren.
🏳️🌈und die Kombination von diakritischen Zeichen von Zeichen aufteilt . Wenn Sie anstelle von Zeichen in Graphemcluster aufteilen möchten, lesen Sie stackoverflow.com/a/45238376 .
Die spreadSyntax
Sie können die Spread-Syntax verwenden , einen Array-Initialisierer, der im ECMAScript 2015 (ES6) -Standard eingeführt wurde :
var arr = [...str];Beispiele
function a() {
return arguments;
}
var str = 'Hello World';
var arr1 = [...str],
arr2 = [...'Hello World'],
arr3 = new Array(...str),
arr4 = a(...str);
console.log(arr1, arr2, arr3, arr4);Die ersten drei ergeben:
["H", "e", "l", "l", "o", " ", "W", "o", "r", "l", "d"]Der letzte ergibt
{0: "H", 1: "e", 2: "l", 3: "l", 4: "o", 5: " ", 6: "W", 7: "o", 8: "r", 9: "l", 10: "d"}Browser-Unterstützung
Überprüfen Sie die ECMAScript ES6-Kompatibilitätstabelle .
Weiterführende Literatur
spreadwird auch als " splat" (z. B. in PHP oder Ruby oder als " scatter" (z . B. in Python ) bezeichnet.
Demo
Sie können auch verwenden Array.from.
var m = "Hello world!";
console.log(Array.from(m))Diese Methode wurde in ES6 eingeführt.
Dies ist eine alte Frage, aber ich bin auf eine andere Lösung gestoßen, die noch nicht aufgeführt ist.
Mit der Object.assign-Funktion können Sie die gewünschte Ausgabe erhalten:
var output = Object.assign([], "Hello, world!");
console.log(output);
// [ 'H', 'e', 'l', 'l', 'o', ',', ' ', 'w', 'o', 'r', 'l', 'd', '!' ]Nicht unbedingt richtig oder falsch, nur eine andere Option.
Array.from("Hello, world").
[..."Hello, world"]
Es ist schon:
var mystring = 'foobar';
console.log(mystring[0]); // Outputs 'f'
console.log(mystring[3]); // Outputs 'b'Oder verwenden Sie für eine ältere browserfreundliche Version:
var mystring = 'foobar';
console.log(mystring.charAt(3)); // Outputs 'b'alert("Hello world!" == ['H','e','l','l','o',' ','w','o','r','l','d'])
mystring.charAt(index).
charAt()obwohl ich lieber die Array-Variante verwenden würde. Verdammter IE.
Es gibt (mindestens) drei verschiedene Dinge, die Sie sich als "Charakter" vorstellen können, und folglich drei verschiedene Kategorien von Ansätzen, die Sie möglicherweise verwenden möchten.
JavaScript-Zeichenfolgen wurden ursprünglich als Sequenzen von UTF-16-Codeeinheiten erfunden, zu einem Zeitpunkt in der Geschichte, als es eine Eins-zu-Eins-Beziehung zwischen UTF-16-Codeeinheiten und Unicode-Codepunkten gab. Die .lengthEigenschaft eines Strings misst seine Länge in UTF-16-Codeeinheiten, und wenn Sie dies tun, erhalten someString[i]Sie die i- te UTF-16-Codeeinheit von someString.
Folglich können Sie ein Array von UTF-16-Codeeinheiten aus einer Zeichenfolge abrufen, indem Sie eine for-Schleife im C-Stil mit einer Indexvariablen verwenden ...
const yourString = 'Hello, World!';
const charArray = [];
for (let i=0; i<=yourString.length; i++) {
charArray.push(yourString[i]);
}
console.log(charArray);Es gibt auch verschiedene kurze Möglichkeiten, um dasselbe zu erreichen, z. B. die Verwendung .split()der leeren Zeichenfolge als Trennzeichen:
const charArray = 'Hello, World!'.split('');
console.log(charArray);Wenn Ihre Zeichenfolge jedoch Codepunkte enthält, die aus mehreren UTF-16-Codeeinheiten bestehen, werden diese in einzelne Codeeinheiten aufgeteilt, die möglicherweise nicht Ihren Wünschen entsprechen. Beispielsweise besteht die Zeichenfolge '𝟘𝟙𝟚𝟛'aus vier Unicode-Codepunkten (Codepunkte 0x1D7D8 bis 0x1D7DB), die in UTF-16 jeweils aus zwei UTF-16-Codeeinheiten bestehen. Wenn wir diese Zeichenfolge mit den oben beschriebenen Methoden aufteilen, erhalten wir ein Array mit acht Codeeinheiten:
const yourString = '𝟘𝟙𝟚𝟛';
console.log('First code unit:', yourString[0]);
const charArray = yourString.split('');
console.log('charArray:', charArray);Vielleicht möchten wir stattdessen unsere Zeichenfolge in Unicode-Codepunkte aufteilen! Dies ist möglich, seit ECMAScript 2015 der Sprache das Konzept einer Iterierbarkeit hinzugefügt hat . Strings sind jetzt iterabel, und wenn Sie sie durchlaufen (z. B. mit einer for...ofSchleife), erhalten Sie Unicode-Codepunkte, keine UTF-16-Codeeinheiten:
const yourString = '𝟘𝟙𝟚𝟛';
const charArray = [];
for (const char of yourString) {
charArray.push(char);
}
console.log(charArray);Wir können dies verkürzen, indem wir Array.fromüber das Iterable iterieren, das implizit übergeben wird:
const yourString = '𝟘𝟙𝟚𝟛';
const charArray = Array.from(yourString);
console.log(charArray);Unicode-Codepunkte sind jedoch nicht die größtmögliche Sache, die möglicherweise auch als "Zeichen" betrachtet werden könnte . Einige Beispiele für Dinge, die vernünftigerweise als ein einziges "Zeichen" betrachtet werden könnten, aber aus mehreren Codepunkten bestehen, sind:
Wir können unten sehen, dass, wenn wir versuchen, eine Zeichenfolge mit solchen Zeichen über den obigen Iterationsmechanismus in ein Array zu konvertieren, die Zeichen im resultierenden Array aufgelöst werden. (Falls eines der Zeichen in Ihrem System nicht gerendert wird, yourStringbesteht es unten aus einem Großbuchstaben A mit akutem Akzent, gefolgt von der Flagge des Vereinigten Königreichs, gefolgt von einer schwarzen Frau.)
const yourString = 'Á🇬🇧👩🏿';
const charArray = Array.from(yourString);
console.log(charArray);Wenn wir jedes dieser Elemente als einzelnes Element in unserem endgültigen Array behalten möchten, benötigen wir ein Array von Graphemen , keine Codepunkte.
JavaScript hat keine integrierte Unterstützung dafür - zumindest noch nicht. Wir brauchen also eine Bibliothek, die die Unicode-Regeln versteht und implementiert, für welche Kombination von Codepunkten ein Graphem besteht. Zum Glück gibt es eines: Orlings Graphemspalter . Sie möchten es mit npm installieren oder, wenn Sie npm nicht verwenden, die Datei index.js herunterladen und mit einem <script>Tag versehen. Für diese Demo werde ich es von jsDelivr laden.
Graphem-Splitter gibt uns eine GraphemeSplitterKlasse mit drei Methoden: splitGraphemes, iterateGraphemes, und countGraphemes. Natürlich wollen wir splitGraphemes:
const splitter = new GraphemeSplitter();
const yourString = 'Á🇬🇧👩🏿';
const charArray = splitter.splitGraphemes(yourString);
console.log(charArray);<script src="https://cdn.jsdelivr.net/npm/grapheme-splitter@1.0.4/index.js"></script>Und da sind wir - eine Reihe von drei Graphemen, was Sie wahrscheinlich wollten.
Sie können über die Länge der Zeichenfolge iterieren und das Zeichen an jeder Position verschieben :
const str = 'Hello World';
const stringToArray = (text) => {
var chars = [];
for (var i = 0; i < text.length; i++) {
chars.push(text[i]);
}
return chars
}
console.log(stringToArray(str))"😃".charAt(0)wird einen unbrauchbaren Charakter zurückgeben
.split("")die schnellste Option
.split("")scheint in Firefox stark optimiert werden. Während die Schleife eine ähnliche Leistung in Chrom und Firefox aufweist, ist die Aufteilung in Firefox für kleine und große Eingaben erheblich schneller.
einfache Antwort:
let str = 'this is string, length is >26';
console.log([...str]);Eine Möglichkeit ist die nächste:
console.log([1, 2, 3].map(e => Math.random().toString(36).slice(2)).join('').split('').map(e => Math.random() > 0.5 ? e.toUpperCase() : e).join(''));Wie wäre es damit?
function stringToArray(string) {
let length = string.length;
let array = new Array(length);
while (length--) {
array[length] = string[length];
}
return array;
}Array.prototype.slice erledigt die Arbeit ebenfalls.
const result = Array.prototype.slice.call("Hello world!");
console.log(result);
"𨭎".split('')führt zu["�", "�"].