Post thumbnail
FULL STACK DEVELOPMENT

Exploring the New Array and Object Methods in JavaScript

By Thirupathi

JavaScript continues to evolve, bringing new features and methods that make it easier to work with data structures like arrays and objects.

In 2024, several new array and object methods in JavaScript that have been introduced that enhance the language’s functionality and usability.

In this blog, we’ll dive into these new methods and explore how they can be used to write more efficient and readable code.

Table of contents


  1. List of New Array and Object Methods in JavaScript
    • Array.prototype.groupBy
    • Array.prototype.groupByToMap
    • Array.prototype.toReversed
    • Array.prototype.toSorted
    • Array.prototype.toSpliced
    • Array.prototype.with
    • Object.groupBy
    • Object.groupByToMap
    • Object.hasOwn
  2. Conclusion

List of New Array and Object Methods in JavaScript

Let us now see some of the New Array methods in JavaScript:

1. Array.prototype.groupBy

The groupBy method groups the elements of an array based on a specified criterion. This is particularly useful for categorizing data.

const array = [6.1, 4.2, 6.3];
const grouped = array.groupBy(Math.floor);
console.log(grouped); // { '4': [4.2], '6': [6.1, 6.3] }

2. Array.prototype.groupByToMap

Similar to groupBy, but returns a Map instead of an object. This can be useful when you need the benefits of a Map, such as maintaining the insertion order of keys.

const array = ['one', 'two', 'three'];
const groupedMap = array.groupByToMap(word => word.length);
console.log(groupedMap); // Map { 3 => ['one', 'two'], 5 => ['three'] }

3. Array.prototype.toReversed

This method returns a new array with the elements reversed, without modifying the original array. It’s a non-destructive alternative to Array.prototype.reverse.

const array = [1, 2, 3];
const reversed = array.toReversed();
console.log(reversed); // [3, 2, 1]
console.log(array); // [1, 2, 3]

4. Array.prototype.toSorted

Returns a new array with the elements sorted, without modifying the original array. This is a non-destructive alternative to Array.prototype.sort.

const array = [3, 1, 2];
const sorted = array.toSorted();
console.log(sorted); // [1, 2, 3]
console.log(array); // [3, 1, 2]

5. Array.prototype.toSpliced

Returns a new array with some elements removed or replaced, without modifying the original array. This is a non-destructive alternative to Array.prototype.splice.

const array = [1, 2, 3, 4];
const spliced = array.toSpliced(1, 2, 5, 6);
console.log(spliced); // [1, 5, 6, 4]
console.log(array); // [1, 2, 3, 4]

6. Array.prototype.with

Returns a new array with a specific element replaced at a given index, without modifying the original array.

const array = [1, 2, 3];
const newArray = array.with(1, 4);
console.log(newArray); // [1, 4, 3]
console.log(array); // [1, 2, 3]

These new array methods help developers reduce a lot of time while working on large set programs. Similarly, here is a list of New Object Methods:

1. Object.groupBy

This method groups the values of an object based on a specified criterion and returns a new object.

const obj = { a: 1, b: 2, c: 3 };
const grouped = Object.groupBy(obj, x => x % 2);
console.log(grouped); // { '0': [2], '1': [1, 3] }

2. Object.groupByToMap

Similar to Object.groupBy, but returns a Map instead of an object. This method combines the flexibility of grouping with the advantages of a Map.

const obj = { a: 'one', b: 'two', c: 'three' };
const groupedMap = Object.groupByToMap(obj, word => word.length);
console.log(groupedMap); // Map { 3 => ['one', 'two'], 5 => ['three'] }

3. Object.hasOwn

A more concise and intuitive method to check if an object has a specific property, similar to Object.prototype.hasOwnProperty.

const obj = { a: 1 };
console.log(Object.hasOwn(obj, 'a')); // true
console.log(Object.hasOwn(obj, 'b')); // false

That’s it for new object methods. These new arrays and object methods in JavaScript allow you to perform complex tasks much more easily and ease your workflow!

In case, you want to learn more about Javascript and other frameworks, consider enrolling for GUVI’s Certified Java Full-stack Developer Course that teaches you everything from scratch and make sure you master it!

Conclusion

In conclusion, the new array and object methods introduced in 2024 significantly enhance JavaScript’s functionality, allowing developers to write more efficient, readable, and non-destructive code.

These methods, such as groupBy, toReversed, and Object.hasOwn, simplify common operations like grouping, sorting, and checking properties, making it easier to manage and manipulate data.

By incorporating these tools into your development practices, you can streamline your code and improve overall productivity.

MDN

Career transition

Did you enjoy this article?

Schedule 1:1 free counselling

Similar Articles

Loading...
Share logo Copy link
Free Webinar
Free Webinar Icon
Free Webinar
Get the latest notifications! 🔔
close
Table of contents Table of contents
Table of contents Articles
Close button

  1. List of New Array and Object Methods in JavaScript
    • Array.prototype.groupBy
    • Array.prototype.groupByToMap
    • Array.prototype.toReversed
    • Array.prototype.toSorted
    • Array.prototype.toSpliced
    • Array.prototype.with
    • Object.groupBy
    • Object.groupByToMap
    • Object.hasOwn
  2. Conclusion