What are the skills of using JavaScript
Editor to share with you what skills to use JavaScript, I believe that most people do not know much about it, so share this article for your reference, I hope you can learn a lot after reading this article, let's go to know it!
JS-Tips console prompt
Code execution time
Use console.time and console.timeEnd to determine how fast (or slow) your code is?
This is an example:
Console.time ('TEST') / / some random code to be tested console.timeEnd (' TEST')
Style Loggin
To get the custom output, we will add% c as below, and then take the actual CSS as the second parameter.
Console.log ('% c AWESOME', 'color: indigo; font-size:100px')
Tables
Console.table comes in handy when you want to record an array of objects.
/ / x _ pencil _ y _ are objects console.table ([x _ recorder _ y _ z])
Stack trace log
If you want to get a stack trace of the function being called, you can use console.trace.
Console.time ('TEST') / / some random code to be tested console.timeEnd (' TEST')
Dynamic key name
A super useful tip!
Const key = 'dynamic' const obj = {dynamic:' hey', [key]: 'howdy'} obj.dynamic / / hey obj [key] / / howdy obj [' dynamic'] / / hey obj.key / / howdy
API- > promise based on callback
To make things cleaner and more efficient, you can turn ourCallbackFn into a function of commitment.
/ / we start with this async function foo () {const x = await something1 () const y = await something2 () ourCallbackFn () {/ /...}} / / the transformation async function foo () {const x = await something1 () const y = await something2 () await promiseCallbackFn () / /?} function promiseCallbackFn () {return new Promise ((resolve, reject) = > {ourCallbackFn (err, data) = > {/ /? If (err) {reject (err)} else {resolve (data)}
Forget string concatenation, use template
It is old-fashioned to use the + operator to concatenate strings to create a meaningful string. In addition, concatenating strings with dynamic values (or expressions) can lead to setbacks and errors.
Let name = 'Charlse'; let place =' India'; let isPrime = bit = > {return (bit ='P'? Prime': 'Nom-Prime');} / / string concatenation using + operator let messageConcat =' Mr.'+ name +'is from'+ place +'. He is a'+'+ isPrime ('P') + 'member.'
Template literals (or Template strings) allows you to embed expressions.
It has a unique syntax, and the string must be surrounded by the enter key. The template string can contain placeholders for dynamic values. These values are marked by a dollar sign and curly braces (${expression}). Here is an example:
Let name = 'Charlse'; let place =' India'; let isPrime = bit = > {return (bit ='P'? 'Prime':' Nom-Prime');} / / using template string let messageTemplateStr = `Mr. ${name} is from ${place}. He is a ${isPrime ('P')} member.`console.log (messageTemplateStr)
IsInteger
There is an easier way to know whether a value is an integer. JavaScript's Number API provides a method called isInteger () to do this. It's very useful. It's best to know.
Let mynum = 123; let mynumStr = "123"; console.log (`${mynum} is a number?`, Number.isInteger (mynum)); console.log (`${mynumStr} is a number?`, Number.isInteger (mynumStr))
Output:
123 is a number? True 123 is a number? False
Value as Number
Have you noticed that event.target.value always returns a value of type string, even if the type of input box is a number? Yes, please see the example below. We have a simple text box with a type of number. This means that it only accepts numbers as input. It has an event handler to handle keying events.
