1. Destructure and Rename in One Step
Rename variables during object destructuring to avoid naming conflicts:
const user = { name: 'Rutvik', age: 22 }; const { name: userName, age: userAge } = user; console.log(userName); // Rutvik console.log(userAge); // 22 2. Optional Chaining with Function Calls
Ensure a function exists before calling it:
const user = { getName: () => 'Rutvik', }; console.log(user.getName?.()); // Rutvik console.log(user.getAge?.()); // undefined 3. Use ||= Operator for Default Assignment
Assign a default value only if the variable is null, undefined, or falsey:
let count; count ||= 10; console.log(count); // 10 4. Convert NodeList to Array Using Spread Operator
Quickly convert a NodeList to an array:
const divs = document.querySelectorAll('div'); const divArray = [...divs]; console.log(Array.isArray(divArray)); // true 5. Array/Object Destructuring with Default Values
Avoid undefined by assigning default values during destructuring:
const user = { name: 'Rutvik' }; const { name, age = 22 } = user; console.log(age); // 22 6. Remove Falsy Values from an Array
Filter out falsy values like 0, null, or undefined:
const arr = [0, 'hello', null, 42, false, 'world']; const filtered = arr.filter(Boolean); console.log(filtered); // ["hello", 42, "world"] 7. Sorting Arrays of Objects by Property
Sort objects by a specific property:
const users = [{ name: 'Rohit', age: 38 }, { name: 'Virat', age: 36 }]; users.sort((a, b) => a.age - b.age); console.log(users); // [{ name: 'Virat', age: 36 }, { name: 'Rohit', age: 38 }] 8. Default Parameters with Object Destructuring
Destructure and set default values in function parameters:
function createUser({ name = 'Rutvik', age = 22 } = {}) { console.log(name, age); } createUser(); // Rutvik 22 createUser({ name: 'Rohit' }); // Rohit 22 9. Use Object.assign() for Shallow Copying
Shallow-copy objects without affecting the original:
const original = { a: 1, b: 2 }; const copy = Object.assign({}, original); copy.a = 3; console.log(original.a); // 1 (unchanged) 10. Flatten Nested Arrays with Array.flat(Infinity)
Easily flatten deeply nested arrays:
const nested = [1, [2, [3, [4]]]]; console.log(nested.flat(Infinity)); // [1, 2, 3, 4] 11. Toggle Boolean Value with !
Toggle a boolean value:
let isVisible = false; isVisible = !isVisible; console.log(isVisible); // true 12. Merge Multiple Arrays with concat()
Merge arrays in a single step:
const arr1 = [1, 2]; const arr2 = [3, 4]; const arr3 = [5, 6]; const merged = arr1.concat(arr2, arr3); console.log(merged); // [1, 2, 3, 4, 5, 6] 13. Get the Last Item in an Array Quickly
Retrieve the last item in an array:
const arr = [1, 2, 3, 4]; console.log(arr.at(-1)); // 4 14. Round Numbers with Math.round() and Template Literals
Format rounded numbers easily:
const num = 3.14159; console.log(`${Math.round(num * 100) / 100}`); // 3.14 15. Convert Array-Like Objects to Arrays Using Array.from()
Turn array-like objects into arrays:
function example() { const argsArray = Array.from(arguments); console.log(argsArray); } example(1, 2, 3); // [1, 2, 3] By incorporating these tricks into your coding practices, you can write efficient and expressive JavaScript. Which trick did you find most helpful? Let me know in the comments below!
Happy coding! 🚀
🎯 Follow me on GitHub: RutvikMakvana4
Top comments (1)
it's really helpful questions. you must be prepared this questions before any JS interview