It is half past December, and winter is a wonderful season. The cold air forces people to hide in a comfortable and comfortable environment. Winter will give people a quiet and peaceful atmosphere, immersing people in it, as if it was the end of an old stage and the beginning of a new stage. In this way, it is not unreasonable to choose between Christmas and Spring Festival in the West and China. At the coldest time of the year, people gather in a warm environment, telling each other about their achievements in the past year, looking forward to the beautiful wishes in the new year, and reunion of people who care about each other. The cold weather and the warmth of human feelings form a strong contrast. And in the cold weather, it seems to be more conducive to people thinking and exploring the true meaning of knowledge.
What I want to share this time is the logical operators and, or, that is, && 、 || , newcomers will find it boring to see this. What is there to share with this thing? I didn’t know it when I first started learning JS? I have used it countless times without any problem. Experienced students may fall into deep thought. Could it be that there is any secret in this? That's right, although these simple operators are the most basic knowledge, the hidden secrets are very intriguing. Next, I will reveal the wonders behind this short answer operator one by one.
I won’t talk about the basic role. Both of these symbols can be understood by programmers. First of all, I would like to talk about implicit conversions in JS.
As we all know, when JS makes logical judgments, it will automatically convert non-Boolean values into Boolean values and then perform logical operations. When you are beginner JS, you will talk about implicit conversion, except for a few specific false values, the others will be converted into true values. These false values include:
NaN; ""; undefined; null; 0;
With these implicit conversion rules, it forms the core basis of logical operations in JS.
In fact, in JS, it is not completely correct to say that "logical operators" are. Kyle Simpson mentioned in the "You Don't Know JS" series: "It's better to say that it's "logical operators" than to say that it's'Selector operator'. ” Why do the master say this? In fact, most of us are blinded by the appearance of JS, such as the following very simple code:
if( "hello" && 0 ) {
(true);
} else {
(false);
}
If you don't know JS well enough, you might explain this code like this: First of all, in logical judgment, "hello" is a true value, 0 is a false value, a true value and a false value are used for calculation, and the result is false. This may be what most people understand, but in fact, the internal principles are more than that simple.Because what && and || returns is not the true or false of the judging condition , but a primitive value in the condition.It will judge the value in the conditional judgment in sequence. If it is a non-Bolean value, it will be converted into a Boolean value to make a judgment, and then decide which value to return based on the judgment conditions.
For &&: This operator returns theThe first false value,ifAll values are true, then returnThe last value, && is also known as the "guardian operator". For example, the following code:
var a = "hello" && "world"; (a); //world var b = 0 && 1; (b); //0
It can be seen that the logical operator actually returns not the true or false of the condition, but the original value. If there are multiple && operators in the conditional statement, the above principle is also followed and judged from left to right. If a false value is encountered, the false value will be returned. If all values are true, the last value will be returned.
For ||: This operator is opposite to the && operator, which returns theThe first true value,ifAll values are false, then returnThe last value. For example, the following code:
var a = "hello" || 0; (a); //hello var b = 0 || NaN; (b); //NaN
Similarly, || returns a boolean value. If there are multiple ||, the same principle is followed, and scan from left to right.
This is where we come to the core of this article.In JS, conditional judgment statements are all based on implicit conversions, that is, the so-called logical operators are actually scanned from left to right in the conditional judgment statement. If it is a Boolean value, then determine the authenticity of the Boolean value. If it is a non-Boolean value, then implicit conversion is first performed on the value, and then determine the authenticity. If the condition is met, the value is returned. If the condition is not met, the last value is returned, and then the returned value is judged. If it is a Boolean value, it is directly judged. If it is a non-Boolean value, it is implicitly converted to a Boolean value first and then the judgment is made.So we can also call && “Take false operators”, referring to || as “Truth operator”, because the essence of these two operators is to take the first true value or false value in the conditional statement, if it is never found, it returns the last value. Such an algorithm also just meets the requirements of logical judgment. For example, the && operator, if all values are true values, it doesn't matter which value is returned, because all values can be implicitly converted to true, and as long as there is a false value, the judgment condition is not true, so the first false value encountered will be returned. The || operator, if all values are false values, returning any one will be implicitly converted to false, but as long as a true value is encountered, the judgment condition is true, so it returns the first true value encountered. The && and || operators are both "short-circuit".
So we can implement a logical operation function ourselves:
// && is equivalent to:function AND () {
for (var i = 0; i < ; i++) {
if (!arguments[i]) {
return arguments[i];
}
}
return arguments[i-1];
}
// || Equivalent to:function OR () {
for (var i = 0; i < ; i++) {
if(arguments[i]) {
return arguments[i];
}
}
return arguments[i-1];
}
(Note: I also want to explain the ! operator here, but considering the content and length issues, I will not go into in-depth research for the time being, but only briefly explain it. The ! operator actually has the same operating mechanism as && and ||. First, we will judge the parameter value. If it is a Boolean value, it will perform inverse operation. If it is a non-Boolean value, it will perform implicit conversion first and then inverse operation. And the if (something) statement we usually write actually means if (!!something))
Then we can use it like this:
var a = ["hello", undefined, "world"]; ((null, a)); //undefined var b = ["", 0, NaN]; ((null, b)); //NaN
Furthermore, we can infer the conclusion:
a = x || y; //Equivalent to:a = x ? x : y; a = x && y; //Equivalent to:a = x ? y : x;
This is usually what some compression tools do, which convert complex conditional judgment statements into && or || as much as possible, because the code is more streamlined, but the readability is less considerable.
For the first piece of code:
if( "hello" && 0 ) {
(true);
} else {
(false);
}
We will explain it like this now: First of all, this is an operator. The function of the operator is to take the first false value. If all values are true, then the last value is returned. So in this statement, the first value is "hello" , because the value is a non-boolean value, the JS engine will first implicitly convert it to a Boolean value, and the value is not within the range of the false value, so it will be converted to true . Then the JS engine will continue to search, and the second value is 0, which is also not a Boolean value, so the JS engine will first implicitly convert it to a Boolean value, and the value is within the range of the false value, so it will be converted to false , and the search condition of the && operator is satisfied, and the value 0 is returned. The conditional judgment statement accepts the value 0 , which is not a Boolean value, so it will be implicitly converted first, and the value is within the range of false values, so it will be converted to false , and the console will output false .
So when we see && and || in the future, don’t just understand it from the literal meaning. After reading this article, you can proudly and confidently tell others, do you really know how to use logical operators?
Okay, there are so many essences behind these two gadgets. It seems that the depth of knowledge is endless. Winter is really a season that can trigger people's thinking. Christmas is coming soon, I wish you all Merry Christmas in advance here, Merry Christmas!
The above is all the content of this article. I hope that the content of this article will help you study or work. I also hope to support me more!