16 Essential JavaScript Shortcuts to Write Cleaner, Faster Code

JavaScript is a powerful, flexible language with many features and syntactic sugar. Below are 16 commonly used JavaScript shorthand techniques that help write cleaner, more elegant code and boost development efficiency.

1. Ternary Operator for Conditional Simplification

// Traditional way
let result;
if (someCondition) {
    result = 'yes';
} else {
    result = 'no';
}

// Shorthand
const result = someCondition ? 'yes' : 'no';

2. Nullish Coalescing Operator

// Traditional way
const name = user.name !== null && user.name !== undefined ? user.name : 'default';

// Shorthand
const name = user.name ?? 'default';

3. Optional Chaining Operator

// Traditional way
const street = user && user.address && user.address.street;

// Shorthand
const street = user?.address?.street;

4. Array Deduplication

// Traditional way
function unique(arr) {
    return arr.filter((item, index) => arr.indexOf(item) === index);
}

// Shorthand
const unique = arr => [...new Set(arr)];

5. Quick Integer Truncation

// Traditional way
const floor = Math.floor(4.9);

// Shorthand
const floor = ~~4.9;

6. Object Merging

// Traditional way
const merged = Object.assign({}, obj1, obj2);

// Shorthand
const merged = {...obj1, ...obj2};

7. Short‑Circuit Evaluation

// Traditional way
if (condition) {
    doSomething();
}

// Shorthand
condition && doSomething();

8. Default Parameter Values

// Traditional way
function greet(name) {
    name = name || 'Guest';
    console.log(`Hello ${name}`);
}

// Shorthand
const greet = (name = 'Guest') => console.log(`Hello ${name}`);

9. Destructuring Assignment

10. String to Number Conversion

11. Multiple Condition Checks

12. Fast Exponentiation

13. Object Property Shorthand

14. Array Mapping

15. Swapping Variable Values

16. Dynamic Object Property Names

// Traditional way
const obj = {};
obj[dynamic + 'name'] = value;

// Shorthand
const obj = {
    [`${dynamic}name`]: value
};

Feel free to add more shortcuts.