Like any kind of apps, JavaScript apps also have to be written well.
Otherwise, we run into all kinds of issues later on.
In this article, we’ll look at some tips we should follow to write JavaScript code faster and better.
Make the First Letter of a String Uppercase
We can make the first character of a string uppercase by getting the first letter and making that uppercase.
Then we append the rest of the string to the first letter.
For instance, we can write the following:
const name = 'joe'
const capitalized = name[0].toUpperCase() + name.slice(1)
Then we get “Joe” as the value of capitalized .
Remove an Item from an Array
We can remove an item from an array with the index.
Remove a Single Item
For instance, we can use slice as follows given the index of the array.
We write:
const items = ['foo', 'bar', 'baz'];
const i = 1;
const filteredItems = items.slice(0, i).concat(items.slice(i + 1, items.length));
We used slice to get parts of an array excluding the index i .
Then we used concat to join the slice with the rest of the array with the item in index i .
Therefore, we start with i + 1 .
Also, we can call filter without the index of the given item or value itself.
For example, we can write:
const items = ['foo', 'bar', 'baz'];
const valueToRemove = 'bar';
const filteredItems = items.filter(item => item !== valueToRemove);
We can also do the same with the index:
const items = ['foo', 'bar', 'baz'];
const i = 1;
const filteredItems = items.filter((_, index) => index !== i);
Remove Multiple Items
We can remove multiple items by their index by writing:
const items = ['foo', 'bar', 'baz', 'qux'];
const indexes = [1, 2];
const filteredItems = items.filter((_, index) => !indexes.includes(index));
Likewise, we can use the includes method on the value itself.
For example, we can write:
const items = ['foo', 'bar', 'baz', 'qux'];
const valuesToRemove = ['foo', 'qux'];
const filteredItems = items.filter(item => !valuesToRemove.includes(item));
slice and filter don’t mutate the original array, so it’s better than mutating the array.
Checking if a String has a Substring
We can check if a string has a substring with the includes method.
For instance, we can write:
'I like dogs'.includes('dogs')
Then that would return true since 'dogs' is in the string.
includes also takes a 2nd argument with the index to start searching.
For instance, we can write:
'I like dogs'.includes('dogs', 11)
Then includes starts searching at 11, so we get false since it’s not in the substring starting with index 11.
We can also use the indexOf method.
It takes the same arguments except that we have compared the index that’s returned.
For instance, we can write:
'I like dogs'.indexOf('dogs') !== -1
1 is returned if indexOf can’t find the given substring. Otherwise, it’ll return the index of the substring.
We can also pass in the index to start searching:
'I like dogs'.indexOf('dogs', 11) !== -1
Timer
JavaScript provides us with the setTimeout function to delay the execution of JavaScript code:
setTimeout(() => {
// ...
}, 2000)
Then the code runs after 2 seconds.
We can pass arguments into the callback by writing:
const callback = (firstParam, secondParam) => {
// ...
}
setTimeout(callback, 2000, firstParam, secondParam)
Then firstParam and secondParam are passed into the callback function.
setTimeout returns a timer ID.
Then we can call clearTimeout to remove the timer from memory.
For instance, we can write:
const timer = setTimeout(() => {
// ...
}, 2000)
clearTimeout(timer)
We called clearTimeout to remove the timer.
We can set the delay to zero. Then the callback is queued and run without delay after the synchronous code is run.
So we can write:
setTimeout(() => {
//...
}, 0)
The setInterval function is like setTimeout , but the callback is run in an interval.
For instance, we can write:
setInterval(() => {
// ...
}, 2000)
Then the callback runs every 2 seconds.
Like setTimeout , we can stop the callback from running with clearInterval .
For example, we can write:
const id = setInterval(() => {
// ...
}, 2000)
clearInterval(id)
We cleared the timer by using clearInterval with the return ID.
Conclusion
We can capitalize the first letter of a string with the toUpperCase method.
There are many ways to remove an item from an array.
Also, we can use timers to run code at an interval or after a delay.
