0

JavaScript 运算符

Posted by 撒得一地 on 2016年4月30日 in JavaScript教程

运算符是什么?

让我们看一个简单的表达式 4 + 5 等于 9。4 和 5 在这里称为操作数和 '+' 称为运算符。JavaScript 支持以下类型的运算符。

算术运算符

比较运算符

逻辑 (或关系) 运算符

赋值运算符

条件 (或三元) 运算符

我们一个个的来看下这些运算符。

算术运算符

JavaScript 支持下列算术运算符

假设变量 A 的值为10 和 变量B 的值为20,那么:

Sr.No Operator and Description
1

+ (Addition)

将两个操作数相加

Ex: A + B will give 30

2

- (Subtraction)

将第一个数减去第二个数

Ex: A – B will give -10

3

* (Multiplication)

对两个操作数相乘

Ex: A * B will give 200

4

/ (Division)

将一个操作数除以另一个操作数

Ex: B / A will give 2

5

% (Modulus)

输出一个数对另一个数相除后的余数

Ex: B % A will give 0

6

++ (Increment)

对一个整数加1

Ex: A++ will give 11

7

– (Decrement)

对一个整数减1

Ex: A– will give 9

注意 加法运算符 (+) 适用于数字以及字符串相加操作。例如"a"+ 10 会等于"a10"。

示例

下面的代码演示如何在 JavaScript 中使用算术运算符。

	<html>
	    <body>
	     <script type="text/javascript">
	        <!--
	          var a = 33;
	          var b = 10;
	          var c = "Test";
	          var linebreak = "<br />";

	          document.write("a + b = ");
	          result = a + b;
	          document.write(result);
	          document.write(linebreak);            

	          document.write("a - b = ");
	          result = a - b;
	          document.write(result);
	          document.write(linebreak);             

	           document.write("a / b = ");
	          result = a / b;
	          document.write(result);
	          document.write(linebreak);

	          document.write("a % b = ");
	          result = a % b;
	          document.write(result);
	          document.write(linebreak);            

	           document.write("a + b + c = ");
	          result = a + b + c;
	          document.write(result);
	          document.write(linebreak); 

	          a = ++a;
	          document.write("++a = ");
	          result = ++a;
	          document.write(result);
	          document.write(linebreak); 

	          b = --b;
	          document.write("--b = ");
	          result = --b;
	          document.write(result);
	          document.write(linebreak);
	          //-->
	     </script>
	          Set the variables to different values and then try...
	  </body>
	</html>

亲自试一试

Output
a + b = 43
a - b = 23
a / b = 3.3
a % b = 3
a + b + c = 43Test
++a = 35
--b = 8
Set the variables to different values and then try...

比较运算符

JavaScript 支持下列比较运算符:

假设变量 A 的值为 10 和 变量 B 的值为 20,那么:

Sr.No Operator and Description
1

= = (Equal)

检查两个操作数的值是否相等,如果是,那么条件表达式为 true 。

Ex: (A == B) is not true.

2

!= (Not Equal)

检查两个操作数的值是否不相等,如果是,那么条件表达式为 true 。

Ex: (A != B) is true.

3

> (Greater than)

检查是否左边的操作数的值大于右操作数的值,如果是的话,那么条件表达式为 true。

Ex: (A > B) is not true.

4

< (Less than)

检查左边操作数的值是否小于右边操作数的值,如果是,条件表达式为 true。

Ex: (A < B) is true.

5

>= (Greater than or Equal to)

检查左边操作数的值是否大于或等于右操作数的值,如果是,那么条件表达式为 true。

Ex: (A >= B) is not true.

6

<= (Less than or Equal to)

检查左边操作数的值是否小于或等于右边操作数的值,如果是条件表达式变为 true。

Ex: (A <= B) is true.

示例

下面的代码演示如何在 JavaScript 中使用比较运算符。

	<html>
	    <body>
	      <script type="text/javascript">
	         <!--
	            var a = 10;
	            var b = 20
	            var linebreak = "<br />";
	            document.write("(a == b) => ");
	            result = (a == b);
	            document.write(result);
	            document.write(linebreak);

	            document.write("(a < b) => ");
	            result = (a < b);
	            document.write(result);
	            document.write(linebreak);
	            document.write("(a > b) => ");
	            result = (a > b);
	            document.write(result);
	            document.write(linebreak);

	            document.write("(a != b) => ");
	            result = (a != b);
	            document.write(result);
	            document.write(linebreak);
	            document.write("(a >= b) => ");
	            result = (a >= b);
	            document.write(result);
	            document.write(linebreak);

	            document.write("(a <= b) => ");
	            result = (a <= b);
	            document.write(result);
	            document.write(linebreak);
	             //-->
	          </script> 
	    Set the variables to different values and different operators and then try...
	  </body>
	</html>

亲自试一试

Output
(a == b) => false 
(a < b) => true 
(a > b) => false 
(a != b) => true 
(a >= b) => false 
a <= b) => true
Set the variables to different values and different operators and then try...

