DEV Community

Cover image for JavaScript Fundamentals: String Manipulation
Astrodevil
Astrodevil

Posted on • Edited on • Originally published at mranand.com

JavaScript Fundamentals: String Manipulation

Today is the 8th 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.

Comparing Strings

String comparison is actually very simple! The comparison operators ===, < and > that we studied in earlier lectures can be used.

For ===, we may compare the strings case-sensitively to see if they are identical:

console.log( 'a' === 'a' ); // true
console.log( 'a' === 'A' ); // false
console.log( 'a' === 'a ' ); // false ------Because the comparison is case-sensitive and requires exact equality, including whitespace.
Enter fullscreen mode Exit fullscreen mode

Looking up Characters

Characters in strings can be looked up by index in JavaScript. Square brackets [] or charAt are the two methods available for doing this.

"Hello".charAt(1); // e
"Hello"[1]; // e

// we are looking up the character at the 1 index, which turns out to be the character e.
Enter fullscreen mode Exit fullscreen mode

Indexing:

H - 0

e - 1

l - 2

l - 3

o - 4

Zero-based indexing is used for strings. This indicates that the index of the first character is 0, and it increases by 1 for each additional character.

Example: Complete the startsWithX function to determine if the first character of the string argument is the lower-case x. If the first character is x return true. If not, return false.

function startsWithX(string) {
    if(string[0] === "x") {
        return true;
    }
    return false;
}
Enter fullscreen mode Exit fullscreen mode

Character Casing

When working with strings, we frequently prefer to ignore the character casing. Whether it is an upper-case "X" or lower-case "x," we are looking for "x".

Manipulating a string's case can be done in two simple ways:

console.log( "Hello".toLowerCase() );// hello
console.log( "Hello".toUpperCase() ); // HELLO
Enter fullscreen mode Exit fullscreen mode

Either of the following can be used to determine whether a string included the word "hello" regardless of its case:

console.log( "Hello".toUpperCase() === "HELLO" ); // true
console.log( "Hello".toLowerCase() === "hello" ); // true
Enter fullscreen mode Exit fullscreen mode

Example: Let's update our startsWithX(from previous example) function to return true for an upper-case X as well as a lower-case x.

function startsWithX(string) {
    if(string[0].toLowerCase() === "x") {
        return true;
    }
    return false;
}
Enter fullscreen mode Exit fullscreen mode

String Length

Strings have an important feature called length. By using this feature, we can quickly determine how many characters are contained in a string:

console.log( "a".length ); // 1
console.log( "Hello".length ); // 5
Enter fullscreen mode Exit fullscreen mode

Example: Complete the endsWithX function by detecting if the last character in the string is a lower-case x or an upper-case X. Return true if it is, false if not.

Note: The length value will be 1 greater than the last character index because the character indexing is 0 based.

function endsWithX(string) {
    if(string[string.length - 1].toLowerCase() === "x") {
        return true;
    }
    return false;
}
Enter fullscreen mode Exit fullscreen mode

Conclusion

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

Strings in JavaScript allow us to store text that includes characters, integers, and Unicode and is immutable. Additionally, there are numerous built-in functions in JavaScript for creating and manipulating strings in different ways.

Today I learned about String Manipulation in JavaScript.

If You โค๏ธ My Content! Connect Me on Twitter or Supports Me By Buying Me A Coffeeโ˜•

Top comments (0)