Extract a Number from a String with JavaScript

User input from HTML form fields is generally provided to JavaScript as a string. We’ve lived with that fact for decades but sometimes developers need to extract numbers from that string. There are multiple ways to get those numbers but let’s rely on regular expressions to extract those numbers! To employ a regular expression to get a number within a string, we can use \d+: const string = "x12345david"; const [match] = string.match(/(\d+)/); match; // 12345 Regular expressions are capable of really powerful operations within JavaScript; this practice is one of the easier operations. Converting the number using a Number() wrapper will give you the number as a Number type. The... more →
Posted in: JavaScript

JavaScript String replaceAll

Replacing a substring of text within a larger string has always been misleading in JavaScript. I wrote Replace All Occurrences of a String in JavaScript years ago and it’s still one of my most read articles. The confusion lies in that replace only replaces the first occurrence of a substring, not all occurrences. For example: 'yayayayayaya'.replace('ya', 'na'); // nayayayayaya To replace all instances of a substring, you’ve needed to use a regular expression: 'yayayayayaya'.replace(/ya/g, 'na'); // nananananana Using regular expressions is certainly powerful but let’s be honest — oftentimes we simply want to replace all instances of a simple substring that shouldn’t... more →
Posted in: JavaScript

Legacy String Methods for Generating HTML

I’m always really excited to see new methods on JavaScript primitives. These additions are acknowledgement that the language needs to evolve and that we’re doing exciting new things. That being said, I somehow just discovered some legacy String methods that you probably shouldn’t use but have existed forever. Let’s take a look! These legacy string methods take a basic string of text and wrap it in a HTML tag of the same name: "Hello".big() // "<big>Hello</big>" "Hello".blink() // "<blink>Hello</blink>" "Hello".bold() // "<b>Hello</b>" "Hello".italics() // "<i>Hello</i>" "Hello".link("https://davidwalsh.name") // "<a... more →
Posted in: JavaScript