JavaScript Features You Should Know

A daily dose of JavaScript.

Photo by Artem Sapegin on Unsplash

Introduction

JavaScript is, like I’ve said many times before, still evolving into a better language with more and more features you might need.

Functions for handling arrays, date object,s or strings can be found online almost everywhere nowadays, but most of them use libraries such as LoDash which feature those useful functions in an easy-to-understand way.

But having to rely on those libraries can bring some issues with it if your employer or framework doesn’t allow it for one reason or another. And that’s what this list is for. To help you rely on external libraries a tiny bit less.

Console Functions

Everybody knows console.log, and everyone knows the warn and error function all too well. But you probably haven’t seen console.group or console.table yet.

Grouping

Grouping specific logs into a collapsible log can be useful to decrease the amount of useless information in the console. You can even name them to easily find the specific logs for that one component you’re working on.

When every team logs their component info with every render, the console can fill up really quickly. This can be helped a bit by using prefixes and filtering, but grouping them and logging the group can be even cleaner.

Table

Logging a table with data is useful in those instances when you’re working with two-dimensional data or simple arrays. Instead of having a collapsible object, you can log a table with all relevant data.

Now, I agree that most developers will never use this feature. It’s a nice one to have and to understand and it might still be useful in some cases, but I am not sure I will be using this function anytime soon.

ForEach Loop

The forEach loop is a function that iterates over an array. Instead of writing the usual for-loop syntax, you call the function arr.forEach() and pass a function as an argument that should be executed on every item. The function can obviously receive data of the items.

let arr = [1, 2, 3, 4]
arr.forEach((item) => {
    console.log(item)
})
// Will log every item

I am starting to see this function used more and more, and while it isn’t exactly new it sure is one most people such as myself tend to forget.

Some

The array.some() function also receives a function as an argument that should return either true or false, depending on the data it receives.

let arr = [6, 8, 4, 6]
let allGoodGrades = (item) => item > 5
arr.every(allGoodGrades) //-> false
arr.some(allGoodGrades) //-> true

The function checks whether at least one item in an array passes a specific test. There is also the every() function that works the same but checks if all items in an array pass a given test.

Dynamic property names

When creating objects in JavaScript, you might want to have key names be variable. Sometimes it should be gender, otherwise brand or amount of wheels. This can be done.

const dynamic = 'favColor';
let person = {
    name: 'John Doe',
    [dynamic]: 'Red'
}
console.log(person); // { name: "John Doe", favColor: "Red" }

I am not sure when this could be useful exactly, but it is super interesting to see that this option exists.

Conclusion

JavaScript is still growing. The ever-growing ecosystem of endless frameworks and libraries. And while opting for the easy way out is always nice, it isn't always possible. Learning a tiny bit of JavaScript every day will result in better code forever.

Thank you so much for reading and have a great day.