Hands-On Design Patterns with React Native

Using the Kilo social media notation

You know that kilo means 1,000. Social media designers pushed this idea to the web and mobiles. Whenever a number is greater than 1,000, they replace the last 3 digits with K. For instance 20K means 20,000.

The trivial implementation:

const likes = this.state.likeCount.toString();...<Text style={styles.text}>    {        likes.length > 3            ? `${likes.substring(0, likes.length - 3)}K`            : likes    }</Text>

However, a number such as 9,876,543,210 is going to overflow again. But 9,876,543K is still too long. Let's solve this with a simple recursive function:

// src / Chapter 3 / Example 12 / src / LikeCounter.jskiloText = (nr, nrK = 0) => (nr.length > 3    ? this.kiloText(nr.substring(0, nr.length - 3), nrK + 1) : nr + Array(nrK). ...