¿Cómo obtener una array de caracteres de una string en JavaScript?

La string en JavaScript se puede convertir en una array de caracteres utilizando las funciones split() y Array.from().

Uso de la función String split() : La función str.split() se usa para dividir la string dada en una array de strings separándola en substrings usando un separador específico proporcionado en el argumento. Sintaxis:

str.split(separator, limit)

Ejemplo: 

html

<!DOCTYPE html>
<html>
 
<head>
    <title>
        String to a character array
    </title>
</head>
 
<body style="text-align:center;">
 
    <h1>GeeksforGeeks</h1>
         
    <p id = "one" >GeeksforGeeks: A computer science portal</p>
     
    <input type="button" value="Click Here!" onclick="myGeeks()">
     
    <script>
        function myGeeks() {
            var str = document.getElementById("one").innerHTML;
            document.getElementById("one").innerHTML = str.split("");
        }
    </script>
</body>
 
</html>                   

Salida: Antes de hacer clic en el botón: Después de hacer clic en el botón:  

Uso de la función Array.from() : la función Array.from() es una función incorporada en JavaScript que crea una nueva instancia de array a partir de una array dada. En el caso de una string, cada alfabeto de la string se convierte en un elemento de la nueva instancia de array y, en el caso de valores enteros, la nueva instancia de array simplemente toma los elementos de la array dada. Sintaxis:

Array.from(str)

Ejemplo: 

html

<!DOCTYPE html>
<html>
 
<head>
    <title>
        String to a character array
    </title>
</head>
 
<body style="text-align:center;">
 
    <h1>GeeksforGeeks</h1>
         
    <p id = "one" >GeeksforGeeks: A computer science portal</p>
     
    <input type="button" value="Click Here!" onclick="myGeeks()">
     
    <script>
        function myGeeks() {
            var str = document.getElementById("one").innerHTML;
            document.getElementById("one").innerHTML = Array.from(str);
        }
    </script>
</body>
 
</html>                   

Producción: 

  • Antes de hacer clic en el botón:  
  • Después 
  • Haciendo clic en el botón:

Uso del operador de extensión : el operador de extensión permite que un iterable se expanda en su lugar. En el caso de una string, es una string de ejemplo en un carácter y capturamos todo el carácter de la string en una array.  Sintaxis:

var variableName = [ ...value ];

Ejemplo:

HTML

<!DOCTYPE html>
<html>
 
<head>
    <title>
        String to a character array
    </title>
</head>
 
<body style="text-align:center;">
 
    <h1>GeeksforGeeks</h1>
         
    <p id = "one" >GeeksforGeeks: A computer science portal</p>
 
     
    <input type="button" value="Click Here!" onclick="myGeeks()">
     
    <script>
        function myGeeks() {
            var str = document.getElementById("one").innerHTML;
            document.getElementById("one").innerHTML = [...str];
        }
    </script>
</body>
 
</html>

Producción:

  • Antes de hacer clic en el botón:

operador de propagación

  • Después de hacer clic en el botón: 

operador de propagación

JavaScript es mejor conocido por el desarrollo de páginas web, pero también se usa en una variedad de entornos que no son de navegador. Puede aprender JavaScript desde cero siguiendo este tutorial de JavaScript y ejemplos de JavaScript .

Publicación traducida automáticamente

Artículo escrito por AdeshSingh1 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *