21 Life-Saving JavaScript One-Liners to Boost Up Your Productivity

How can you code less and achieve more? 

There can be multiple ways, but here we are going to cover the unique way that most developers love to use. 

**“JavaScript One-Liner!”**🤘

JavaScript is a wonderful language that lets you do amazing things from developing frontend to backend and handling complex APIs. But beyond that, it also facilitates creating awesome stuff just using a single line of code.🥰

Don’t you think it's always cool to learn new things? 

So get familiar with the 21 JavaScript OneLiners to boost up your JS app development productivity. 

Let's get started! 🚀

1. Checking variables in an array

The easiest way to check variables in an array.

Copy
     const isArray = (arr) => Array.isArray(arr);
    console.log(isArray([1, 2, 3]));
    // true
     

Copy
     console.log(isArray({ name: 'Sara' }));
    // false
    console.log(isArray('Hello World'));
    // false
     

‍

2. Generating the random string

When you want to create a temporary unique id for authentication or anything else, here is how you can make it.

Copy
     const randomString = () => Math.random().toString(36).slice(2);
    console.log(randomString());  // could be anything!!! 

‍

3. Capitalizing a string

You can use the code in the snippet to capitalize input. 

Copy
     const capitalize = (str) => str.charAt(0).toUpperCase() + str.slice(1);
    console.log(capitalize('follow for more')); // Follow For More
     

‍

4. Calculating the number of days between two dates

To calculate the number of days between two dates,  find the absolute between two dates and then divide it by 86400000 (milliseconds in a single day) at the end of the day we will round the result and return the output.

Copy
     const daysDiff = (date, date2) => Math.ceil(Math.abs(date - date2) / 86400000);
    console.log(daysDiff(new Date('2022-05-10'), new Date('2022-11-25'))); // 199 

‍

5. Shuffling an array

Shuffling two arrays using sort and random methods.

Copy
     const shuffleArray = (arr) => arr.sort(() => 0.5 - Math.random());
     
    console.log(shuffleArray([1, 2, 3, 4])); // Result: [ 1, 4, 3, 2 ]
     

‍

6. Reverse a String

To reverse a string you can use the split, reverse and join method. 

Copy
     const reverse = str => str.split('').reverse().join('');
     
    reverse('Hello World');    // Result: 'dlroW olleH'
     

‍

7. Merging an Array

You can merge an array using the “concat” method, the spread [“...”]operator and finally, we can use the Set object to remove any duplicate.

Copy
     // Merge but don't remove the duplicates
    const merge = (a, b) => a.concat(b);
    // Or
    const merge = (a, b) => [...a, ...b];
    // Merge and remove the duplicates
    const merge = [...new Set(a.concat(b))];
    // Or
    const merge = [...new Set([...a, ...b])]; 

8. Truncating the string from the middle

What if you want to truncate the string from the Middle?

The function will take the string as the first parameter, length as the second, and start and end as the third and fourth parameters.

9. Truncate string at the end

It's super easy to truncate strings.

10. Wait for certain time before execution**

In asynchronous programming, if you want to wait for a certain amount of time, here is the way you can do that.

11. Convert string to a URL slug

Convert your String to URL using Regular expression that will remove the special characters and add “-” in between the words.

‍

12. Get the value of Cookie

Nowadays every website uses cookies. You can get the value of a specific cookie that you want to know using the following function.

13. Array Manipulations

Filtering Even Numbers: Creates a new array containing only even numbers from the input array.

Summing Array Elements: Calculates the total sum of all numbers in an array.

14. Finding the Maximum Value:

Determines the largest number within an array.

15. Object Handling

Checking if an Object is Empty: Verifies if an object has any properties.

Merging Objects: Combines two objects into a new object, with properties from the second object overriding those with the same key in the first object.

16. String Manipulation

Reversing a String: Inverts the order of characters in a string.

17. Title Case:

Capitalizes the first letter of each word in a string.

18. Number Operations

Clamping a Number: Limits a number to a specified range.

Random Integer: Generates a random integer between a specified minimum and maximum value.

19. Other Utilities

Debouncing a Function: Delays the execution of a function until a specified time has elapsed since the last call. Note: This is a bit more complex than a simple one-liner.

20. Checking for Anagrams:

Determines if two strings are anagrams of each other (contain the same characters in different orders).

21. Flattening an Array:

Converts a nested array into a single-level array.

There is no doubt JavaScript OneLine improves developers' productivity, but as we know it's not the only way to achieve it.

Let's find out how we can help you to improve your full-stack JavaScript app development efficiency with the revolutionary app development platform.

