
JavaScript is the most used language worldwide. It can make almost everything: Websites, Servers, Android/IOS applications, Desktop applications, IoT, Smart Watch OS, and much more.
It’s simple to get started with, but can get a little trickier, as it’s not like other general-purpose programming languages.
Today, we’ll see 7 JavaScript tips and tricks that will help you to write a better, more efficient, and fast JavaScript. So, let’s get started.
#7 Destructuring
const person = {
name: "Pavan",
age: 21,
//nested
eduction: {
college: "MIT ADT SOE"
}
}
// normal way to extract
const name = person.name;
const age = person.age;
// with destructuring
const { name, age } = person;
console.log(name, age); //Pavan 21
//destructuring nested property
const { education: {college} } = person;
console.log(college) //MIT ADT SOE
You can use curly braces before the assignment operator and extract values using the key from the object.
To extract the nested properties, you can first define the property and then the nested key to get the value.
//destructuring nested property
const { education: {college} } = person;
console.log(college) //MIT ADT SOE
Also check out,
How to handle APIs in React
#6 Short-Circuiting Conditionals
if (isValid) {
login();
}
//using AND - &&
isValid && login();
Instead of doing the traditional if-else, you can just the && operator, which returns a false value if has, and if it’s true continues with the login function.
#5 Truncating Arrays
let array = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
//destructive approach
array.length = 4;
console.log(array) //[ 0, 1, 2, 3 ]
We can simply truncate the
array to any desired size by assigning the value of array.length
. This is a destructive approach to truncating an array.
For faster runtime, you can use a JavaScript default method slice
method.
//faster runtime
array = array.slice(0, 4);
console.log(array) //[ 0, 1, 2, 3 ]
#4 Getting the Last Item/s of an Array
let array = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
console.log(array.slice(-1)) // [ 9 ]
To get the last element from an array, you can again use .slice
method, but here you need to pass just -1
, which will return you the last item in an array.
Now, if you want to get more items from the last, you can add the number of items you want in negative.
let array = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
console.log(array.slice(-2)) // [ 8, 9 ]
#3 Format JSON in console.logs
const person = {
name: "Pavan",
age: 21
}
console.log(JSON.stringify(person))
// {"name":"Pavan","age":21}
You can use JSON.stringify
, which is provided by JavaScript by default to log JSON formats. But, it is not much readable if it’s huge data.
To make it prettier using some parameters to stringify
.
console.log(JSON.stringify(person, null, "\t"))
// {
// "name": "Pavan",
// "age": 21
// }
#2 Exponential Operator for Powers
To get the powers of any numbers you can use the .pow
JavaScript default Math function.
console.log(Math.pow(2, 3))
//8
But ES7 launched a new shorthand method to get power, you can use double asterisks **
.
console.log(2 ** 3)
//8
#1 Filtering Unique values from an Array
const array = [1, 1, 2, 3, 4, 6, 7, 2];
const uniqueArray = [...new Set(array)];
console.log(uniqueArray)
// [ 1, 2, 3, 4, 6, 7 ]
To filter out unique values by using …new Set()
, a class-based method. Which takes the array and returns a new array with unique items.
These were the few JavaScript tips and tricks that might help you to write better, fast, and more efficient code. I hope these were helpful, if they were, make sure to let us know in the comments.
- Mastering Data Structures & Algorithms: Your Ultimate Roadmap to Success - July 3, 2023
- A Beginner’s Guide to Machine Learning: Key Concepts and Applications - June 28, 2023
- Web Development: A Beginner’s Guide to Getting Started - June 24, 2023
0 Comments