一.欢迎来到我的酒馆
1.让我们看一个简单的表达式：1 + 2 = 3 。在这里1和2称为操作数，+ 被称为运算符。下面是javascript支持的运算符：
- (Arithmetic operator)算数运算符。
- (Comparison operator)比较运算符。
- (Logical operator)逻辑运算符。
- (Assignment operator)赋值运算符。
- (Ternary operator)三目运算符。
2.什么是运算符？？
在编程语言中，运算符是可以操作值的对象。例如：1 + 2 ，1和2是操作数，+ 是操作符。运算符可以帮助我们在操作数上执行数学上的、关系上、按位运算的、条件上的或逻辑上的计算。简而言之，运算符可以帮助我们执行各种计算操作。
二.算数运算符
javascript支持下面的算数运算符：
假定变量A为10，变量B为20，
| No | 运算符 |
|---|---|
| 1 | + 运算符。表示两个数相加。eg: A + B = 30 |
| 2 | - 运算符。从第一个数减去第二个数。 eg: A - B = -10 |
| 3 | * 运算符。表示两个数相乘。eg: A * B = 200 |
| 4 | / 运算符。表示两个数相除。eg: A / B = 0.5 |
| 5 | % 运算符。表示两个数相除后的余数。eg: A % B = 10 |
| 6 | ++ 运算符。自增;。eg: A++ = 10 |
| 7 | – 运算符。自减。eg: A --= 10 |
在代码中使用算数运算符：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script language="javascript" type="text/javascript">
function printResult(result){
document.write(result);
document.write(linebreak);
}
</script>
</head>
<body>
<script language="javascript" type="text/javascript">
<!--
let a = 33;
let b = 10;
let c = "Test";
let linebreak = "<br/>";
// a + b = 43
document.write("a + b =");
result = a + b;
printResult(result);
// a - b = 23
document.write("a - b = ");
result = a - b;
printResult(result);
// a * b = 330
document.write("a * b = ");
result = a * b;
printResult(result);
// a / b = 3.3
document.write("a / b = ");
result = a / b;
printResult(result);
// a % b = 3
document.write("a % b = ");
result = a % b;
printResult(result);
// a + b + c = 43Test
document.write("a + b + c = ");
result = a + b + c;
printResult(result);
// a++ = 33
document.write("a++ = ");
result = a++;
printResult(result);
//a-- = 34
document.write("a-- = ");
result = a--;
printResult(result);
//-->
</script>
</body>
</html>
保存上面的代码，用浏览器打开：
三.比较运算符
javascript支持以下的比较运算符：
假定A的值为10，B的值为20，
| No | 运算符和说明 |
|---|---|
| 1 | == 运算符。比较两个数是否相等，如果相等表达式的值为true。eg: (A == B) 返回fasle |
| 2 | != 运算符。比较两个数是否不相等，如果不相等表达式的值为true。eg: (A != B) 返回true |
| 3 | > 运算符。比较运算符左边的数是否大于右边的数，如果是返回true。eg: (A > B) 返回fasle |
| 4 | < 运算符。比较运算符左边的数是否小于右边的数，如果是返回true。eg: (A < B) 返回true |
| 5 | >= 运算符。比较运算符左边的数是否大于等于右边的数，如果是返回true。eg: (A >= B) 返回false |
| 6 | <= 运算符。比较运算符左边的数是否小于等于右边的数，如果是返回true。eg: (A <= B) 返回true |
在代码中使用比较运算符：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script language="javascript" type="text/javascript">
function printResult(result){
document.write(result);
document.write(linebreak);
}
</script>
</head>
<body>
<script language="javascript" type="text/javascript">
let num1 = 10;
let num2 = 20;
let linebreak = "<br/>";
// num1 > num2 false
document.write("(num1 > num2) => ");
result = num1 > num2;
printResult(result);
// num1 < num2 true
document.write("(num1 < num2) => ");
result = num1 < num2;
printResult(result);
// num1 == num2 false
document.write("(num1 == num2) => ");
result = num1 == num2;
printResult(result);
// num1 != num2 true
document.write("(num1 != num2) => ");
result = num1 != num2;
printResult(result);
// num1 >= num2 false
document.write("(num >= num2) => ");
result = num1 >= num2;
printResult(result);
// num1 <= num2 true
document.write("(num1 <= num2) => ");
result = num1 <= num2;
printResult(result);
</script>
</body>
</html>
输出：
四.逻辑运算符
javascript支持以下的逻辑运算符：
假定变量A的值为true, B的值为false:
| No | 运算符 |
|---|---|
| 1 | && 逻辑与运算符。如果运算符两边非0，则表达式的值为true。eg: (A && B) 返回true |
| 2 | || 逻辑或运算符。如果运算符两边有一边非0，则表达式的值为true。eg: (A || B) 返回true |
| 3 | ! 逻辑非运算符。反转运算符的逻辑值。如果运算符的一边为true，则返回false。eg: !(A && B) 返回false |
在代码中使用逻辑运算符：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script language="javascript" type="text/javascript">
// 输出结果
function printResult(result) {
// document.write()函数用于向HTML文档输出一段字符串
document.write(result);
document.write(linebreak);
}
</script>
</head>
<body>
<script language="javascript" type="text/javascript">
let A = true;
let B = false;
let linebreak = "<br/>";
document.write("(A && B) => ");
result = A && B;
printResult(result);
document.write("(A || B) = > ");
result = A || B;
printResult(result);
document.write("!(A && B) => ");
result = !(A && B);
printResult(result);
</script>
</body>
</html>
保存上面的代码，使用浏览器打开：
五.按位运算符
1.javascript支持以下的按位运算符：
假定A的值为2，B的值为3，
| No | 运算符 |
|---|---|
| 1 | & (AND)按位与运算符。将两个数作为操作数，并对两个数字的每个位执行AND操作，仅单两个位均为1的时候，结果才是1。 |
| 2 | | (OR)按位或运算符。将两个数作为操作数，并对两个数字的每个为执行OR操作，只要对位上有一个为1，结果就为1。 |
| 3 | ^ (XOR)按位异或运算符。将两个数作为操作数，并对两个数字的每个位执行XOR操作，只要对位上不相同，结果就是1。 |
| 4 | ~ 按位取反运算符。 |
| 5 | >> 右移运算符。 |
| 6 | << 左移运算符。 |
2.按位与运算符
<script language="javascript" type="text/javascript">
let A = 2;
let B = 3;
let linebreak = "<br/>";
document.write("(A & B) is ");
result = (A & B);
document.write(result);
document.write(linebreak);
</script>
result的值为2.
分析：
A的值为2，用二进制表示：0000 0010
B的值为3，用二进制表示：0000 0011
然后对每个位进行AND求值，只有当两个位上都是1的时候，结果才是1.
3.按位或运算符
<script language="javascript" type="text/javascript">
let A = 2;
let B = 3;
let linebreak = "<br/>";
document.write("(A | B) is ");
result = (A | B);
document.write(result);
document.write(linebreak);
</script>
result的值为3：
分析：
A的值为2，用二进制表示：0000 0010
B的值为3，用二进制表示：0000 0011
然后对每个对位进行 | 求值，只要对位上有一个是1，结果就是1。
4.按位异或运算符
<script language="javascript" type="text/javascript">
let A = 2;
let B = 3;
let linebreak = "<br/>";
document.write("(A ^ B) is ");
result = (A ^ B);
document.write(result);
document.write(linebreak);
</script>
result的值为1：
分析：
A的值为2，用二进制表示：0000 0010
B的值为3，用二进制表示：0000 0011
然后对每个对位执行 ^ 操作，只要两个对位数字不相同，结果就是1。
5.按位取反操作符
<script language="javascript" type="text/javascript">
let A = 2;
let B = 3;
let linebreak = "<br/>";
document.write("(~ A) is ");
result = (~ A);
document.write(result);
document.write(linebreak);
</script>
result的结果为-4:
分析：
A的值为1，用二进制表示：0000 0010
5.2这里需要引入原码、反码和补码的概念。原码很好理解，就是对应的二进制。一个十进制转为二进制，得到的这个二进制即为原码。例如，2的二进制为：0000 0010，所以2的原码为: 0000 0010 。
二进制的最高位表示数据的正负：
5.3 原码、反码和补码概念
~ A 执行完按位取反操作后变为， 1111 1101，而计算机中，是以补码的形式存放数据的，因此要将取反操作后的数求补码，正数的原码，反码，补码都相同。负数的反码：最高位不变，其余位取反得到反码。负数的补码：在反码的基础上加1。
简而言之，对所有整数按位取反 = 本身的相反数 -1。
6.左移运算符
<script language="javascript" type="text/javascript">
let A = 2;
let B = 3;
let linebreak = "<br/>";
document.write("(A << 1) is ");
result = (A << 1);
document.write(result);
document.write(linebreak);
</script>
result的值为：4
分析：
A=2，假设字长为8位，转换成二进制为：0000 0010，向左移一位，变成：0000 0100，即为4.
7.右移运算符
<script language="javascript" type="text/javascript">
let A = 2;
let B = 3;
let linebreak = "<br/>";
document.write("(A >> 1) is ");
result = (A >> 1);
document.write(result);
document.write(linebreak);
</script>
result的值为：4
分析：
A=2，假设字长为8位，转换成二进制为：0000 0010，向右移一位，变成：0000 0001，即为1.
六.赋值运算符
javascript支持以下赋值运算符：
| No | 运算符 |
|---|---|
| 1 | = 运算符。将 = 右边的数赋值给左边。eg: C = A + B. |
| 2 | += 运算符。将左边的数和右边的数相加，然后赋值给左边的数。eg: C +=A 等效于 C = C + A; |
| 3 | -= 运算符。从左边的数减去右边的数，然后赋值给左边的数。eg: C -= A 等效于 C = C - A; |
| 4 | *= 运算符。将左边的数乘以右边的数，然后赋值给左边的数。eg: C *= A 等效于 C = C * A; |
| 5 | /= 运算符。将左边的数除以右边的数，然后赋值给左边的数。eg: C /=A 等效于 C = C / A; |
| 6 | %= 运算符。对两个数取余，然后将结果赋值给左边的数。eg: C %= A 等效于 C = C % A; |
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script language="javascript" type="text/javascript">
function printResult(result){
// document.write()函数向HTML文档输入一段字符串
document.write(result);
document.write(linebreak);
}
</script>
</head>
<body>
<script language="javascript" type="text/javascript">
let A = 10;
let B = 20;
let linebreak = "<br/>";
document.write("(A = B) => ");
result = (A = B);
printResult(result);
document.write("(A += B) =>");
result = (A += B);
printResult(result);
document.write("(A -= B) =>");
result = (A -= B);
printResult(result);
document.write("(A *= B) =>");
result = (A *= B);
printResult(result);
document.write("(A /= B) =>");
result=(A /= B);
printResult(result);
document.write("(A %= B) =>");
result = (A %= B);
printResult(result);
</script>
</body>
</html>
保存上面的代码，使用浏览器打开：
七.三目运算符
三目运算符首先计算表达式的布尔值，然后根据这个布尔值执行两个给定的其中一个语句。
| No | 运算符 |
|---|---|
| 1 | ? : 三目运算符。如果条件为真，执行第一个语句，否则执行第二个语句。 |
在代码中使用三目运算符：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script language="javascript" type="text/javascript">
function printResult(result){
//document.write()函数向HTML文档输入一段字符串
document.write(result);
document.write(linebreak);
}
</script>
</head>
<body>
<script language="javascript" type="text/javascript">
let A = 10;
let B = 20;
let linebreak = "<br/>";
document.write("(A > B) ? 100 : 200 =>");
result = (A>B) ? 100 : 200;
printResult(result);
document.write("(A < B) ? 100 : 200 =>");
result = (A<B) ? 100 : 200;
printResult(result);
</script>
</body>
</html>
保存上面的代码，用浏览器打开：
八.typeof 运算符
typeof是一元运算符。typeof一元运算符可以放置在任何数据类型之前，它会按操作数的数据类型返回一个string。
下面是typeof运算符的返回值：
| 类型 | 按类型返回的字符串 |
|---|---|
| Number | “number” |
| String | “string” |
| Boolean | “boolean” |
| Object | “object” |
| Function | “function” |
| Undefined | “undefined” |
| Null | “null” |
在代码中使用typeof运算符：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script language="JavaScript" type="text/javascript">
function printResult(result){
document.write(result);
}
</script>
</head>
<body>
<script language="javascript" type="text/javascript">
let name = "Michael";
let num = 123;
let linebreak = "<br/>";
result = typeof name == "string" ? "string" : "not string";
document.write(result);
document.write(linebreak);
result = typeof num == "number" ? "number" : "string";
document.write(result);
document.write(linebreak);
result = typeof printResult == "function" ? "function" : "not funvtion";
document.write(result);
document.write(linebreak);
</script>
</body>
</html>
扫一扫
1178
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