逻辑运算符

JavaScript 支持以下逻辑运算符:

假设变量 A 的值为 10 和 变量 B 的值为 20,那么:

Sr.No Operator and Description
1

&& (Logical AND)

如果两个操作数都为非0,那么该表达式返回 true

Ex: (A && B) is true.

2

|| (Logical OR)

如果两个操作数中任意一个为非0,那么该表达式返回 true

Ex: (A || B) is true.

3

! (Logical NOT)

反转操作数的逻辑状态,如果条件为 true,然后逻辑 ! 运算符后将变为false

Ex: ! (A && B) is false.

示例

请尝试以下代码,以了解如何在 JavaScript 中实现逻辑运算符。

	<html>
	  <body>
	     <script type="text/javascript">
	        <!--
	          var a = true;
	          var b = false;
	          var linebreak = "<br />";
	          document.write("(a && b) => ");
	          result = (a && b);
	          document.write(result);
	          document.write(linebreak);        

	          document.write("(a || b) => ");
	          result = (a || b);
	          document.write(result);
	          document.write(linebreak);       

	           document.write("!(a && b) => ");
	           result = (!(a && b));
	          document.write(result);
	          document.write(linebreak);
	          //-->
	     </script>   
	       <p>Set the variables to different values and different operators and then try...</p>
	    </body>
	</html>

亲自试一试

Output
(a && b) => false 
(a || b) => true 
!(a && b) => true
Set the variables to different values and different operators and then try...

按位运算符

JavaScript 支持以下的按位运算符

假设变量 A 值为 2 和 变量 B 的值为 3,那么:

Sr.No Operator and Description
1

& (Bitwise AND)

对整数的每一个二进制位进行与操作

Ex: (A & B) is 2.

2

| (BitWise OR)

对整数的每一个二进制位进行或操作

Ex: (A | B) is 3.

3

^ (Bitwise XOR)

对整数的每一个二进制位进行异或操作。进行异或运算的两个二进位的值不相同,则异或结果为真。反之,为假。

Ex: (A ^ B) is 1.

4

~ (Bitwise Not)

它是一个一元运算符,作用是对所有操作数中的二进制位进行反转。

Ex: (~B) is -4.

5

<< (Left Shift)

按二进制形式把所有的数字向左移动对应的位数,高位移出(舍弃),低位的空位补零。

Ex: (A << 1) is 4.

6

>> (Right Shift)

右移运算是将一个二进制位的操作数按指定移动的位数向右移动,移出位被丢弃,左边移出的空位或者一律补0,或者补符号位。

Ex: (A >> 1) is 1.

7

>>> (Right shift with Zero)

此运算符是和 >> 运算符类似,只是左边移中的位将始终为零。

Ex: (A >>> 1) is 1.

示例

请尝试以下代码,在 JavaScript 执行按位运算符。

	<html>
	    <body> 
	     <script type="text/javascript">
	        <!--
	         var a = 2; // Bit presentation 10
	         var b = 3; // Bit presentation 11
	         var linebreak = "<br />";          
	         document.write("(a & b) => ");
	         result = (a & b);
	         document.write(result);
	         document.write(linebreak);
	         document.write("(a | b) => ");

	         result = (a | b);
	         document.write(result);
	         document.write(linebreak);
	         document.write("(a ^ b) => ");

	         result = (a ^ b);
	         document.write(result);
	         document.write(linebreak);
	         document.write("(~b) => ");
	         result = (~b);
	         document.write(result);
	         document.write(linebreak);  

	         document.write("(a << b) => ");
	         result = (a << b);
	         document.write(result);
	         document.write(linebreak);
	         document.write("(a >> b) => ");
	         result = (a >> b);
	         document.write(result);
	         document.write(linebreak);
	      //-->
	    </script>     
	       <p>Set the variables to different values and different operators and then try...</p>
	    </body>
	</html>

亲自试一试

(a & b) => 2 
(a | b) => 3 
(a ^ b) => 1 
(~b) => -4 
(a << b) => 16 
(a >> b) => 0
Set the variables to different values and different operators and then try...

赋值运算符

JavaScript 支持下面的赋值运算符

Sr.No Operator and Description
1

= (Simple Assignment )

将右侧操作数的值分配给左侧操作数。

Ex: C = A + B will assign the value of A + B into C

2

+= (Add and Assignment)

它将右操作数和左操作数进行相加,并将结果赋给左操作数。

Ex: C += A is equivalent to C = C + A

3

−= (Subtract and Assignment)

它将左操作数减去右操作数,并将结果赋给左操作数。

Ex: C -= A is equivalent to C = C – A

4

*= (Multiply and Assignment)

它将右操作数与左操作数相乘,并将结果赋给左操作数。

Ex: C *= A is equivalent to C = C * A

5

/= (Divide and Assignment)

