JavaScript · Data Structures

Strings

Strings are text. Names, messages, emails and URLs are all strings, and JavaScript gives you powerful tools to work with them.

Beginner 5 min Lesson 15 of 49 Runnable examples
Before you start:Data Types
0/49 in JavaScript
On this page · 5 min · Beginner

Learning objectives#

  • Measure and clean strings
  • Search inside strings
  • Extract and replace parts of strings
  • Split strings into arrays

Explanation#

Strings can use single quotes, double quotes or backticks. Backticks allow ${expressions} inside (template literals).

Strings are immutable: methods like toUpperCase return a new string; the original is unchanged.

Common tools: trim (remove outer spaces), includes/startsWith (search), slice (cut out part), replace (swap text), split (turn into an array).

Code example: Working with text#

JavaScriptWorking with text Runnable
const raw = '  Hello, JavaScript!  ';
const s = raw.trim();


console.log(s.length);
console.log(s.toUpperCase());
console.log(s.includes('Java'), s.startsWith('Hello'));
console.log(s.slice(7, 17));
console.log(s.replace('JavaScript', 'World'));
console.log('a,b,c'.split(','));
console.log('ab'.repeat(3), '5'.padStart(3, '0'));
Expected output
18
HELLO, JAVASCRIPT!
true true
JavaScript
Hello, World!
[ 'a', 'b', 'c' ]
ababab 005
Opens this example in the full playground

Step-by-step explanation#

  1. trim removes the spaces at both ends, leaving 18 characters.
  2. toUpperCase returns a new upper-case string.
  3. slice(7, 17) copies characters 7 to 16 — the word “JavaScript”.
  4. split(',') breaks a string into an array at each comma.
  5. padStart(3, '0') pads to 3 characters: "005" — handy for invoice numbers.

Real-world use case#

Cleaning form input (trim), checking an email domain (endsWith), building slugs for URLs (toLowerCase + replaceAll), and parsing CSV lines (split).

Common mistakes#

Expecting methods to change the original

name.toUpperCase() returns a new string; name itself is unchanged. Assign the result.

replace changes only the first match

'a-b-c'.replace('-', '') gives 'ab-c'. Use replaceAll for every match.

Best practices#

  • Trim user input before validating
  • Use includes/startsWith/endsWith instead of indexOf checks
  • Use template literals to build strings
  • Use toLowerCase() for case-insensitive comparisons

Remember this#

Strings never change — methods hand you a new copy.

slice(start, end): end is NOT included.

split turns text → array; join turns array → text.

Practice exercise#

Your task: Turn the title " Learn JavaScript Fast " into a URL slug: "learn-javascript-fast".

Show solution
JavaScript Runnable
const title = '  Learn JavaScript Fast  ';
const slug = title.trim().toLowerCase().split(' ').join('-');
console.log(slug); // learn-javascript-fast
Opens this example in the full playground

Mini quiz#

Strings quizPredict the output Question 1 of 1

What is printed?

console.log('banana'.slice(1, 4));
Score so far: 0/0

Want more? Practise all JavaScript MCQs · JavaScript interview questions

My notes#

Saved in this browser.

Progress is saved in this browser. Sign in to sync.