Introduce
Hello everyone, it’s me again. As with the title, today I will introduce to you things that seem to have been forgotten in javascript. Because few people use it, I rarely use it.
So I write this article hoping to help you know it. Let’s find out together.
1. Tagged template
1 2 | taggingThis`Hello!!, I'm ${name}. Do you know me?` |
How have you ever seen anything like that in javascript? If you’ve ever seen it, you’ve probably worked through react. Here I will analyze for you:
taggingThis
actually a function and theHello!!, I'm ${name}. Do you know me?
is its argument.- The parameter passed will become an array string. Like this
['Hello!!, I'm ', '. Do you know me?']
. What about the${name}
? Yes, it becomes the second argument to the function. For examplename = 'Tagged'
would look like this['Tagged']
.
From there we can write a simple tagged function as follows:
1 2 3 4 5 6 7 | function taggingThis(strings, ...vals) { console.log(strings[0], vals[0], strings[1]); } const name = 'Tagged'; taggingThis`Hello!!, I'm ${name}. Do you know me?` // Output: Hello!!, I'm Tagged. Do you know me? |
That’s it, now you know one more Now come the next one now and always.
2. Comma operator
1 2 3 | let expr = (99, 88, 77); expr // Output: 77 |
How about this, have you seen or used it? If not then I would like to explain a bit here offline. Actually, this is nothing super high at all, it simply returns the final result of the above expression. Applying this Comma operator we can create a simple lambda functions as follows:
1 2 3 4 | const array = []; const lambda = (a, b, arr) => (arr.push(a * b), a * b); lambda(2, 3, array); // Output: 6. And array = [6]; |
If you do not know this Comma operator , the lambda function above can be written as follows:
1 2 3 4 5 6 | const lambda = (a, b, arr) => { const mul = a * b; array.push(mul); return mul; } |
That alone has introduced one more interesting, you see how to be more concise, use it
3. with
Actually I have not seen anyone using this syntax ever @@ It is recommended not to use and javascript also does not allow use in strict mode. See the following example:
1 2 3 4 5 6 7 8 9 | const a = 45 let b = 8 var f = 909 with(f) { let c = 1000; console.log(f, b, a) // Output: 909 8 45 } console.log(c); // Output: undefined |
Functions of with
this scope to expand the var f
. The variables let, const
in with
cannot be used outside. This is the only function so it is not recommended to use it, you just greed to know it
4. in
I use this often. Often used to check if a property exists in an object or not
1 2 3 4 | const obj = { prop1: 1 }; console.log('prop1' in obj); // Output: true console.log('prop2' in obj); // Output: false |
Or is used in the for loop
1 2 3 4 5 6 | const array = [1, 2]; for(i in array) { console.log(i); } // Output: // 1 // 2 |
5. Array constructor
As usual, how do you create an array. Is that so?
1 2 | const array = [1, 2, 3]; |
Also you can use:
1 2 | const array = new Array(1, 2, 3); |
But you should be aware of using new Array()
for the following reason:
const array = new Array(6)
not equal toconst array = [6]
. It is an array of length equal to 6 and has 6 empty items. Equivalent toconst array = [,,,,,,]
.
6. Function constructor
How many ways do you know how to define a function?
1 2 3 4 5 6 7 8 9 10 11 12 | // Với array function const mul = (a, b) => a* b; // Với function function mul(a, b) { return a * b; } // hoặc const mul = function(a, b) { return a * b; } |
Also you can use
1 2 | const mul = new Function('a', 'b', 'return a *b'); |
Here you can pass as many arguments as you like. The last argument will be the body of the function, the remaining arguments will be parameters with the function.
Conclude
This article I have introduced to you some things that have been forgotten in javascript. Actually there are many other things but the article here is quite long so maybe I will split into many parts, please pay attention to the blow. Thank you all ))))