“DhiWise: A developer-centric platform to build enterprise-grade apps faster”

Whether you are a frontend or backend JavaScript developer DhiWise offers you everything to make your app development a breeze.

Here are some of the functionalities of DhiWise that you must look into.

• DhiWise Figma to Code(React, Next.js, Flutter, Kotlin, and Swift).
• Supports full-stack development technologies like JavaScript, Swift, and Kotlin.
• Smart code editor for error-free, and faster coding.
• Generates clean Code, simplifying code maintenance and improving scalability.
• The platform offers a complete code view and flexibility to make changes at any time during development and once the app is built.
• Ready-to-use app templates and screen libraries.
• Simplified team collaboration, code sharing, and management.

If you still need to be assured about DhiWise's capabilities, just try it , we have ensured that you will always find it super easy and fast to code.

So enjoy coding!

Summing up:

That's all, I hope you enjoyed the article. Now you know about the 21 javaScript OneLiner + functionalities of DhiWise. Don’t forget to check out our other medium articles here .

Have a nice day!

     const truncateStringMiddle = (string, length, start, end) => {
      return `${string.slice(0, start)}...${string.slice(string.length - end)}`;
    };
     

     console.log(
        truncateStringMiddle(
          'A long story goes here but then eventually ends!', // string
          25, // total size needed
          13, // chars to keep from start
          17, // chars to keep from end
        ),
      );     // A long story ... eventually ends!
     

     const truncateString = (string, length) => {
        return string.length < length ? string : `${string.slice(0, length - 3)}...`;
      };
      console.log(truncateString('Truncate the string because, its too long', 30));
       // Truncate the string because...
     

     const wait = async (milliseconds) => new Promise((resolve) => setTimeout(resolve, milliseconds));
    const test = async () => {await wait(1000)
      console.log("waited for 1 second.")          
    }
    test()
    // the output will be generated after 1000 milliseconds.
     

     const slugify = string => string.toLowerCase().replace(/\s+/g, '-').replace(/[^\w-]+/g, '');   // Example
    console.log(slugify('Lifesaving JavaScript OneLiners')); 
    // Result:lifesaving-javascript-oneliners
     

     const cookie = name => `; ${document.cookie}`.split(`; ${name}=`).pop().split(';').shift();
    console.log(cookie('_ga')); // Result: GA1.1.1556710793.1646367473
     

const numbers = [1, 2, 3, 4, 5, 6];
const evenNumbers = numbers.filter(num => num % 2 === 0);
console.log(evenNumbers); // Output: [2, 4, 6]

const numbers = [1, 2, 3, 4, 5];
const sum = numbers.reduce((acc, curr) => acc + curr, 0);
console.log(sum); // Output: 15

const numbers = [10, 5, 8, 20, 3];
const max = Math.max(...numbers);
console.log(max); // Output: 20

const emptyObj = {};
const nonEmptyObj = { name: "Alice" };
const isEmptyObject = obj => Object.keys(obj).length === 0;
console.log(isEmptyObject(emptyObj)); // Output: true
console.log(isEmptyObject(nonEmptyObj)); // Output: false

const obj1 = { name: "Alice", age: 25 };
const obj2 = { city: "New York" };
const mergedObj = { ...obj1, ...obj2 };
console.log(mergedObj); // Output: { name: 'Alice', age: 25, city: 'New York' }

const str = "hello";
const reversedStr = str.split('').reverse().join('');
console.log(reversedStr); // Output: "olleh"

const str = "hello world";
const titleCaseStr = str.split(' ').map(word => word[0].toUpperCase() + word.slice(1)).join(' ');
console.log(titleCaseStr); // Output: "Hello World"

const clamp = (num, min, max) => Math.min(Math.max(num, min), max);
console.log(clamp(10, 5, 15)); // Output: 10
console.log(clamp(2, 5, 15)); // Output: 5

const randomInt = (min, max) => Math.floor(Math.random() * (max - min + 1)) + min;
console.log(randomInt(1, 10)); // Output: A random number between 1 and 10

const debounce = (func, wait) => {
    let timeout;
    return (...args) => {
        clearTimeout(timeout);
        timeout = setTimeout(() => func(...args), wait);
    };
};

const isAnagram = (str1, str2) => str1.split('').sort().join('') === str2.split('').sort().join('');
console.log(isAnagram("listen", "silent")); // Output: true

const nestedArray = [1, [2, 3], 4, [5, [6]]];
const flattenedArray = nestedArray.flat(Infinity);
console.log(flattenedArray); // Output: [1, 2, 3, 4, 5, 6]