# What's New in JavaScript in 2024

Learn everything that's new in the latest version of JavaScript in 2024!

- URL: https://blog.lsantos.dev/en/whats-new-javascript-2024/
- Published: 2024-07-17
- Updated: 2026-07-16
- Section: typescript
- Tags: ecmascript, javascript
- Language: en
- Author: Lucas Santos

---
The ECMA262 crew got together and we have the new JavaScript spec coming fresh from the oven.

The [127th meeting of committee members happened on June 26, 2024](https://github.com/tc39/ecma262/releases/tag/es2024) and now we have a lot of cool stuff to look at this year! So let's go through all the main new features!

## Synchronous Grouping in Maps and Objects

Pretty similar to [another proposal we talked about here](/array-groupby-stage-3/), now we have a new method in `Map` and `Object` objects: `groupBy`. What it does is allow us to group array items according to a function. When used on a map, it gives us a map back, but we can also use it on an object.

```js
Map.groupBy([1,2,3,4,5,6], (v) => v % 2 === 0 ? 'par' : 'impar')
// Map(2) { 'par' => [2,4,6], 'impar' => [1,3,5] }
```

The same way on an object:

```js
Object.groupBy([1,2,3,4,5,6], (v) => v % 2 === 0 ? 'par' : 'impar')
// { par: [ 1, 3, 5 ], impar: [ 2, 4, 6 ] }
```

## Promise.withResolvers

This is another way we can define a Promise so that we can resolve it outside its scope. The `withResolvers` method returns an object with the promise constructor, as well as the `resolve` and `reject` functions:

```js
const { promise, resolve, reject } = Promise.withResolvers()

```

The promise in question represents some kind of asynchronous work, while the two resolvers are decoupled from the promise itself. This is equivalent to something like:

```js
let resolve, reject
const p = new Promise((res, rej) => {
  resolve = res
  reject = rej
})
```

So we can do something like:

```js
const { promise, resolve, reject } = Promise.withResolvers()
resolve('resolved')
const res = await promise // res = 'resolved'
```

Overall, the use case for this kind of thing is pretty specific. It's more for when you want total control of the promise, or call the resolve methods from outside the promise, for example in streams or events.

[Here](https://exploringjs.com/js/book/ch_promises.html#Promise.withResolvers) we have an interesting explanation of this method with some examples.

## The /v Flag in Regex

The `/v` flag enables unicode set comparison, for example, emojis that have more than one code-point, which couldn't be compared like this before:

```js
/^\p{Emoji}$/u.test('😵‍💫') // false
```

This doesn't happen with this code:

```js
/^\p{Emoji}$/u.test('🤯') // true
```

Because 😵‍💫 has [three code-points](https://apps.timwhitlock.info/unicode/inspect?s=%F0%9F%98%B5%E2%80%8D%F0%9F%92%AB) (since it's the combination of 😵 and 💫) and 🤯 has only [one](https://apps.timwhitlock.info/unicode/inspect?s=%F0%9F%A4%AF). But this can be fixed with this code:

```js
/^\p{RGI_Emoji}$/v.test('😵‍💫') // true
```

[This link](https://exploringjs.com/js/book/ch_regexps.html#regexp-flag-unicode-sets) has an extensive list of options and explanations about what's what in the unicode world.

## ArrayBuffers and SharedArrayBuffers Got Updates

The update is that now both can be resized without needing to be recreated:

```js
const buffer = new ArrayBuffer(2, {maxByteLength: 4})
const UIArr = new Uint8Array(buffer, 2) // starting at position 2
UIArr.length // 0 because we have two empty positions

buffer.resize(4) // we fill the position
UIArr.length // 2
```

## Other Changes

-   String got two new methods: `isWellFormed` and `toWellFormed` for strings that represent UTF-16 references
-   `Atomics.waitAsync` is a new method that allows us to wait asynchronously for a change in memory.
