乐趣区

JavaScript算术运算符

算术运算符用于对数字(文字或变量)执行算术运算。标准算术运算符是加法 +,减法 -,乘法 * 和除法 /。和数学里面的加减乘除很类似,我们一起来看一下。

加法运算符

加法运算符 + 的作用是数值求和,这个应该很简单。

示例:

下面是简单的求两数之和:

var a = 8;
var b = a + 5;
console.log(b);  // 13

+ 激发运算符除了计算两数之和,我们可以通过 + 连接字符串,得到的结果是一个新的字符串。

示例:

使用 + 将定义好的三个变量连接:

str1 = "hello";
str2 = "xkd";
str3 = " ";
console.log(str1 + str3 + str2);  // 输出:hello xkd

除此之外,数字和一个字符串也可以通过 + 加号连接,返回结果同样为一个字符串。

示例:

看一下数字与数字相加,数字与字符串相加有什么不同:

num1 = 10;
num2 = 15;
str1 = "15"

console.log(num1 + num2);  // 输出:25
console.log(num1 + str1);  // 输出:1015

注意在某些编程语言(例如 Python)中不同类型是不能进行相加的,例如数字加字符串会报错。而 JavaScript 中数字和字符串相加,返回一个字符串。

减法运算符

减法运算符 - 可以用于两个操作数相减,结果为它们的差值。

示例:
var c = 8;
var d = c - 5;
console.log(d);  // 3

乘法运算符

乘法运算符 * 的结果是操作数的乘积。

示例:
var e = (8 + 5) * 3;
var f = 'xkd' * 3;
console.log(e);  // 输出:39
console.log(f);  // 输出:NaN

如果我们使用一个字符串与一个数字相乘,最终返回一个 NaN,即非法数。

除法运算符

除法运算符 / 的结果是操作数的商,左操作数是被除数,右操作数是除数。

示例:
var g = (9 - 3) / 3;
var h = 3.0 / 1.0;
var i = 1 / 2;

console.log(g);  // 输出:2
console.log(h);  // 输出:3
console.log(i);  // 输出:0.5

我们需要注意的是,在 JavaScript 中 1 / 2 这种结果带小数点的运算,结果会带小数点,例如 0.5。而在 Java 等语言中,不需要数字是明确的浮点数,1 / 2 的返回结果为 0。

求余运算符

百分号 % 是求余运算符,返回第一个操作数对第二个操作数的模(余数),例如 x % y,得到的结果是x 除以y 的整型余数。余数大家应该知道,我们在数学中也学过,就是指整数触发中被除数未被除尽的部分。

示例:

例如下面这段代码:

var m = 9;
var n = 2;
var mn = m % n;
console.log(mn);  // 输出:1

输出结果为 1,这其实很好理解,9 % 2 就是求 9 除以 2 的余数,就是 1。

那么如果是 12 % 5 呢,输出结果会是什么?12 除以 5 会余 2,所以结果结果为 2。现在你应该知道 % 要怎么使用了吧。

递增运算符

递增运算符 ++ 为其操作数增加 1,并返回一个数值。如果使用后置,如x++,将会在递增前返回数值。如果前置,如 ++x,将会在递增后返回数值。

示例:

假设我们定义了一个变量 i,然后使用自增运算符对 i 进行递增运算,将递增后的 i 赋值给了变量 j,最终j 的输出结果为 6:

var i = 5;
i++;
var j = i;
console.log(j);  // 6

那为什么结果会是 6 呢,i++ 其实就是表示在 i 的基础上加一,相当于i + 1

然后我们看一下递增运算符前置和后置,到底有什么区别,例如下面这个代码:

var a = 9;
console.log(a++);  // 输出:9

console.log(a);    // 输出:10

console.log(++a);  // 输出:11
  • 变量 a 的值为 9,然后使用后置递增运算符 a++,第一次输出会 在递增之前就返回数值,即输出结果还是 9。
  • 然后此时输出 a 的值,可以看到 a 的值已经为 10 了,因为已经执行了一次递增运算符,所以加 1。
  • 接着第三次输出时,使用前置递增运算符,这会 在递增之后才返回数值,即输出结果为 11。

递减运算符

递减运算符 -- 为其操作数减去 1,并返回一个数值。递减运算符和递增运算符的使用方法差不多,一个是减、一个是加,正好相反。

如果后置使用递减运算符,则在递减之前返回数值。如果前置使用,则在递减之后返回数值。

示例:
var b = 7;
console.log(b--);  // 输出:7

console.log(b);    // 输出:6

console.log(--b);  // 输出:5
  • 变量 b 的值为 7,然后使用后置递减运算符 b--,会 在递减之前返回数值,即 7。
  • 然后第二次输出变量 b,此时已经成功执行b--,会在此基础上减 1,所以输出 6。
  • 第三次输出 --b,使用后置递减运算符,会 在递减之后返回数值,所以会输出 5。

幂运算符

幂运算符 ** 返回第一个操作数做底数,第二个操作数做指数的乘方。例如5 ** 2 表示 5 的 2 次方,根据所学数学知道就能得出结果为 25。

示例:

下面这个代码表示求 6 的 3 次方,相当于 6 * 6 * 6,结果为 216:

var x = 6;
var y = x ** 3;
console.log(y);  // 216

上面的运算出的结果与 Math.pow(x, y) 是相同的,例如:

var x = 6;
var y = Math.pow(x,3);
console.log(y);  // 216

pow()方法可返回 x 的 y 次幂的值。

动手小练习

  1. 分别各定义一个加减乘除运算符的运算并显示输出到网页中执行结果。
  2. 定义两个变量 a、b,其中 a 的值为 7,b 的值为 4,在网页中执行并输出 a ** b 结果。
退出移动版