Shulou(Shulou.com)06/03 Report--

This article introduces you to the very useful features of ES2019, the content is very detailed, interested friends can refer to, hope to be helpful to you.

String.prototype.trimStart () and String.prototype.trimEnd ()

Sometimes we need to deal with extra spaces when dealing with strings. ES2020 adds two functions: the .trimStart () and trimEnd () methods can help you deal with these chores.

All of them can help you trim or delete spaces in a given string. TrimStart () removes all spaces at the beginning of the string. TrimEnd () removes all spaces at the end of the string. But what if you want to remove the spaces on both sides?

There are two options. The first is to use both ES2019 functions at the same time. The second is to use another string method, trim (). Both ways can give you the results you want.

/ / String.prototype.trimStart () example: / / handling strings without spaces: 'JavaScript'.trimStart () / / Output: / /' JavaScript' / / dealing with strings that begin with spaces: 'JavaScript'.trimStart () / / Output: / /' JavaScript' / / string with spaces on both sides' JavaScript'.trimStart () / / Output: / / 'JavaScript' / / The string 'JavaScript'. trimStart () / / Output: / /' JavaScript' / / String.prototype.trimEnd () example: / / handles strings without spaces: 'JavaScript'.trimEnd () / / Output: / /' JavaScript' / / handles strings that begin with spaces: 'JavaScript'.trimEnd () / / Output: / /' JavaScript' / / left on both sides String with spaces' JavaScript'. TrimEnd () / / Output: / / 'JavaScript' / / string ending with spaces' JavaScript'. TrimEnd () / / Output: / / 'JavaScript'

Function.prototype.toString ()

The toString () method of the function has been around for some time. Its function is to enable you to print the code of the function. ES2019 is different in the way it handles comments and special characters, such as spaces.

In the past, the toString () method removed comments and spaces. So the printed version of the function may look different from the original code. This will not happen again in ES2019. The value it returns will match the original value, including comments and special characters.

