0

4 maneiras de converter string em array de caracteres em JavaScript

#JavaScript
Ariosto Leal
Ariosto Leal

Aqui estão 4 maneiras de dividir uma palavra em uma série de caracteres. "Dividir" é a forma mais comum e mais robusta. Mas, com a adição do ES6, há mais ferramentas no arsenal JS 


const string = 'word';

// Option 1
string.split('');

// Option 2
[...string];

// Option 3
Array.from(string);

// Option 4
Object.assign([], string);

// Result:
// ['w', 'o', 'r', 'd']

conteudo

Cenários

Matriz de personagens

Separadores Específicos

Strings contendo emojis



Cenários

Em vez de passar pelos prós e contras de cada forma diferente. Deixe-me mostrar os diferentes cenários em que um é preferível ao outro.


Matriz de personagens

Se tudo o que você está fazendo é querer separar a string por cada caractere da string, todas as formas são adequadas e lhe darão o mesmo resultado

const string = 'hi there';

const usingSplit = string.split('');
const usingSpread = [...string];
const usingArrayFrom = Array.from(string);
const usingObjectAssign = Object.assign([], string);

// Result
// [ 'h', 'i', ' ', 't', 'h', 'e', 'r', 'e' ]


Separadores Específicos

Se você quiser dividir sua string por um caractere específico, esse splité o caminho a seguir.

const string = 'split-by-dash';

const usingSplit = string.split('-');
// [ 'split', 'by', 'dash' ]

As outras maneiras são limitadas por cada caractere de string apenas

const string = 'split-by-dash';

const usingSpread = [...string];
const usingArrayFrom = Array.from(string);
const usingObjectAssign = Object.assign([], string);

// Result:
// [ 's', 'p', 'l', 'i', 't', '-', 'b', 'y', '-', 'd', 'a', 's', 'h' ]


Strings contendo emojis

Se suas strings contêm emojis, então splitou Object.assignnão pode ser a melhor escolha. Vamos ver o que acontece:

const string = 'cake😋';

const usingSplit = string.split('');
const usingObjectAssign = Object.assign([], string);

// Result
// [ 'c', 'a', 'k', 'e', '�', '�' ]

No entanto, se usarmos as outras maneiras, funciona:

const usingSpread = [...string];
const usingArrayFrom = Array.from(string);

// Result
// [ 'c', 'a', 'k', 'e', '😋' ]

Isso ocorre porque splitsepara os caracteres por unidades de código UTF-16, que são problemáticas porque os caracteres emoji são UTF-8. Se olharmos para o nosso emoji yum, '😋'ele é, na verdade, composto de 2 caracteres, NÃO 1, conforme percebemos.

'😋'.length; // 2

Isso é o que é chamado de clusters de grafema - onde o usuário percebe como uma única unidade, mas por baixo do capô, é na verdade composto de várias unidades. Os métodos mais recentes spreadArray.fromestão melhor equipados para lidar com estes e irá dividir a cadeia por grupos grafema 👍

0
3

Comentários (0)

None

Brasil