JavaScript operator - other operators, operator sequence

. 1, void operator
action void operator is performing an expression, and then returns no value, or returns undefined.

void 0 // undefined
void(0) // undefined

The above is a two way void operator, are correct. After it suggested a form that always use parentheses. Because of the high priority void operator, if you do not use parentheses, easily lead to erroneous results. For example, void 4 + 7 is virtually identical to (void 4) + 7.
The following is an example of a void operator.

var x = 3;void (x = 5) //undefined
x // 5

The main purpose of this operator is a browser bookmark tool (bookmarklet), and insert the code prevents the page jump hyperlinks.
Consider the following code.

<script>function f() {  console.log('Hello World');
}</script><a href="http://example.com" onclick="f();
 return false;">点击</a>

The above code, click on the link, it will first execute onclick code, because the onclick return false, so the browser does not jump to example.com.
void operator can replace the above wording.

<a href="javascript: void(f())">文字</a>

Here is a more practical example, a user click on a link submit the form, but does not produce the page jump.

<a href="javascript: void(document.form.submit())">提交</a>

2, the comma operator
comma operator for two expression evaluation, and after a return value of the expression.

'a', 'b' // "b"
var x = 0;var y = (x++, 10);
x // 1
y // 10

The above code, a value of the expression returns after the comma operator.
One use of the comma operator is, before returning a value, some auxiliary operations.

var value = (console.log('Hi!'), true);
// Hi!
value // true

In the above code, the first operation performed before the comma, and then returns the value after the comma.

3, the operation sequence

3.1, priority
priority (Operator Precedence) JavaScript various operators are not the same. A higher priority to the operator are performed after a lower priority operator.

4 + 5 * 6 // 34

The above code, the multiplication operator (*) is higher than the priority of the addition operator (+), the multiplication is performed first, and then performs addition, this is equivalent to the following.

4 + (5 * 6) // 34

If multiple operators to write mixed together, often lead to confusing code.

var x = 1;var arr = [];
var y = arr.length <= 0 || arr[0] === undefined ? x : arr[0];

The above code, the value of the variable y is very hard to see, because the expression involving five operators, in the end who is the highest priority, it is not easy to remember.

According to the language specification, priority of the five operators descending order of:? Less than or equal to (<=), strictly equal (===) or (||), three yuan (:), equals sign ( =). Thus the above expression, the actual operational sequence is as follows.

var y = ((arr.length <= 0) || (arr[0] === undefined)) ? x : arr[0];

Remember that the priority of all operators, it is very difficult, and it is not necessary.

3.2 parentheses role
parentheses (()) can be used to increase the priority of operations, because it is the highest priority, that expression would be the first operator in parentheses.

(4 + 5) * 6 // 54

Code above, the use of parentheses, the addition will be performed prior to multiplication.

Priority operators is very complicated, and are mandatory, it is recommended to always use parentheses to ensure clear and readable sequence of operations, it is essential to maintain and debug code.

By the way, the parentheses is not an operator, but a grammatical structure. It There are two ways: one is to put the expression in parentheses, upgrade priority operations; the other is behind the function of the role is to call the function.

Note that, because the operator is not in parentheses, it does not have the effect evaluation, only change the priority operation.

var x = 1;
(x) = 2;

The second line of the code above, if the effect is evaluated with parentheses, then becomes 1 = 2, which is being given up. However, the above code can run, which verifies the parentheses change the priority only, not evaluated.

This also means that if the entire expression is placed in parentheses, it will not have any effect.

(exprssion)// 等同于
expression

Function in parentheses, will return to the function itself. If parentheses immediately after the function, it means the function is called.

function f() {  return 1;
}
(f) // function f(){return 1;}
f() // 1

The above code, the function will be placed in parentheses returns the function itself, with the parentheses after the function is the calling function.

In parentheses, the expression can only be placed if the statement is placed in parentheses, it will error.

(var a = 1)// SyntaxError: Unexpected token var

3.3, the left and right binding binding
to the operator the same priority level, in most cases, calculation order is always left to right, this is called operator "left binding" (left-to-right associativity ), i.e. from the left calculation.

x + y + z

The above code first calculates the leftmost x and y and then calculates and z.

However, the order of a few operators calculated from right to left, i.e. from the start to the right, this is called operator "right binding" (right-to-left associativity). Wherein, the most important is the assignment operator (=) and the ternary conditional operator (? :).

w = x = y = z;
q = a ? b : c ? d : e ? f : g;

Calculation result of the above code corresponds to the following way.

w = (x = (y = z));
q = a ? b : (c ? d : (e ? f : g));

The above two lines of code, each three and three equals operator ternary operator, are first calculated that the rightmost operator.

The exponential operator (**) is right-associative.

// 相当于 2 ** (3 ** 2)2 ** 3 ** 2// 512
Published 97 original articles · won praise 9 · views 2041

Guess you like

Origin blog.csdn.net/weixin_45959525/article/details/104816551