Some of New ES12(ES2021) JavaScript Features.

Changes released in ES2021
The changes released in ES2021 are as follows.

String.prototype.replaceAll()

Perform string replacement for all applicable parts
Existing replace()methods are valid only for the first part to be replaced, so if you wanted …


This content originally appeared on DEV Community and was authored by EswaraPrakash Vaithiyanathan

Changes released in ES2021
The changes released in ES2021 are as follows.

String.prototype.replaceAll()

  • Perform string replacement for all applicable parts

  • Existing replace()methods are valid only for the first part to be replaced, so if you wanted to replace everything you had to use a regular expression

  • With this method, you can prevent replacement omissions due to regular expression mistakes, and it is easy to understand what you want to do at a glance.

let str = "I like programming. I like my job."
str.replaceAll ( "like" , "love" ) 
// Output result: "I love programming. I love my job." 

It is not yet supported by TypeScript by default, but you can use it by changing the setting in tsconfig.json as follows. (Other changes to ES2021 will also be available)

{ "compilerOptions" : { "lib" : [ "ES2021" ],    }, }

Promise.any()

  • When any one of the promises running at the same time is processed resolved, that promise will be returned.

  • If all promises are reject, then AggregateError(the type when one operation needs to return multiple errors) is returned.

  • If you want to know that the process was successful but you don't need to know which one, using any seems to be useful.

  • This is also not yet supported by default in TypeScript. tsconfig.json It can be used by changing the settings as described above .

Promise .any ([ new Promise ( ( resolve, reject ) => 
setTimeout (reject, 100 , '1st' )), 
new Promise (( resolve, reject ) => setTimeout (resolve, 200, '2nd')) ]) 
.then ( value => console .log ( `first completed process: $ {value} `)) 
.catch (err => console .log (err))
// Output result 
// First completed process: 2nd 

WeakRefs
Makes the following feasible:

  • Creating a "weak reference" to an object
    User-defined finalizer execution after objects are garbage collected.

  • A "weak reference" is a reference to an object that does not interfere with the execution of garbage collection.

Normally, when an object is created, it is kept in memory (a "strong reference"), but a "weak reference" is subject to garbage collection collection when memory needs to be freed.

  • If you use these two well, you can prevent memory leaks of data that is no longer referenced, such as deleted objects.

  • However, the functionality of garbage collection is complex (when and how garbage collection occurs depends on the implementation of the JavaScript engine you are using ) and should be carefully considered for proper use. Officially, there is a note that it is better to avoid using it if possible.

  • It wasn't mentioned in the official TypeScript documentation, but according to this issue , it's available in version 4.1 and later.

  • I tried to execute the following code in PlayGround, but it was certainly able to compile with 4.1 or later version.

const obj = new  Map (); 
const cache = new WeakRef (obj); 
// Output result 
// v4.0.5 
// Cannot find name'WeakRef'. 
// v4.1.5 
// None

Logical Assignment Operators
You will be able to write as follows

  • No extra branching is required when entering the initial value, and the implementation is refreshing.

  • Available from version 4.0 on TypeScript

// a || (a = b);
 a || = b;

// a && (a = b);
 a && = b;

// a ?? (a = b);
 a ?? = b;

Numeric separators

  • _Can be inserted between the numbers. (Even if you enter it, it will be recognized as a numerical value)
  • This is possible with all numeric literals, not just decimal numbers. This makes the numbers easier to read
  • Available from version 2.7 in TypeScript.
1_000_000_000            // 1.0101_475_938.38 // 
1.01           million, decimal point can also be used


This content originally appeared on DEV Community and was authored by EswaraPrakash Vaithiyanathan


Print Share Comment Cite Upload Translate Updates
APA

EswaraPrakash Vaithiyanathan | Sciencx (2021-09-20T03:21:15+00:00) Some of New ES12(ES2021) JavaScript Features.. Retrieved from https://www.scien.cx/2021/09/20/some-of-new-es12es2021-javascript-features/

MLA
" » Some of New ES12(ES2021) JavaScript Features.." EswaraPrakash Vaithiyanathan | Sciencx - Monday September 20, 2021, https://www.scien.cx/2021/09/20/some-of-new-es12es2021-javascript-features/
HARVARD
EswaraPrakash Vaithiyanathan | Sciencx Monday September 20, 2021 » Some of New ES12(ES2021) JavaScript Features.., viewed ,<https://www.scien.cx/2021/09/20/some-of-new-es12es2021-javascript-features/>
VANCOUVER
EswaraPrakash Vaithiyanathan | Sciencx - » Some of New ES12(ES2021) JavaScript Features.. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2021/09/20/some-of-new-es12es2021-javascript-features/
CHICAGO
" » Some of New ES12(ES2021) JavaScript Features.." EswaraPrakash Vaithiyanathan | Sciencx - Accessed . https://www.scien.cx/2021/09/20/some-of-new-es12es2021-javascript-features/
IEEE
" » Some of New ES12(ES2021) JavaScript Features.." EswaraPrakash Vaithiyanathan | Sciencx [Online]. Available: https://www.scien.cx/2021/09/20/some-of-new-es12es2021-javascript-features/. [Accessed: ]
rf:citation
» Some of New ES12(ES2021) JavaScript Features. | EswaraPrakash Vaithiyanathan | Sciencx | https://www.scien.cx/2021/09/20/some-of-new-es12es2021-javascript-features/ |

Please log in to upload a file.




There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.