它将左边操作数除以右操作数,并将结果赋给左操作数。

Ex: C /= A is equivalent to C = C / A

6

%= (Modules and Assignment)

它对两个操作数进行取模运算,并将结果赋给左操作数。

Ex: C %= A is equivalent to C = C % A

请注意 按位运算符同样适用这样的逻辑,所以他们将会成为 <<= ,>> =,&=,|= 和 ^ =。

示例

请尝试以下代码以在 JavaScript 执行赋值运算符。

	<html>
	    <body>
	      <script type="text/javascript">
	        <!--
	          var a = 33;
	          var b = 10;
	          var linebreak = "<br />"; 
	          document.write("Value of a => (a = b) => ");
	          result = (a = b);
	          document.write(result);
	          document.write(linebreak);    
	          document.write("Value of a => (a += b) => ");
	          result = (a += b);
	          document.write(result);
	          document.write(linebreak);
	          
                   document.write("Value of a => (a -= b) => ");
	          result = (a -= b);
	          document.write(result);
	          document.write(linebreak);      

	           document.write("Value of a => (a *= b) => ");
	          result = (a *= b);
	          document.write(result);
	          document.write(linebreak);

	           document.write("Value of a => (a /= b) => ");
	          result = (a /= b);
	          document.write(result);
	          document.write(linebreak);
	          document.write("Value of a => (a %= b) => ");

	          result = (a %= b);
	          document.write(result);
	          document.write(linebreak);
	             //-->
	    </script>
	       <p>Set the variables to different values and different operators and then try...</p>
	    </body>
	</html>

亲自试一试

Output
Value of a => (a = b) => 10
Value of a => (a += b) => 20 
Value of a => (a -= b) => 10 
Value of a => (a *= b) => 100 
Value of a => (a /= b) => 10
Value of a => (a %= b) => 0
Set the variables to different values and different operators and then try...

杂项运算符

我们将讨论两个在 JavaScript 中很有用的运算符︰ 条件运算符 (?:) 和 typeof 运算符。

条件运算符 (?:)

条件运算符首先计算表达式为 true 或 false 的值,然后在根据结果选择执行两个给定语句中的一个。

Sr.No Operator and Description
1

? : (Conditional )

If Condition is true? Then value X : Otherwise value Y

表达式 ? X : Y  ,如果表达式的值为 true ,那么返回 X,否则返回 Y 。如:

5 > 3 ? 2 : 3, 因为5 大于 3为 true,所以整个表达式最后的结果为2 。

示例

请尝试以下代码,以了解如何在 JavaScript 中使用条件运算符。

	<html>
	    <body>
	     <script type="text/javascript">
	       <!--
	          var a = 10;
	          var b = 20;
	          var linebreak = "<br />";     
	          document.write ("((a > b) ? 100 : 200) => ");
	          result = (a > b) ? 100 : 200;
	          document.write(result);
	          document.write(linebreak);
	          document.write ("((a < b) ? 100 : 200) => ");
	          result = (a < b) ? 100 : 200;
	          document.write(result);
	          document.write(linebreak);
	            //-->
	     </script>  
	      <p>Set the variables to different values and different operators and then try...</p>
	   </body>
	</html>

亲自试一试

Output
((a > b) ? 100 : 200) => 200 
((a < b) ? 100 : 200) => 100
Set the variables to different values and different operators and then try...

Typeof 运算符是放置在某个操作数之前,可以是任何类型的一元运算符。其值返回的是一个字符串,用于指示操作数的数据类型。

如果该运算符的操作数是数字、 字符串或布尔值并返回 true 或 false ,那么 typeof 运算符可以计算出这些操作数类型是否为"数字"、"字符串"或"布尔值"。

以下是 typeof 运算符返回值的列表。

Type String Returned by typeof
Number "number"
String "string"
Boolean "boolean"
Object "object"
Function "function"
Undefined "undefined"
Null "object"

示例

下面的代码演示如何实现 typeof 运算符。

	<html>
	  <body>     
	     <script type="text/javascript">
	       <!--
	          var a = 10;
	          var b = "String";
	          var linebreak = "<br />";
	          result = (typeof b == "string" ? "B is String" : "B is Numeric");
	          document.write("Result => ");
	          document.write(result);
	          document.write(linebreak);
	          result = (typeof a == "string" ? "A is String" : "A is Numeric");
	          document.write("Result => ");
	          document.write(result);
	          document.write(linebreak);
	             //-->
	    </script>  
	      <p>Set the variables to different values and different operators and then try...</p>
	  </body>
	</html>

亲自试一试

Output
Result => B is String 
Result => A is Numeric
Set the variables to different values and different operators and then try...

上一篇:

下一篇:

相关推荐

发表评论

电子邮件地址不会被公开。 必填项已用*标注

4 + 0 = ?

网站地图|XML地图

Copyright © 2015-2018 技术拉近你我! All rights reserved.
闽ICP备15015576号-1,版权所有©psz.