JavaScript运算符

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

算术运算符
比较运算符
逻辑(或关系)运算符
赋值运算符
条件(或三元)运算符

让我们一一看一下所有运算符。

算术运算符

JavaScript支持以下算术运算符：

假设变量A为10，变量B为20，则：

序号.	运算符和说明
1	+(加法) 加两个操作数 Ex:A + B等于30
2	-(减法) 从第一个减去第二个操作数 Ex:A-B等于-10
3	(乘法) 将两个操作数相乘 Ex:A B会给200
4	/ (除) 用分子除以分母 Ex:B / A等于2
5	％(模) 输出整数除法的余数 Ex:B％A等于0
6	++(自增) 将整数值加1 Ex:A ++等于11
7	--(自减) 将整数值减一 Ex:A--等于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>

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，则：

序号.	运算符和说明
1	= =(等于) 检查两个操作数的值是否相等，如果是，则条件为真。 Ex:(A == B)为假。
2	！=(不等于) 检查两个操作数的值是否相等，如果值不相等，则条件为真。 Ex:(A！= B)为真。
3	>(大于) 检查左操作数的值是否大于右操作数的值，如果是，则条件变为true。 Ex:(A> B)为假。
4	<(小于) 检查左操作数的值是否小于右操作数的值，如果是，则条件为true。 Ex:(A <B)为真。
5	> =(大于或等于) 检查左操作数的值是否大于或等于右操作数的值，如果是，则条件变为true。 Ex:(A> = B)为假。
6	<=(小于或等于) 检查左操作数的值是否小于或等于右操作数的值，如果是，则条件为true。 Ex:(A <= B)为真。

以下代码显示了如何在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>

(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，则：

序号.	运算符和说明
1	&&(逻辑与) 如果两个操作数都不为零，则条件变为true。 Ex:(A && B)为真。
2	\|\| (逻辑或) 如果两个操作数中的任何一个都不为零，则条件变为true。 Ex:(A \|\| B)为真。
3	！ (逻辑非) 反转其操作数的逻辑状态。如果条件为真，则逻辑非运算符会将其设置为假。 Ex:！ (A && B)为假。

序号.

运算符和说明

&&(逻辑与)

如果两个操作数都不为零，则条件变为true。

Ex:(A && B)为真。

|| (逻辑或)

如果两个操作数中的任何一个都不为零，则条件变为true。

Ex:(A || B)为真。

！ (逻辑非)

反转其操作数的逻辑状态。如果条件为真，则逻辑非运算符会将其设置为假。

Ex:！ (A && B)为假。

尝试以下代码，以了解如何在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>

(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，则：

序号.	运算符和说明
1	＆(按位与) 它对其整数参数的每一位执行布尔“与”运算。 Ex:(A和B)为2。
2	\| (按位或) 它对其整数参数的每一位执行布尔或运算。 Ex:(A \| B)为3。
3	^(按位异或) 它对其整数参数的每一位执行布尔异或运算。异或表示一个操作数为true或两个操作数为true，但不是两个都为真。 Ex:(A ^ B)为1。
4	〜(按位不) 它是一元运算符，通过反转操作数中的所有位进行操作。 Ex:(〜B)为-4。
5	<<(左移) 它将第一个操作数中的所有位向左移动第二个操作数中指定的位数。新位填充零。将值左移一个位置等同于将其乘以2，将两个位置左移则等同于乘以4，依此类推。 Ex:(A << 1)是4。
6	>>(右移) 二进制右移运算符。左操作数的值向右移动右操作数指定的位数。 Ex:(A >> 1)为1。
7	>>>(右移零) 该运算符类似于>>运算符，不同之处在于，向左移的位始终为零。 Ex:(A >>> 1)为1。

尝试使用以下代码在JavaScript中实现按位运算符。

<html>
    <body>
        <script type = "text/javascript">
            <!--
                var a = 2; //位演示10
                var b = 3; //位演示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支持以下赋值运算符：

序号.	运算符和说明
1	=(赋值) 将值从右侧操作数分配到左侧操作数 Ex:C = A + B会将A + B的值赋给C
2	+ =(加赋值) 它将右操作数添加到左操作数，并将结果分配给左操作数。 Ex:C + = A等于C = C + A
3	：=(减赋值) 它从左侧操作数中减去右侧操作数，并将结果分配给左侧操作数。 Ex:C-= A等效于C = C-A
4	* =(乘赋值) 它将右操作数与左操作数相乘，并将结果分配给左操作数。 Ex:C * = A等效于C = C * A
5	/ =(除赋值) 它将左操作数除以右操作数，并将结果分配给左操作数。 Ex:C / = A等效于C = C / A
6	％=(模赋值) 它使用两个操作数取模，然后将结果分配给左操作数。 Ex:C％= A等于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>

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中非常有用的运算符：条件运算符(？:)和类型运算符.

条件运算符(？:)

条件运算符首先对表达式的真值或假值求值，然后根据求值结果执行两个给定语句之一。

序号.	运算符和说明
1	？：(视情况而定) 如果条件为真？然后取值X：否则取值Y

尝试以下代码，以了解条件运算符在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>

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

运算符类型

typeof运算符是一元运算符，位于其单个操作数之前，该运算数可以是任何类型。它的值是一个字符串，指示操作数的数据类型。

typeof 如果运算符的操作数是数字，字符串或布尔值，则其运算结果为“数字”，“字符串”或“布尔值”，并根据评估结果返回true或false。

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

类型	由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>

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

< 上一篇（JavaScript变量）

下一篇（JavaScript if...else） >

JavaScript教程

JavaScript对象

JavaScript进阶

JavaScript运算符

算术运算符

比较运算符

逻辑运算符

按位运算符

赋值运算符

杂项运算符

条件运算符(？:)

运算符类型