Iterate Over Characters of a String in TypeScript

Iterating over characters of a string involves going through them one by one using loops or specific methods. This is useful for tasks like changing or analyzing the content of a string efficiently.

Example:

Input: string = "Hello Geeks";
Output:
H
e
l
l
o
G
e
e
k
s

Below listed methods can be used to iterate over characters of a string in TypeScript.

Using for Loop

The for-loop syntax is straightforward. It iterates over each character in the string by accessing the characters using the string's index.

Syntax:

for (statement 1 ; statement 2 ; statement 3){
    //code here
};

Example: The below code implements the for loop to iterate over characters of a string.

type CharIterator = (str: string) => void;

const iterateOverCharacters: CharIterator = (str) => {
    for (let i = 0; i < str.length; i++) {
        const char: string = str[i];
        console.log(char);
    }
};

const myString: string = "GeeksforGeeks";
iterateOverCharacters(myString);

Output:

G
e
e
k
s
f
o
r
G
e
e
k
s

Using for…of Loop

The for...of loop syntax allows direct iteration over each character in the string without needing to visit the index explicitly.

Syntax:

for ( variable of iterableObjectName) {
   //code here
}

Example: The below code explains the use of for/of loop to iterate over string characters.

type CharIterator = (str: string) => void;

const iterateOverCharacters: CharIterator = (str) => {
    for (const char of str) {
        console.log(char);
    }
};

const myString: string = "TypeScript";
iterateOverCharacters(myString);

Output:

T
y
p
e
S
c
r
i
p
t

Using split() Method

The split() method splits the string into array of characters, which can then be iterated over using a loop or array methods.

Syntax:

str.split('');

Example: The below code is practical implementation of the split() method to iterate over string characters.

type CharIterator = (str: string) => void;

const iterateOverCharacters: CharIterator = (str) => {
    const chars: string[] = str.split('');
    for (const char of chars) {
        console.log(char);
    }
};

const myString: string = "JavaScript";
iterateOverCharacters(myString);

Output:

J
a
v
a
S
c
r
i
p
t

Using forEach Method with split()

The forEach method can be used to iterate over the array returned by str.split(''). This method iterates over each element of the array and applies the provided function to each element.

Syntax:

array.forEach(()=>{});

type CharIterator = (str: string) => void;

const iterateOverCharacters: CharIterator = (str) => {
    str.split('').forEach(char => {
        console.log(char);
    });
};

const myString: string = "Geeks";
iterateOverCharacters(myString);

Output:

G
e
e
k
s

Using the spread operator

The spread operator (...str) converts the string str into an array of individual characters, allowing each character to be iterated over and processed using the forEach method.

Syntax:

...operatingValue;

type CharIterator = (str: string) => void;

const iterateOverCharacters: CharIterator = (str) => {
    [...str].forEach((char: string) => {
        console.log(char);
    });
};

const myString: string = "GFG";
iterateOverCharacters(myString);

Output:

G
F
G

Using Array.from() Method

The Array.from() method creates a new, shallow-copied array instance from an array-like or iterable object, such as a string. This allows for convenient iteration over the characters of the string.

Syntax:

Array.from(string).forEach((char: string) => {
    // code
});

Example: Below is the implementation of the above-discussed approach.

type CharIterator = (str: string) => void;

const iterateOverCharacters: CharIterator = (str) => {
    Array.from(str).forEach((char: string) => {
        console.log(char);
    });
};

const myString: string = "GFG";
iterateOverCharacters(myString);

Output:

G
F
G

Using while loop and charAt

In this approach we initialize the string str. We use a while loop to iterate over each character. The loop runs as long as i is less than the length of the string. Inside the loop, we use str.charAt(i) to get the character at the current index i. We increment i after each iteration to move to the next character.

Example: Below is the implementation of the above-discussed approach.

let str: string = "GFG";
let i: number = 0;

while (i < str.length) {
    console.log(str.charAt(i));
    i++;
}

Output:

G
F
G

Using String.prototype.replace Method

The String.prototype.replace method can be used with a regular expression to iterate over each character of the string by providing a function to process each match (i.e., each character).

Syntax:

str.replace(/./g, (char) => {
    // code to process each character
});

Example: The below code demonstrates how to use the replace method to iterate over the characters of a string and log each character to the console.

type CharIterator = (str: string) => void;

const iterateOverCharacters: CharIterator = (str) => {
    str.replace(/./g, (char) => {
        console.log(char);
        return char; 
    });
};

const myString: string = "HelloGeeks";
iterateOverCharacters(myString);

Output:

H
e
l
l
o
G
e
e
k
s