Skip to main content

Strings

Introduction​

Strings represent text in JavaScript. They are sequences of characters enclosed in single quotes ('), double quotes ("), or backticks (`).

Strings in JavaScript are immutable: once created, they cannot be changed. However, you can create new strings from existing ones using operators or methods.

Strings are one of the most commonly used types in programming — for user input, displaying messages, manipulating text, and working with data. JavaScript provides a rich set of built-in methods to work with them.

Concepts​

  • .length - Gives the length of a string.
  • .toUpperCase(), .toLowerCase() - change case.
  • .trim() - remove whitespace at the start and end of the string.
  • .includes(substring) - check if substring exists.
  • .indexOf(substring) - find position of substring.
  • .slice(start,end) - extract part of a string.
  • .split(separator) - convert string to array.
  • .replace(search,replacement) - replace part of a string.

Template Literals​

  • Use backticks(`).
  • Support multiline strings and interpolation(${expression}).

Examples​

const name = "Alice";
console.log(name.length); 
console.log(name.toUpperCase()); 
console.log("   hello   ".trim());
console.log("JavaScript".includes("Script"));

Challenges​

1. Full name length​

  • Create a string with your full name.
  • Print its length.
💡 Show Answer
let fullName = "Alice Johnson";
console.log(fullName.length);

2. Uppercase/lowercase​

  • Convert "JavaScript" to uppercase and lowercase.
💡 Show Answer
console.log("JavaScript".toUpperCase());
console.log("JavaScript".toLowerCase());

3. Trim whitespace​

  • Trim the spaces from " Hello World " and print the result.
💡 Show Answer
console.log("   Hello World   ".trim());

4. Includes check​

  • Check whether "banana" includes "na".
💡 Show Answer
console.log("banana".includes("na"));

5. Extract "Script"​

  • Extract "Script" from the string "JavaScript" using .slice().
💡 Show Answer
console.log("JavaScript".slice(4));

6. Split into words​

  • Use .split(" ") to turn "I love coding" into an array of words.
💡 Show Answer
console.log("I love coding".split(" "));

7. Replace word​

  • Replace "bad" with "good" in the string "This is bad".
💡 Show Answer
console.log("This is bad".replace("bad","good"));

8. Template literal multiline​

  • Create a template literal that prints:
My name is [name].
I am learning JavaScript.
💡 Show Answer
let name="Sarah McCabe";
console.log(`My name is ${name}.\nI am learning JavaScript.`);

9. Count vowels​

  • Write a function countVowels(str) that returns how many vowels are in a string.
💡 Show Answer
function countVowels(str) {
  // Define vowels
  const vowels = "aeiouAEIOU";
  let count = 0;

  // Loop through each character
  for (let char of str) {
    if (vowels.includes(char)) {
      count++;
    }
  }

  return count;
}

// Example usage:
console.log(countVowels("Hello World")); // 3 ("e", "o", "o")
console.log(countVowels("JavaScript"));  // 3 ("a", "a", "i")

10. Palindrome check​

  • Create a function isPalindrome that takes a String parameter and returns if the parameter is a Palindrome or not.
  • Call the function with different String values.
💡 Show Answer
function isPalindrome(str){
  // Convert to lowercase and remove any non character / digits
  let s=str.toLowerCase().replace(/[^a-z0-9]/g,"");
  return s===s.split("").reverse().join("");
}

console.log(isPalindrome("Civic"));
console.log(isPalindrome("Radar"));
console.log(isPalindrome("Long Weekends!"));