JavaScript Fundamentals: String Looping, Index Of and Slicing Strings

Today is the 9th day of my #100DaysOfCode journey with JavaScript.

I write about my learnings in an explained way through my blogs and socials. If you want to join me on the learning journey, make sure to follow my blogs and social and share yours too. Let's learn together!🫱🏼‍🫲🏼

This Article is a part of the JavaScript Fundamentals series.

String Looping

Strings are really simple to loop through. We learned how to retrieve characters by using the .length property and [].

So how can we loop over strings using these?

const string = "Hello";
for(let i = 0; i < string.length; i++) {
    console.log(string[i]);
}

It will log: H, e, l, l, o in that order after each iteration.

Example: Complete the function isAllX to determine if the entire string is made of lower-case x or upper-case X. Return true if they are, false if not.

function isAllX(string) {
for(let i = 0; i < string.length; i++){
    if(string[i].toLowerCase() !== "x"){
        return false;
    }
}
return true;
}

Index Of

In the previous section, we learned to look up a character by index. Now, is the time to find the index of a specific string.

indexOf method is used to find the first index of a string.

"Hello".indexOf("e"); // 1
"abc".indexOf("q"); // -1 
"happy man dance".indexOf("man"); // 6

Both single characters and entire strings can be searched for in the index! indexOf will return -1 if the index could not be located.

Example: In the string argument find the index of the first lowercase "x" and return it.

function findFirstX(string) {
    return string.indexOf('x');
}

Slicing Strings

We have another string method slice!

Slice accepts two parameters: a start index and an end index. The resulting string is a sliced string between those two indexes, except for the character at the end index.

"An apple".slice(0,2); // An
"The 20 Jokers".slice(4,8); // 20 J

If the last index is not provided, slice will continue until the end of the string:

"Please Slice Me".slice(7); // Slice Me

We can also use negative arguments to slice strings starting from the end of the string!

"the apple".slice(-5); // apple
"the apple".slice(-5, -1); // appl

Example: Let's find the longer half of the string before and after the x! First, you'll need to find the lower-case x. Once you've found the x, split the string in half. The first half will be the string before the x, the second half will be the string after the x.

Take the longer string and return it!

// split the string at the first occurrence of x
// return the larger of the two resulting strings
// i.e. HappyxDeveloper => Developer
function splitAtX(string) {
    const index = string.indexOf('x');
    const a = string.slice(0,index);
    const b = string.slice(index+1);
    return (a.length > b.length) ? a : b;
}

Conclusion

Ending with an extra bit of information about JavaScript functions...

On strings, there is a lastIndexOf method as well. It locates the string's last occurrence and returns its index.

Today I learned about String Looping, Index Of and Slicing Strings in JavaScript.

If You ❤️ My Content! Connect Me on Twitter or Supports Me By Buying Me A Coffee☕