Home > Web Front-end > JS Tutorial > body text

Introduction to the usage and function of js operators single vertical bar '|' and '||'

高洛峰
Release: 2016-11-02 15:19:04
Original
1724 people have browsed it

In js development applications, we usually encounter "|" and "||", so what do "|" and "||" mean in operations?

In js integer operation, it is equivalent to removing the decimal point, parseInt. When it is a positive number, it is equivalent to Math.floor(), when it is a negative number, it is equivalent to Math.ceil() Note:

1. Math.ceil() is used to round up.
2. Math.floor() is used to round down.
3. Math.round() Rounding is commonly used in our mathematics.

console.log(0.6|0)//0
console.log(1.1|0)//1
console.log(3.65555|0)//3
console.log(5.99999|0)//5
console.log(-7.777|0)//-7

Operation rules of single vertical bar

After reading the above example, we generally know that single vertical bar can be used for rounding operations, that is, only the positive part is retained, and the decimal part is passed Remove it, but how does "|0" perform operations? Why can "|0" achieve the purpose of rounding? If the horizontal and vertical bar is not 0, what could it be?

With these questions, let’s look at the following example:

console.log(3|4); //7
console.log(4|4);//4
console.log(8|3);/ /11
console.log(5.3|4.1);//5
console.log(9|3455);//3455


The single vertical bar "|" is mentioned here but there is no javascript.

Okay, let me announce the answer here. In fact, the single vertical bar "|" is the result of the addition after converting to binary. For example, let’s take a simple example: After

3|4
is converted to binary, 011|100 is added to get 111=7

4|4
. After being converted to binary, 100|100 is added to get 100=4

8|3
After converting to binary, 1000 |011 is added to get 1011=11

And so on. I will not list them one by one here. The single vertical bar "|" operation is the result of adding after converting to binary!

JS double vertical bar operator

1. JS double vertical bar operator: yes or comparison. For example, null||'1', returns '1'; '2'||'1', returns '2'. That is, in the OR operator, the first one is true, and the subsequent ones do not need to be calculated. So we get '2'.

2. Use the double vertical bar operator "||" in js to return the first valid value

var objOne = undefined || 1 || null || new Date();
var objTwo = new Date( ; If the first operand is false, the second operand will not be considered and false will be returned directly; if the first operand of || is true, the second operand will not be considered and true will be returned directly. This is not the case with the & and | operators. They always have to compare two operands to get the result, so the performance of && and || will be better than & and |.

Function Usage

&& and || can only perform logical operations, while & and | can not only perform "logical operations", but also perform bit operations

Bit operations

& and | are originally bit operators. Therefore, "logical operations" can be performed because JS is a typeless language and each data type can be freely converted. When using & and | to perform "logical operations", in fact, true is converted into 1 and false. Converted to 0, and then performed bitwise operation:

document.write(true & false); //JS, the result is 0

The above sentence, the example is equivalent to the logical operation being converted into the following bit operation, and executed :

document.write(1 & 0); //JS, the result is 0

It is precisely because & and | are bitwise operators that what was mentioned in the first point appears, they always need to be compared It takes two operands to get the result, which results in lower performance than && and ||.

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template