DEV Community

Cover image for 25 JavaScript Tricks That Will Make You a Better Developer
Akshay Kurve
Akshay Kurve

Posted on

25 JavaScript Tricks That Will Make You a Better Developer

JavaScript looks simple on the surface, but it has a lot of small features that can make your code cleaner, faster, and easier to maintain.

Over the years, I’ve collected small tricks that improved the way I write JavaScript. None of these are magic — but once you start using them, you’ll notice your code becoming much more expressive.

Here are 25 JavaScript tricks many developers don’t know (or rarely use).


1. Remove duplicates with Set

If you ever needed to remove duplicates from an array, Set is the easiest way.

const numbers = [1, 2, 2, 3, 4, 4, 5]

const unique = [...new Set(numbers)]

console.log(unique)
// [1,2,3,4,5]
Enter fullscreen mode Exit fullscreen mode

2. Convert values to Boolean quickly

Double negation converts anything into a boolean.

const username = "kartik"

const isLoggedIn = !!username

console.log(isLoggedIn) // true
Enter fullscreen mode Exit fullscreen mode

3. Swap variables without a temporary variable

Destructuring makes swapping variables very clean.

let a = 10
let b = 20

[a, b] = [b, a]

console.log(a, b)
Enter fullscreen mode Exit fullscreen mode

4. Short-circuit conditionals

You don’t always need if statements.

isLoggedIn && showDashboard()
Enter fullscreen mode Exit fullscreen mode

If isLoggedIn is true, the function runs.


5. Default values with ||

Provide fallback values easily.

const username = inputName || "Guest"
Enter fullscreen mode Exit fullscreen mode

If inputName is empty or undefined, "Guest" is used.


6. Default values with ??

?? is safer than || because it only checks for null or undefined.

const count = value ?? 0
Enter fullscreen mode Exit fullscreen mode

7. Optional chaining

Avoid long nested checks.

const city = user?.address?.city
Enter fullscreen mode Exit fullscreen mode

Without optional chaining you’d need multiple if checks.


8. Convert string to number quickly

const num = +"42"
Enter fullscreen mode Exit fullscreen mode

It’s shorter than Number("42").


9. Truncate numbers using bitwise operators

const num = 5.9 | 0

console.log(num) // 5
Enter fullscreen mode Exit fullscreen mode

10. Flatten arrays easily

const arr = [1, [2, 3], [4, 5]]

const flat = arr.flat()

console.log(flat)
Enter fullscreen mode Exit fullscreen mode

11. Create a range of numbers

const range = Array.from({ length: 5 }, (_, i) => i + 1)

console.log(range)
// [1,2,3,4,5]
Enter fullscreen mode Exit fullscreen mode

12. Clone objects quickly

const user = { name: "Kartik", age: 24 }

const copy = { ...user }
Enter fullscreen mode Exit fullscreen mode

13. Merge objects

const obj1 = { a: 1 }
const obj2 = { b: 2 }

const merged = { ...obj1, ...obj2 }
Enter fullscreen mode Exit fullscreen mode

14. Convert object to array

const user = { name: "Kartik", age: 24 }

const entries = Object.entries(user)
Enter fullscreen mode Exit fullscreen mode

Output:

[["name","Kartik"],["age",24]]
Enter fullscreen mode Exit fullscreen mode

15. Convert array to object

const arr = [["name", "Kartik"], ["age", 24]]

const obj = Object.fromEntries(arr)
Enter fullscreen mode Exit fullscreen mode

16. Get last item of array

const last = arr.at(-1)
Enter fullscreen mode Exit fullscreen mode

Cleaner than:

arr[arr.length - 1]
Enter fullscreen mode Exit fullscreen mode

17. Remove falsy values from arrays

const arr = [0, "hello", false, 42, "", null]

const clean = arr.filter(Boolean)

console.log(clean)
Enter fullscreen mode Exit fullscreen mode

18. Create objects dynamically

const key = "score"

const player = {
  name: "Alex",
  [key]: 100
}
Enter fullscreen mode Exit fullscreen mode

19. Use console.table() for debugging

Instead of messy logs:

console.table(users)
Enter fullscreen mode Exit fullscreen mode

This displays data in a readable table in the console.


20. Run async functions in parallel

Instead of awaiting one by one:

await Promise.all([
  fetchUsers(),
  fetchPosts(),
  fetchComments()
])
Enter fullscreen mode Exit fullscreen mode

This runs everything at the same time.


21. Debounce functions

Useful for search inputs.

function debounce(fn, delay) {
  let timeout

  return (...args) => {
    clearTimeout(timeout)
    timeout = setTimeout(() => fn(...args), delay)
  }
}
Enter fullscreen mode Exit fullscreen mode

22. Generate random IDs

const id = Math.random().toString(36).slice(2)
Enter fullscreen mode Exit fullscreen mode

Simple way to generate unique strings.


23. Quickly repeat strings

"=".repeat(10)
Enter fullscreen mode Exit fullscreen mode

Output:

==========
Enter fullscreen mode Exit fullscreen mode

24. Check if a value exists in an array

const exists = arr.includes("javascript")
Enter fullscreen mode Exit fullscreen mode

Cleaner than indexOf.


25. Use structuredClone for deep cloning

const clone = structuredClone(obj)
Enter fullscreen mode Exit fullscreen mode

Much better than:

JSON.parse(JSON.stringify(obj))
Enter fullscreen mode Exit fullscreen mode

Final Thoughts

JavaScript is full of small features that many developers overlook.

You don’t need to memorize all of them immediately, but slowly incorporating tricks like these can help you:

  • write cleaner code
  • reduce boilerplate
  • improve readability
  • debug faster

The more you explore the language, the more hidden gems you’ll discover.


💬 What’s your favorite JavaScript trick that most developers don’t know?

Drop it in the comments — I’m always looking to learn new ones.

Top comments (0)