Before / / ES2019: function myFunc/* is this really a good name? * / () {/ * Now, what to do? * /} myFunc.toString () / / Output: / / "function myFunc () {}" / / ES2019: function myFunc/* is this really a good name? * / () {/ * Now What to do? * /} myFunc.toString () / / Output: / / "function myFunc/* is this really a good name? * / () {/ / * Now, what to do? * /}"

Array.prototype.flat () and Array.prototype.flatMap ()

Arrays are one of the basic components of JavaScript. They sometimes cause a lot of problems. This is especially true when you have to deal with multidimensional arrays. Even the seemingly simple task of converting a multidimensional array to one dimension can be difficult.

The good news is that two features of ES2019 make this operation easier. The first is the flat () method. When used on a multidimensional array, it is converted to one dimension. By default, flat () flattens the array only one level.

However, the page can specify the level and pass it as a parameter when called. If you are not sure how many levels you need, you can also use Infinity.

/ / create an array: const myArray = ['JavaScript', [' Bytecode'], ['Assembly', [' Bytecode'] / / flattening level 1: let myFlatArray = myArray.flat (1) / / output: console.log (myFlatArray) / / Output: / / ['JavaScript',' clients, 'Assembly'' ['Bytecode'] / / flatten out with the parameter Infinity: let myInfiniteFlatArray = myArray.flat (Infinity) / / output: console.log (myInfiniteFlatArray) / / Output: / / [' JavaScript', 'cards,' Assembly', 'Bytecode']

Array.prototype.flatMap ()

In addition to the flat () method, there is also flatMap (). Think of it as an advanced version of flat (). The difference is that the flatMap () method combines flat () with map (). The callback function can be called when the array is flattened.

This allows each element of the original array to be used during flattening. It is convenient to modify the contents while flattening the array.

/ / create an array: const myArray = ['One word',' Two words', 'Three words'] / / split all strings in the array into words with map (): / / Note: this will create a multidimensional array. Const myMappedWordArray = myArray.map (str = > str.split ('') console.log (myMappedWordArray) / / Output: / / [['One',' word'], ['Two',' words'], ['Three',' words']] / / flatMap () example: const myArray = ['One word',' Two words'] 'Three words'] / / split all strings in the array into words with map (): / / Note: this will create a multidimensional array. Const myFlatWordArray = myArray.flatMap (str = > str.split ('') console.log (myFlatWordArray) / / Output: / / ['One',' word', 'Two',' words', 'Three',' words']

Object.fromEntries ()

When you need to convert an object to an array, you can use entries () to do so. But it is difficult to operate in reverse. ES2019 provides fromEntries () to solve this problem easily.

The effect of this method is very simple. It requires an iterable form of a key-value pair, such as an array or Map, and then converts it to an object.

/ / convert the array to objects: / / create the array: const myArray = [['name',' Joe'], ['age', 33], [' favoriteLanguage', 'JavaScript']] const myObj = Object.fromEntries (myArray) console.log (myObj) / / Output: / / {/ / name:' Joe', / / age: 33 / / favoriteLanguage: 'JavaScript' / /} / / convert Map to object: / / create map: const myMap = new Map ([[' name', 'Spike'], [' species', 'dog'], [' age', 3]]) const myObj = Object.fromEntries (myMap) console.log (myObj) / / Output: / / {/ / name: 'Spike', / / species:' dog' / / age: 3 / /}

Optional catch binding

Used to use try... When catch, you must also use binding. Even if the exception is not used, you must pass it as a parameter. In ES2019, if you don't want to use this exception, you can use a catch block with no parameters.

/ / before ES2019: try {/ / Do something. } catch (e) {/ / ignore the required e parameter / / if you don't want to use it, you should keep it. } / / ES2019: try {/ / Do something. } catch {/ / No parameters need to be added}

Properly formatted JSON.stringify ()

In the past, when you use JSON.stringify () on something that contains specific characters, you get a malformed Unicode string. The code segment from U+D800 to U+DFFF becomes "encoded". To make matters worse, there is no way to change these wrong characters back to their original form.

ES2019 fixed the JSON.stringify () method. You can now classify those problematic code snippets and convert them back to their original representation.

Symbol.prototype.description

Symbols are new data types introduced in ES2015 (ES6). They are typically used to identify object properties. ES2019 adds the description attribute. This property is read-only and cannot be changed. It returns the description of a given symbol.

Keep two things in mind. First of all, the description is not required when creating symbols, but optional. So when you try to access description, you may get anything other than undefined. If you try to access a symbolic description without description, you will get undefined (undefined) information.

The second point is that description is a description of the symbol itself. It is not an identifier of the symbol. This means that you cannot use an existing description (that is, the value of the description attribute) to access existing symbols. It's just to make it easier to identify the symbols you're using.

Description: when you create a new symbol, you can add a description by passing some strings as parameters to the Symbol () object. If left blank, description will be undefined.

/ / create Symbol with description: / / create Symbol and add description: / / Note: description is "My first symbol." Const mySymbol = Symbol ('My first symbol.') / / output the value of the description attribute: console.log (mySymbol.description) / / Output: / /'My first symbol.' / / read the nonexistent Symbol: console.log (Symbol () .description) / / Output: / / undefined / / read the description defined as an empty string: console.log (Symbol ('') .description) / / Output: / /''

Symbol.prototype.toString ()

The toString () method provides another way to read symbolic descriptions. Its disadvantage is that it also includes Symbol () in the returned string. Another difference is that the toString () method never returns a undefined description that doesn't exist.

Another reason for using description is that if you have an unspecified Symbol and use the toString () method, you will still get the Symbol () section. If the description is an empty string, you will also get this information. This makes it almost impossible to distinguish between a description that does not exist and an empty string used as a description.

/ / create the value of the Symbol: const mySymbol = Symbol ('REAMDE.') / / output description attribute with a description: console.log (mySymbol.toString ()) / / Output: / /' Symbol (REAMDE.)'/ / read the nonexistent Symbol: console.log (Symbol (). ToString ()) / Output: / / 'Symbol ()' / / read the description defined as an empty string: console.log ( Symbol (') .toString () / / Output: / / 'Symbol ()' there are several very useful functions in ES2019 that are shared here. I hope the above content can be of some help to you and learn more knowledge. If you think the article is good, you can share it for more people to see.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.