Locked learning resources

Join us and get access to thousands of tutorials and a community of expert JavaScript developers.

Unlock This Lesson

Locked learning resources

This lesson is for members only. Join us and get access to thousands of tutorials and a community of expert JavaScript developers.

Unlock This Lesson

Replacing Every Match With replaceAll()

Replacing Every Match With replaceAll()

In this lesson, you ported the helper’s first branch slug, which lowercases PAY-2291’s title and puts a hyphen in place of every space, since git won’t take a branch name with spaces. In Python, title.lower().replace(" ", "-") prints refund-emails-show-the-wrong-currency:-eur-shown-as-usd.

  • The natural port, title.toLowerCase().replace(" ", "-"), runs without an error but prints refund-emails show the wrong currency: eur shown as usd: one hyphen, and the other eight spaces untouched.
  • Given text to find, JavaScript’s replace() searches from the start, swaps the first match, and stops. Python’s replace() changes every match unless you give it a count, and title.lower().replace(" ", "-", count=1) prints the port’s line. That’s where the likeness stops: JavaScript’s replace() takes no count, and with plain text it changes one match.
  • replaceAll() is the method that does what Python’s replace() does, minus the count: it always changes every match. Swap the method’s name and the port prints Python’s slug, character for character.
  • Git doesn’t allow a colon in a branch name either, so the helper’s other replace removes it, and that step joins the chain before the spaces turn into hyphens. On PAY-2291’s title, replace(":", "") would give the same slug, but only because the title has one colon. Text with two, like the full header, keeps its second, so the chain uses replaceAll(":", "").
  • Use replaceAll() for every match and replace() when you mean only the first. With a regular expression instead of plain text, replace() can do more, but regular expressions are a later topic.

Here’s the slug with both steps in place:

Language: JavaScript
const title =
  "Refund emails show the wrong currency: EUR shown as USD";

const slug = title.toLowerCase()
  .replaceAll(":", "").replaceAll(" ", "-");
console.log(slug);

Locked learning resources

Join us and get access to thousands of tutorials and a community of expert JavaScript developers.

Unlock This Lesson

Already a member? Sign-In

Locked learning resources

The full lesson is for members only. Join us and get access to thousands of tutorials and a community of expert JavaScript developers.

Unlock This Lesson

Already a member? Sign-In

00:02 In this lesson, you’ll port the helper’s first branch slug, the line that turns PAY-2291’s title into part of a branch name. With toLowerCase() and method chaining, the port can already lowercase the title.

00:17 The Python helper turns that title into a slug in one line. It lowercases the title, then replace() swaps each space for a hyphen. That matters, because git won’t take a branch name with spaces in it.

00:32 Python prints the slug with a hyphen in every gap between the words, and the colon still in it.

00:39 In the JavaScript port, the title carries over with const in front, split over two lines so it fits, with no parentheses, because JavaScript reads on to the semicolon.

00:50 In the slug line, lower() becomes toLowerCase(). replace() keeps its name and its two arguments: the space to find and the hyphen to put in its place.

01:01 And print() turns into console.log(), as usual. Python’s slug has a hyphen in every gap. What will the port print? Your turn: pause the video and predict.

01:18 JavaScript answers with one hyphen, after the first word. The other eight spaces are still there, and the port ran without an error or a warning.

01:30 JavaScript’s replace() searches the text from the start for the first space. It swaps that one for a hyphen. Then it stops, so the other eight spaces are never touched.

01:43 That’s how replace() works whenever you give it plain text to find: it changes the first match and no more.

01:51 Python’s replace() changes every match, unless you give it a count. With a count of one, Python prints the same line the port did. That’s where the likeness stops: in Python, one match is an option you ask for.

02:06 JavaScript’s replace() takes no count, and with plain text, one match is all it changes. Given a regular expression instead of plain text, it can do more, but regular expressions are a later topic.

02:20 For every match, JavaScript has a second method, replaceAll(). You may have met it removing the separators from a number typed with commas. The fix swaps the method’s name in the slug line, and the two arguments stay as they were.

02:36 Run the port again, and JavaScript prints a hyphen in every gap, the same slug as Python’s, character for character.

02:45 So replaceAll() is the method that does what Python’s replace() does, minus the count: it always changes every match. And replace() is the one for when you mean only the first match.

02:59 The slug still has the title’s colon, and git won’t take a colon in a branch name either. So the helper’s other replace drops it, swapping each colon for an empty string, before the spaces turn into hyphens.

03:12 In the port, that step joins the chain as replaceAll(), and the line wraps to fit. Run both, and they print the same slug, with no colon. A quick check: would replace() have been enough here?

03:27 On this title, yes. It has one colon, so replace() gives the same text, and a test on PAY-2291 would pass either way. But with replace(), text with two colons, like the full header, keeps its second one.

03:43 The next ticket’s title could hold two, so replaceAll() stays: it says what you mean, every colon.

03:52 To change every match, as Python’s replace() does, reach for replaceAll().

03:58 Keep replace() for when you mean only the first match, and no more.

04:03 Next up is Writing the Methods JavaScript Doesn’t Have, a text lesson. There, you’ll port the line that tidies the title’s ends, which drops the full stop from PAY-2304’s title, and capitalize a title that was typed starting in lowercase.

Become a Member to join the conversation.