Navigate back to the homepage

how to get each character of string of string in react native?

Infinitbility
React Native
August 18th, 2022 · 1 min read
how to get each character of string of string in react native?

Hi Friends 👋,

Welcome To Infinitbility! ❤️

To each character of string in react native, use for...of loop, it will return each character one by one. You have to just use for...of loop on your string string.

Let’s see short example to use for loop on string to get each char.

1for (let char of string) {
2 console.log(char)
3}

Today, I’m going to show you How do I get each character of string in react native, as above mentioned, I’m going to use the for...of loop method to get every char.

Let’s start today’s tutorial how do you get each character of string in react native?

React native get each character of string example

Here, we will take string state with some data and use for...of loop method to get each char of string.

1import React, { useState, useEffect } from "react";
2import { Text, View } from 'react-native';
3
4export default function App() {
5 const [str, setStr] = useState("Infinitbility");
6
7 useEffect(() => {
8 for (let char of str) {
9 console.log(char);
10 }
11 }, []);
12
13 return (
14 <View>
15 {str.split("").map((char) => {
16 return <Text>{char}</Text>;
17 })}
18 </View>
19 );
20}

To get each character of the string to render components, I have used the split("") method to convert string to array and apply map() to iterate.

I hope it helps you, All the best 👍.

Output

React native get each character of string example
React native get each character of string example

Try it yourself

Follow me on Twitter

Join our email list and get notified about new content

No worries, I respect your privacy and I will never abuse your email.

Every week, on Tuesday, you will receive a list of free tutorials I made during the week (I write one every day) and news on other training products I create.

Looking For React Native Tutorial?

we are trying to create the best Tutorial for react native developers.

When you want a daily updates about React Native Tutorial or infinitbility update subscribe to our newsletter.

Read React Native Tutorial

Request New Tutorial or Article on mail [email protected]

Guide book

Guidebook: The Javascript Monorepo Photoshop Guide

Tutorials

Categories

More articles from Infinitbility

how to get last two character of string in javascript?

how to get last two character of string in javascript?

An example of get last two character of a string in javascript with the step-by-step guide.

August 17th, 2022 · 1 min read
how to get last two character of string in react js?

how to get last two character of string in react js?

An example of get last two character of string in react js with the step-by-step guide.

August 17th, 2022 · 1 min read
© 2020–2022 Infinitbility
About
Link to $https://medium.com/infinitbilityLink to $https://www.facebook.com/InfinitbilityLink to $https://github.com/infinitbilityLink to $https://twitter.com/infinitbilityLink to $https://www.buymeacoffee.com/infinitbilityLink to $mailto:[email protected]