JavaScript code for common utility functions and tasks for beginners
JavaScript code for common utility functions and tasks for beginners

JavaScript One or Two Liners: Simplifying Code and Enhancing Performance

Meenu Matharu
5 min readSep 28, 2023

--

JavaScript is a versatile, lightweight, and dynamically-typed programming language with several key characteristics:

Key Concepts of JavaScript Explained:

  1. Lightweight and Interpreted Language: JavaScript has a relatively simple syntax and design. It is primarily interpreted, which means that code is executed line by line without the need for a separate compilation step. However, modern JavaScript engines may use Just-In-Time (JIT) compilation for optimization.
  2. First-Class Functions: JavaScript treats functions as first-class citizens, meaning functions can be assigned to variables, passed as arguments to other functions, and returned from functions just like any other data type.
  3. Multi-Paradigm: JavaScript supports various programming styles, including object-oriented, imperative, and declarative (functional programming) styles. This flexibility allows developers to choose the best approach for a given problem.
  4. Prototype-Based: JavaScript uses a prototype-based inheritance model. Objects can inherit properties and methods directly from other objects, which offers a more flexible and dynamic approach to object-oriented programming.
  5. Single-Threaded: JavaScript runs in a single execution thread. This can lead to challenges in handling concurrent operations, but asynchronous programming techniques (e.g., callbacks, promises, async/await) are used to manage non-blocking operations effectively.
  6. Dynamic and Dynamic Typing: JavaScript is a dynamic language, allowing for runtime object construction, dynamic variable typing, and even dynamic script creation using features like eval. Variables are not bound to specific data types, making it possible to change variable types during runtime.
  7. Object Introspection: JavaScript provides ways to inspect and manipulate objects at runtime. Techniques like for...in loops and Object utilities allow developers to examine and modify object properties.
  8. Source-Code Recovery: JavaScript functions store their source text, and this source code can be retrieved programmatically using the toString() method. This feature can be useful in various scenarios, such as code analysis or debugging.
  9. Standardization: JavaScript is standardized by the ECMAScript Language Specification (ECMA-262). Different versions of JavaScript (e.g., ES5, ES6) correspond to different editions of this specification. Additionally, the ECMAScript Internationalization API specification (ECMA-402) covers internationalization-related features.
  10. Web-Specific and Host Environments: JavaScript is not limited to web pages. It is also used in non-browser environments such as Node.js, Apache CouchDB, and Adobe Acrobat. JavaScript’s versatility allows it to be applied in various contexts beyond web development.
  11. JavaScript vs. Java: Java is a statically-typed, compiled language, whereas JavaScript is dynamically typed and interpreted.

We’ll explore some common utility functions and tasks that can be accomplished in just a line or two of JavaScript code.

  1. Array Sum:
const sum = (arr) => arr.reduce((acc, val) => acc + val, 0);

//Example
const numbers = [1, 2, 3, 4, 5];
const total = sum(numbers); // Result: 15

2. Array Unique Values

const uniqueValues = (arr) => [...new Set(arr)];
//Example Usage:
const numbers = [1, 2, 2, 3, 4, 4, 5];
const unique = uniqueValues(numbers); // Result: [1, 2, 3, 4, 5]

3. Object Destructuring: Extract values from an object and assign them to variables.

const { name, age } = person;
//Example Usage:
const person = { name: "Alice", age: 30, country: "USA" };
console.log(name, age); // Output: "Alice" 30

4. Ternary Operator

const result = condition ? "True" : "False";
//Example Usage:
const isLogged = true;
const message = isLogged ? "Welcome back!" : "Please log in.";

5. Reverse a string.

const reversedString = str.split("").reverse().join("");
//Example usage
const text = "JavaScript";
const reversed = reversedString(text);// Result: "tpircSavaJ"

6. Arrow Functions

const add = (a, b) => a + b;
//Example Usage:
const sum = add(3, 5); // Result: 8

7. Conditional Object Property

const value = obj.property || defaultValue;
//Example Usage
const user = { name: "John", age: null };
const age = user.age || 25; // Fallback to 25 if age is null

8. Filter Array of Objects

//Example
const users = [
{ name: "Alice", age: 25 },
{ name: "Bob", age: 17 },
{ name: "Charlie", age: 30 },
];
const filteredUsers = users.filter((user) => user.age >= 18);

9. Map Array of Objects

//Example
const users = [
{ name: "Alice", age: 25 },
{ name: "Bob", age: 30 },
];
const userNames = users.map((user) => user.name);

10. String Interpolation

const name = "Alice";
const greeting = `Hello, ${name}!`;

11. Object Merging.

//Example
const obj1 = { name: "Alice", age: 25 };
const obj2 = { country: "USA" };
const mergedObject = { ...obj1, ...obj2 };

12. Flatten Array of Arrays

const flatArray = nestedArray.flat();

13. Find Object in Array

const users = [
{ id: 1, name: "Alice" },
{ id: 2, name: "Bob" },
{ id: 3, name: "Charlie" },
];
const user = users.find((user) => user.id === 3);

14. Generate Random Number

const randomNumber = Math.floor(Math.random() * (max - min + 1)) + min;
const randomValue = Math.floor(Math.random() * 100); // Generates a random number between 0 and 99

15. Check for Empty Array:

const myArray = [];
const isEmpty = myArray.length === 0;

16. Check for Empty Object:

const myObject = {};
const isEmpty = obj => Object.keys(obj).length === 0;

17. Find the Maximum Value in an Array:

const findMax = arr => Math.max(...arr);
//Example
const numbers = [3, 7, 1, 9, 4];
const max = findMax(numbers); // Result: 9

18. Find the Minimum Value in an Array:

const findMin = arr => Math.min(...arr);
//Example
const numbers = [3, 7, 1, 9, 4];
const min = findMin(numbers); // Result: 1

19. Filter Unique Values in an Array:

const uniqueValues = arr => [...new Set(arr)];
//Example
const numbers = [1, 2, 2, 3, 3, 4, 4];
const unique = uniqueValues(numbers); // Result: [1, 2, 3, 4]

20. Merge Two Objects:

const mergeObjects = (obj1, obj2) => ({ ...obj1, ...obj2 });
//Example Usage:
const obj1 = { name: "Alice" };
const obj2 = { age: 30 };
const merged = mergeObjects(obj1, obj2); // Result: { name: "Alice", age: 30 }

21. Deep Merge Two Objects:

const deepMerge = (target, source) => {
for (const key in source) {
if (source[key] instanceof Object) {
Object.assign(source[key], deepMerge(target[key], source[key]));
}
}
Object.assign(target || {}, source);
return target;
};

//Example
const obj1 = { person: { name: "Alice" } };
const obj2 = { person: { age: 30 } };
const merged = deepMerge(obj1, obj2); // Result: { person: { name: "Alice", age: 30 } }

Conclusion

JavaScript’s concise syntax and powerful features allow developers to streamline their code and enhance performance through one or two-liner utility functions and tasks. These examples demonstrate how leveraging such concise techniques can make your code more readable and efficient, ultimately improving the development process. Whether you’re calculating sums, extracting values, or handling conditions, mastering these one or two-liners can greatly benefit your JavaScript projects.

--

--

Meenu Matharu
Meenu Matharu

Written by Meenu Matharu

🚀 Passionate Frontend Developer | Storyteller on a Coding Journey 🌟 Dive deep into the world of frontend technologies like HTML, CSS, JavaScript and React

No responses yet