¿Cómo puedo procesar cada letra de texto usando Javascript?
Me gustaría alertar a cada letra de una cadena, pero no estoy seguro de cómo hacerlo.
Entonces, si tengo:
var str = 'This is my string';
Me gustaría poder alertar por separado a T
, h
, i
, s
, etc. Este es solo el comienzo de una idea en la que estoy trabajando, pero necesito saber cómo procesar cada letra por separado.
Estaba pensando que tal vez necesitaría usar la función de división después de probar cuál es la longitud de la cadena.
¿Cómo puedo hacer esto?
Si el orden de las alertas es importante, utilice esto:
for (let i = 0; i < str.length; i++) {
alert(str.charAt(i));
}
O esto: ( ver también esta respuesta )
for (let i = 0; i < str.length; i++) {
alert(str[i]);
}
Si el orden de las alertas no importa, use esto:
let i = str.length;
while (i--) {
alert(str.charAt(i));
}
O esto: ( ver también esta respuesta )
let i = str.length;
while (i--) {
alert(str[i]);
}
Mostrar fragmento de código
Probablemente esté más que solucionado. Solo quiero contribuir con otra solución simple:
var text = 'uololooo';
// With ES6
[...text].forEach(c => console.log(c))
// With the `of` operator
for (const c of text) {
console.log(c)
}
// With ES5
for (var x = 0, c=''; c = text.charAt(x); x++) {
console.log(c);
}
// ES5 without the for loop:
text.split('').forEach(function(c) {
console.log(c);
});
Cómo procesar cada letra de texto (con puntos de referencia)
https://jsperf.com/str-for-in-of-foreach-map-2
para
Clásico y con diferencia el que más prestaciones tiene . Deberías optar por este si planeas usarlo en un algoritmo crítico para el rendimiento o si requiere la máxima compatibilidad con las versiones del navegador.
for (var i = 0; i < str.length; i++) {
console.info(str[i]);
}
para... de
for...of es el nuevo ES6 para iterador. Compatible con la mayoría de los navegadores modernos. Es visualmente más atractivo y menos propenso a errores tipográficos. Si opta por este en una aplicación de producción, probablemente debería utilizar un transpilador como Babel .
let result = '';
for (let letter of str) {
result += letter;
}
para cada
Enfoque funcional . Aprobado por Airbnb . La mayor desventaja de hacerlo de esta manera es split()
que crea una nueva matriz para almacenar cada letra individual de la cadena.
¿Por qué? Esto refuerza nuestra regla inmutable. Es más fácil razonar sobre el manejo de funciones puras que devuelven valores que sobre los efectos secundarios.
// ES6 version.
let result = '';
str.split('').forEach(letter => {
result += letter;
});
o
var result = '';
str.split('').forEach(function(letter) {
result += letter;
});
Los siguientes son los que no me gustan.
para...en
A diferencia de for...of, obtienes el índice de letras en lugar de la letra. Funciona bastante mal.
var result = '';
for (var letterIndex in str) {
result += str[letterIndex];
}
mapa
Enfoque funcional, lo cual es bueno. Sin embargo, el mapa no está destinado a usarse para eso. Debe usarse cuando sea necesario cambiar los valores dentro de una matriz, lo cual no es el caso.
// ES6 version.
var result = '';
str.split('').map(letter => {
result += letter;
});
o
let result = '';
str.split('').map(function(letter) {
result += letter;
});
Una posible solución en JavaScript puro:
for (var i = 0; i < str.length; i++)
{
var char = str.charAt(i);
alert(char);
}
La mayoría, si no todas, las respuestas aquí son incorrectas porque se romperán cada vez que haya un carácter en la cadena fuera del Unicode BMP (plano multilingüe básico) . Eso significa que todos los Emoji se romperán .
JavaScript utiliza UTF- 16 Unicode para todas las cadenas. En UTF-16, los caracteres más allá del BMP están formados por dos partes, lo que se denomina " par sustituto " y la mayoría de las respuestas aquí procesarán cada parte de dichos pares individualmente en lugar de como un solo carácter.
Una forma en JavaScript moderno desde al menos 2016 es utilizar el nuevo iterador String . Aquí está el ejemplo (casi) sacado directamente de MDN:
var string = 'A\uD835\uDC68B\uD835\uDC69C\uD835\uDC6A';
for (var v of string) {
alert(v);
}
// "A"
// "\uD835\uDC68"
// "B"
// "\uD835\uDC69"
// "C"
// "\uD835\uDC6A"