Need to know if a string ends with something? Simple, use #ES6 "endsWith" method. You don't even need to be a developer and you can guess what's going on. Making a language more human-readable is definitely the way to go πͺ
const workout = 'π ποΈ πͺ';
// Old Way
workout.indexOf('πͺ', workout.length - 'πͺ'.length) !== -1;
// true
// β
ES6 Way
workout.endsWith('πͺ');
// true
Parameters
The endsWith
method accepts 2 parameters:
- Search Value
- Length
1. Search Value
This is a required field. Here is where you pass your search value. This can be a single character or longer. Let's see some examples
Single Character
const name = 'Samantha Ming';
name.endsWith('g'); // true
name.endsWith('n'); // false
Multiple Characters
const name = 'Samantha Ming';
name.endsWith('ing'); // true
name.endsWith('in'); // false
Multiple Words
const name = 'Samantha Ming';
name.endsWith('tha Ming'); // true
name.endsWith('tha M'); // false
2. Length
Here you can specify the length of the string you want it to search. When I first read this, I was quite confused. So let's try to understand what length is doing here.
First, I want to let you know the length of my first name.
console.log('Samantha'.length); // 8
// The last character is 'a'
Now let's utilize the length parameter.
const name = 'Samantha Ming';
name.endsWith('a', 8); // true
βοΈSo when I say 8
, I'm telling endsWith
to grab the first "8" characters of the name
string (from left to right). In this case, the first 8 characters of the string. And that will be the string we're searching with endsWith
.
The above example is similar to doing this:
const name = 'Samantha';
name.endsWith('a'); // true
The reason I said I was confused at first is because I pulled over my knowledge of startsWith
, where the second parameter is the starting index. So I assumed the second parameter with endsWith
would follow the same pattern and it would be the reverse ending index π
That's why people always say, never "assume". Just when you think you know, you actually don't. So be humble and always keep a student mindset π€
If you're interested, here's my code notes to startsWith
:
Case Sensitive
Here's a knowledge that is similar to startsWith
. The endsWith
method is also case sensitive.
const name = 'Samantha Ming';
name.endsWith('G'); // false
name.endsWith('g'); // true
Browser Support
Browser support is wonderful! IF you don't count Internet Explorer π (Sorry folks, but I'm sure there is no major shock there π)
But no problem here's the polyfill so you can safely use endsWith
and still, have it be supported in IE.
By the way, if you're a bit confused about what Polyfill is. Here's a really good video by Tyler McGinnis.
Compiling vs Polyfills with Babel (JavaScript)
Community Input
π¬ What other old ways do you know?
Using Regex
@maxstalker: I could advocate for OLD way with some curried helper functions with some sprinkle of regexp
const startsWith = pattern => string =>
new RegExp(`^${pattern}.*`).test(string);
const endsWith = pattern => string => new RegExp(`.*${pattern}$`).test(string);
const sports = "ππ³β³βΈ";
console.log(startsWith("π")(sports)); // true
console.log(startsWith("βΈ")(sports)); // false
console.log(endsWith("π")(sports)); // false
console.log(endsWith("βΈ")(sports)); // true
@maxstalker: Or slightly shorter version, which you can inline whenever needed:
const sports = "ππ³β³βΈ";
// startsWith
console.log(/^π³.*/.test(sports)); // false
console.log(/^π.*/.test(sports)); // true
// endsWith
console.log(/.*π³$/.test(sports)); // false
console.log(/.*βΈ$/.test(sports)); // true
Using slice
@maxstalker: Another - a bit convoluted and maybe more theoretical - way to do it would be to compare parts of the strings:
const sports = "β³π³πβ½πΎ";
const startPattern = "β³";
const endPattern = "β½πΎ";
//startsWith
console.log(sports.slice(0, startPattern.length) === "wrong!"); // false
console.log(sports.slice(0, startPattern.length) === startPattern); // true
// endsWith
console.log(sports.slice(-endPattern.length) === "wrong!"); // false
console.log(sports.slice(-endPattern.length) === endPattern); // true
Using lastIndexOf
const workout = 'π ποΈ πͺ';
workout.lastIndexOf('πͺ') === workout.length - 'πͺ'.length;
// true
Resources
- MDN Web Docs: endsWith
- Stack Overflow: endsWith in JavaScript
- Check if string starts with or ends with a given string with JavaScript
- String startswith, endswith and contains Implementation
- Two ways to confirm the ending of a String in JavaScript
Thanks for reading β€
Say Hello! Instagram | Twitter | Facebook | Blog | SamanthaMing.com
Top comments (0)