La version 2021 d'ECMAScript devrait être publiée en juin 2021. Voici quelques-unes des fonctionnalités que vous pourriez trouver dans ES2021 ou ES12. La liste est basée sur les propositions ECMAScript et les nouvelles fonctionnalités publiées par le moteur Google Chrome V8.
Toutes les fonctionnalités répertoriées ci-dessous sont prises en charge au moment de l'écriture dans la version Google Chrome Canary (la version expérimentale du navigateur Google Chrome).
Méthode String replaceAll ()
String.prototype.replaceAll () remplace toutes les occurrences d'une chaîne par une valeur de chaîne différente.
Actuellement en JavaScript, les chaînes ont une méthode replace (). Il peut être utilisé pour remplacer une sous-chaîne par une autre chaîne.
const str = "Backbencher sits at the Back";
const newStr = str.replace("Back", "Front");
console.log(newStr); // "Frontbencher sits at the Back"
Si le motif de remplacement d'entrée est une chaîne, la remplacer () méthode ne remplace que la première occurrence. Par conséquent, le code ne remplace pas la deuxième occurrence de « Back ».
Nous ne pouvons effectuer un remplacement complet que si nous fournissons le modèle de remplacement sous forme d' expression régulière .
const str = "Backbencher sits at the Back";
const newStr = str.replace(/Back/g, "Front");
console.log(newStr); // "Frontbencher sits at the Front"
String.prototype.replaceAll () essaie de remplacer toutes les occurrences, même si le modèle d'entrée est une chaîne .
const str = "Backbencher sits at the Back";
const newStr = str.replaceAll("Back", "Front");
console.log(newStr); // "Frontbencher sits at the Front"
Méthodes privées
, . #.
class Person {
//
#setType() {
console.log("I am Private");
}
//
show() {
this.#setType();
}
}
const personObj = new Person();
personObj.show(); // "I am Private";
personObj.setType(); // TypeError: personObj.setType is not a function
setType() , personObj.setType undefined. undefined TypeError.
- (get/set) , # .
class Person {
//
get name() { return "Backbencher" }
set name(value) {}
//
get #age() { return 42 }
set #age(value) {}
}
get set name . , name , .
const obj = new Person();
console.log(obj.name); // "Backbencher"
console.log(obj.age); // undefined
WeakRef
WeakRef (Weak References). . , . , , , .
JavaScript - . , JavaScript . JavaScript , MDN.
:
const callback = () => {
const aBigObj = {
name: "Backbencher"
};
console.log(aBigObj);
};
(async function(){
await new Promise((resolve) => {
setTimeout(() => {
callback();
resolve();
}, 2000);
});
})();
. callback() setTimeout(). await. await - ES6, .
2 «Backbencher». , callback(), aBigObj .
aBigObj .
const callback = () => {
const aBigObj = new WeakRef({
name: "Backbencher"
});
console.log(aBigObj.deref().name);
}
(async function(){
await new Promise((resolve) => {
setTimeout(() => {
callback(); // "Backbencher"
resolve();
}, 2000);
});
await new Promise((resolve) => {
setTimeout(() => {
callback(); // , "Backbencher"
resolve();
}, 5000);
});
})();
WeakRef new WeakRef(). .deref(). setTimeout() name. .
, setTimeout() «Backbencher». . -, . WeakRef , .
FinalizationRegistry - WeakRef. , , .
const registry = new FinalizationRegistry((value) => {
console.log(value);
});
registry FinalizationRegistry. (), FinalizationRegistry, .
(function () {
const obj = {};
registry.register(obj, "Backbencher");
})();
3 obj registry. obj , .register() . , , obj , «Backbencher» .
Google Chrome Canary, 1 , «Backbencher» . Chrome - « ». «».
Promise.any() AggregateError
Promise.any() , . 3 , .
const p1 = new Promise((resolve, reject) => {
setTimeout(() => resolve("A"), Math.floor(Math.random() * 1000));
});
const p2 = new Promise((resolve, reject) => {
setTimeout(() => resolve("B"), Math.floor(Math.random() * 1000));
});
const p3 = new Promise((resolve, reject) => {
setTimeout(() => resolve("C"), Math.floor(Math.random() * 1000));
});
Promise.any() p1, p2 p3.
(async function() {
const result = await Promise.any([p1, p2, p3]);
console.log(result); // "A", "B" "C"
})();
, ? Promise.any() AggregateError. .
const p = new Promise((resolve, reject) => reject());
try {
(async function() {
const result = await Promise.any([p]);
console.log(result);
})();
} catch(error) {
console.log(error.errors);
}
Promise.any() . « » (reject). .
(&&, || ??) .
let x = 1;
let y = 2;
x &&= y;
console.log(x); // 2
3 :
x && (x = y)
-:
if(x) {
x = y
}
x - , y, 2.
&&, || ??.
||
.
let x = 1;
let y = 2;
x ||= y;
console.log(x); // 1
3 :
x || (x = y)
, , x . x 1, , , , . 1 .
??
?? - (Nullish Coalescing operator) JavaScript. , , null undefined , . null undefined, .
let a;
let b = a ?? 5;
console.log(b); // 5
Sur la ligne 2, si la valeur de a est nulle ou indéfinie , le côté droit ?? est évalué et attribué à b .
Considérons maintenant ?? avec = .
let x;
let y = 2;
x ??= y;
console.log(x); // 2
La ligne 2 du code ci-dessus équivaut à l'expression suivante:
x = x ?? (x = y)
Ici, x n'est pas défini . Ainsi, l'expression de droite est évaluée et définit x à 2 .