JavaScript Tutorial
JavaScript String Methods
slice, trim, toUpperCase, includes, and replace work on a copy. Strings themselves do not mutate.
Methods return a copy
A string method is a function you call on a string with a dot: text.trim(). It does not change the original. It returns a new string. If you want the name to hold the result, assign it:text = text.trim().
That rule is the whole chapter. Forget it and you will call title.toUpperCase(), look attitle, and wonder why nothing happened. The uppercase version was computed and then thrown away because you did not store it.
slice
slice(start, end) copies from start up to but not including end. Omit end and it copies through the last character. Negative indexes count from the end:slice(-3) is the last three characters.
Example
const city = "Lisbon";
console.log(city.slice(0, 3));
console.log(city.slice(3));
console.log(city.slice(-3));
console.log(city);
"Lis", "bon", "bon". The last line still prints "Lisbon"— slice did not edit city.
Run these in /javascript/try with Try it in JavaScript. That is the JavaScript editor.
trim
trim() removes whitespace from both ends: spaces, tabs, newlines. It does not remove spaces in the middle. Form fields often include a trailing space; trim before you compare or store.
Example
const raw = " Lisbon ";
console.log(raw.length);
console.log(raw.trim());
console.log(raw.trim().length);
console.log(raw);
const answer = " Yes ";
console.log(answer.trim().toLowerCase() === "yes");
After trim, length drops from 10 to 6. raw is still padded. The last two lines show a typical input check: trim, lower-case, then compare.
toUpperCase and toLowerCase
toUpperCase() returns an uppercase copy. toLowerCase() returns a lowercase copy. Use them when case should not matter: a command, an email, a yes/no answer. Display names can keep the original casing; comparisons usually should not.
There is no in-place version. name.toUpperCase() without assignment does not changename.
includes
includes(piece) is true when piece appears anywhere in the string. It is case-sensitive: "Lisbon".includes("lis") is false. Combine with toLowerCase for a case-insensitive search.
Example
const line = "The train to Lisbon leaves at 9.";
console.log(line.includes("Lisbon"));
console.log(line.includes("Madrid"));
console.log(line.includes("lisbon"));
console.log(line.toLowerCase().includes("lisbon"));
True, false, false, true. includes replaced the older patterntext.indexOf(piece) !== -1. indexOf still exists when you need the position, not just yes or no.
replace
replace(old, next) replaces the first match of old with nextand returns the new string. The original does not change. A plain string search does not replace every match. To replace all, use replaceAll(old, next), or assign in a loop, or use a regular expression with the g flag — this tutorial stays with strings.
Example
const line = "cat and cat";
console.log(line.replace("cat", "dog"));
console.log(line.replaceAll("cat", "dog"));
console.log(line);
let title = " draft chapter ";
title = title.trim().replace("draft", "final").toUpperCase();
console.log(title);
First call: "dog and cat". replaceAll: "dog and dog".line is still "cat and cat". The last block chains methods on the copy, then stores the result in title: "FINAL CHAPTER".
Chain on the copy
Because each method returns a string, you can chain them:text.trim().toLowerCase().includes("ok"). Read left to right. Each step feeds the next. Stop chaining when a step is not a string — includes returns a boolean, so nothing with a string method can follow it.
const upper = city.toUpperCase; without () copies the function, it does not call it. You want city.toUpperCase().
Next: template strings — backticks, embedded values, and multi-line text without +.