This are finished proposals from TC39
TC39 is the body that standardizes the JS language. Finished proposals are proposals that have been approved by the body and are now considered part of the language (even if they're not published yet)
This project can be found at https://github.com/raveneyex/beyondes6
Runnable snippets can be found at https://codepen.io/collection/DwqaRQ/
npm i && npm start
- String goodies
- String.prototype.trimStart
- String.prototype.trimEnd
- String.prototype.padStart
- String.prototype.padEnd
- Array goodies
- Array.prototype.includes
- Array.prototype.flat
- Array.prototype.flatMap
- Object goodies
- Object rest operator
- Object spread operator
- Object.values
- Object.entries
- Object.fromEntries
- Object.getOwnPropertyDescriptors
- Asynchronous goodies
- Async/Await
- Asynchronous iteration
- Promise.prototype.finally
- Misc Goodies
- Exponentiation Operator
- Optional catch binding
- Trailing commas
- Function.prototype.toString
A method to remove whitespace at the start of a string. It doesn't alter the original string.
Partially. No Edge and no IE.
let message = " The future is already here ";
console.log(JSON.stringify(message.trimStart())); // "The future is already here ";
A method to remove whitespace at the end of a string. It doesn't alter the original string.
Partially. No Edge and no IE.
let message = " I want to believe ";
console.log(JSON.stringify(message.trimEnd())); // " I want to believe";
A method to insert characters into the beggining of a string until a certain length is achieved.
Yes, on all modern* browsers * = Yes to Edge, no to IE.
// String.prototype.padStart(desiredLength, stringToPad);
let message = "I want to believe";
console.log(message.padStart(21, '🛸')); // 🛸🛸I want to believe
A method to insert characters into the end of a string until a certain length is achieved.
Yes, on all modern* browsers * = Yes to Edge, no to IE.
// String.prototype.padEnd(desiredLength, stringToPad);
let message = "I want to believe";
console.log(message.padEnd(21, '🛸')); // I want to believe🛸🛸
A method to test the presence of an element in an array.
The main difference with all the already-existing methods is its ability to find NaN.
Yes, on all modern* browsers * = Yes to Edge, no to IE.
let isAlphaPresent, isNaNPresent;
const arr = ['alpha', 'beta', 'gamma', NaN];
// Before
isAlphaPresent = (arr.indexOf('alpha') !== -1);
isNaNPresent = (arr.indexOf(NaN) !== -1);
console.log('Before - isAlphaPresent:', isAlphaPresent);
console.log('Before - isNaNPresent:', isNaNPresent);
// Now
isAlphaPresent = arr.includes('alpha');
isNaNPresent = arr.includes(NaN);
console.log('Now - IsAlphaPresent:', isAlphaPresent);
console.log('Now - IsNaNPresent:', isNaNPresent);
A method that creates a new array with all sub-array elements concatenated into it recursively up to the specified depth.
Partially. No Edge and no IE.
// Array.prototype.flat(depth);
const arr = [1, 2, [3, 4, [5, 6, [7, 8]]]];
const flatOne = arr.flat(); // [1, 2, 3, 4, [5, 6, [7, 8]]]
const flatTwo_Chained = arr.flat().flat(); // [1, 2, 3, 4, 5, 6, [7, 8]]
const flatTwo_Parameterized = arr.flat(2); // [1, 2, 3, 4, 5, 6, [7, 8]]
const flatAll = arr.flat(Infinity); // [1, 2, 3, 4, 5, 6, 7, 8]
The flatMap method is identical to calling Array.prototype.map followed by a call to Array.prototype.flat with depth 1.
Partially. No Edge and no IE.
// Array.prototype.flatMap(callback(element, index, originalArray), thisArg);
const arr3 = [1, 2, 3, 4];
const pow = arr3.flatMap((x) => x**2);
const pow2 = arr3.flatMap((x) => [x**2]);
console.log('Pow:', pow);
console.log('Pow2:', pow2);
A way to destructure an object allowing you to collect the remaining properties onto a new object.
Partially. No Edge and no IE.
const {name, occupation, ...rest} = {
name: 'Molly Millions',
occupation: 'Hi-Tech Spy',
enhancements: ['Blade-Nails', 'Nightvision'],
employer: 'None'
};
console.log(name); // Molly Millions
console.log(occupation); // Hi-Tech Spy
console.log(rest); //{enhancements: ['Blade-Nails', 'Nightvision'], employer: "None"}
A way to spread the properties of an object.
Partially. No Edge and no IE.
const meta_info = { date: '12/02/2018', views: 666 };
const info = { title: 'The Necronomicon', ISBN: '666azrl' };
const full_info = {
...meta_info,
...info
};
console.log(full_info); // { date: "12/02/2018", views: 666, title: "The Necronomicon", ISBN: "666azrl" }
A function that returns all the values from an object own properties.
Yes, on all modern* browsers * = Yes to Edge, no to IE.
const cyborg = {
model: '2097',
make: 'Mitsubishi',
enhancements: ['weapons', 'nightvision']
};
const values = Object.values(cyborg);
console.log(values); // ["2097", "Mitsubishi", ['weapons', 'nightvision']]
A function that return an array of the key-value pairs of an object properties in array form.
Yes, on all modern* browsers * = Yes to Edge, no to IE.
const android = {
model: '2097',
make: 'Mitsubishi',
enhancements: ['weapons', 'nightvision']
};
const entries = Object.entries(android);
console.log(entries); // [["model","2097"],["make","Mitsubishi"],["enhancements",["weapons","nightvision"]]]
A function that transforms an array (or map) of key-value pairs into an object.
Partially. No Edge and no IE.
// Using array
const description = [['name', 'Cthulu'], ['race', 'Ancient Ones'], ['location', 'Rlyeh']];
const cthulhu = Object.fromEntries();
console.log(cthulhu); // {name: "Cthulu", race: "Ancient Ones", location: "Rlyeh"}
// Using map
const mapDescriptor = new Map([
['name', 'Azathot'],
['race', 'Outer God']
]);
const azathot = Object.fromEntries(mapDescriptor);
console.log(azathot); // {name: "Azathot", race: "Outer God"}
A function that returns descriptors for all the properties of an object, including getters and setters.
Yes, on all modern* browsers * = Yes to Edge, no to IE.
const azrael = {
name: "Azrael",
race: "Angel",
get mission() {
return this._mission;
},
set mission(value) {
this._mission = value;
}
};
const objDescriptor = Object.getOwnPropertyDescriptors(azrael);
console.log(objDescriptor); // {name: {…}, race: {…}, mission: {…}}
// name: {value: "Azrael", writable: true, enumerable: true, configurable: true}
// race: {value: "Angel", writable: true, enumerable: true, configurable: true}
// mission: {get: ƒ, set: ƒ, enumerable: true, configurable: true}
const basicClone = Object.assign({}, azrael);
const spreadClone = {...azrael};
const fullClone = Object.defineProperties({}, objDescriptor);
console.log(basicClone); // {name: "Azrael", race: "Angel", mission: undefined}
console.log(spreadClone); // {name: "Azrael", race: "Angel", mission: undefined}
console.log(fullClone);
// {name: "Azrael", race: "Angel", get mission: ƒ mission(), set mission: ƒ mission(value)}
Operators for handling asynchronous operations.
asyncis an operator used to denote that a function is performing asynchronous operationawaitis an operator used to denote a variable whose value is the result of an asynchronous request. Can only be used insideasyncfunctions.
Yes, on all modern* browsers * = Yes to Edge, no to IE.
async function fetchPost() {
try {
const promise = fetch('https://jsonplaceholder.typicode.com/todos/1');
const resp = await promise;
const data = await resp.json();
console.log(data);
} catch {
console.log("Oops!");
}
}
fetchPost();
// {userId: 1, id: 1, title: "delectus aut autem", completed: false}
Iterable capabilities for asynchronous data using async generators
Partially. No Edge and no IE.
async function* fetchUsers() {
const promise = fetch('https://jsonplaceholder.typicode.com/users');
const resp = await promise;
const data = await resp.json();
while (data.length) {
yield data.shift();
}
}
async function printUsers() {
for await (const user of fetchUsers()) {
console.log(user);
}
}
printUsers();
A native implementation of the finally method for promises.
Yes, on all modern* browsers * = Yes to Edge, no to IE.
function mockPromise() {
return new Promise((resolve, reject) => {
setTimeout(() => {
reject("Bad Request");
}, 2000);
})
}
async function exampleAsyncFinally() {
try {
const data = await mockPromise();
} catch {
console.log("Oops! something went wrong");
} finally {
console.log("Async operation done");
}
}
exampleAsyncFinally();
function examplePromiseFinally() {
mockPromise()
.then(() => {
console.log("Success");
})
.catch(() => {
console.log("Oops! something went wrong");
})
.finally(() => {
console.log("Operation done");
})
}
examplePromiseFinally();
A simple exponentiation operator **
Yes, on all modern* browsers * = Yes to Edge, no to IE.
let power;
// Before
power = Math.pow(7, 2);
console.log(power); // 49
// Now
power = 7**2;
console.log(power); // 49
Catch blocks no longer demand a parameter to take in.
Partially. No Edge and no IE.
// before
try {
// Some error-prone function
} catch(err) {
// Most linters will complain for the unused variable `err`
}
// now
try {
// Some error-prone function
} catch {
// Clean
}
Parameters list and calls now are able to handle trailing commas.
Yes, on all modern* browsers * = Yes to Edge, no to IE.
let arr = [
'alpha',
'beta',
'gamma', // this is valid now.
];
fooFn(param1, param2, param3,); // Also valid.