5 🔥 JavaScript Tricks that you should know

JavaScript is a powerful and versatile programming language that is essential for any developer to know. It is used in a wide range of applications, from simple websites to complex web applications. There are many tricks and techniques that can help you write efficient and effective code in JavaScript. In this post, we will look at some of the most useful JavaScript tricks that every developer should know.

1) Using the ternary operator for concise conditional statements

The ternary operator is a concise way to write conditional statements in JavaScript. It is made up of a question mark (?) and a colon (:). It works like this:

let result = condition ? value1 : value2;

This code says that if the condition is true, the value of result will be value1. If the condition is false, the value of result will be value2.

Here is an example of how to use the ternary operator:

let age = 25;
let canDrink = (age >= 21) ? 'Yes' : 'No';
console.log(canDrink); // Output: Yes

2) Using the spread operator to merge arrays and objects

The spread operator (...) allows you to easily merge arrays or objects in JavaScript. It works like this:

let mergedArray = [...array1, ...array2];
let mergedObject = {...object1, ...object2};

Here is an example of how to use the spread operator to merge arrays:

let array1 = [1, 2, 3];
let array2 = [4, 5, 6];
let mergedArray = [...array1, ...array2];
console.log(mergedArray); // Output: [1, 2, 3, 4, 5, 6]

3) Using the for-of loop to iterate over arrays and strings

The for-of loop is a concise and easy-to-use loop that allows you to iterate over arrays and strings in JavaScript. It works like this:

for (let item of array) {
  // code to be executed
}

Here is an example of how to use the for-of loop to iterate over an array:

let array = [1, 2, 3];
for (let item of array) {
  console.log(item); // Output: 1, 2, 3
}

4) Using arrow functions to write concise and expressive code

Arrow functions are a concise and expressive way to write functions in Javascript. They have a shorter syntax than traditional functions and do not have their own this value. They work like this:

let functionName = (parameters) => {
  // code to be executed
};

Here is an example of how to use arrow functions:

let add = (x, y) => {
  return x + y;
};
console.log(add(1, 2)); // Output: 3

5) Using the map() method to transform arrays

The map() method allows you to transform an array by applying a function to each element of the array. It returns a new array with the transformed elements. It works like this:

let transformedArray = array.map(function

Comments

[Bruno]

You could have given an explanation of what you mean with “more concise” in each of the points you have presented, as it might be unclear for newbie developers, in particular.

As for the this keyword, you could have given at least a short explanation of what it means and how it is used in regular functions. Also, there are cases where you can not or may not be able to use arrow function syntax:

• when you want to bind a specific value to the this keyword. Ex: in constructor functions.
• when adding a prototype method, as arrow functions do not have it. If you want to use the new operator, you can’t, because arrow functions do not have the prototype property.
• when using the arguments object.
• since arrow functions can not be generator functions, you can not use yield.

That being said, arrow functions are not always a solution, even though they of course are a great approach when you want to write “cleaner” function syntax. Saying they allow you to write “more concise and expressive” code can be misleading, as, like I said before, there are particular cases when it might not be a solution after all.

[DanFrmSpace]

I appreciate the feedback, thank you for commenting