JavaScript 算术


目录

    显示目录


JavaScript 算术运算符

算术运算符对数字(文字或变量)执行算术运算。

+

添加

-

减法

*

乘法

**

求幂 (ES2016)

/

分配

%

模数(余数)

++

增量

--

递减


算术运算

典型的算术运算对两个数字进行运算。

这两个数字可以是文字:

例子

let x = 100 + 50;

自己尝试一下 →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Arithmetic</h2>
<p>A typical arithmetic operation takes two numbers and produces a new number.</p>

<p id="demo"></p>

<script>
let x = 100 + 50;
document.getElementById("demo").innerHTML = x;
</script>

</body>
</html>

或变量:

例子

let x = a + b;

自己尝试一下→

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Arithmetic</h2>
<p>A typical arithmetic operation takes two numbers (or variables) and produces a new number.</p>

<p id="demo"></p>

<script>
let a = 100;
let b = 50;
let x = a + b;
document.getElementById("demo").innerHTML = x;
</script>

</body>
</html>

或表达式:

例子

let x = (100 + 50) * a;

自己尝试一下 →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Arithmetic</h1>
<h2>Arithmetic Operations</h2>
<p>A typical arithmetic operation takes two numbers (or expressions) and produces a new number.</p>

<p id="demo"></p>

<script>
let a = 3;
let x = (100 + 50) * a;
document.getElementById("demo").innerHTML = x;
</script>

</body>
</html>

运算符和操作数

数字(在算术运算中)称为操作数

运算(在两个操作数之间执行)由运算符定义。

Operand Operator Operand
100 + 50


添加

加法运算符 (+) 添加数字:

例子

let x = 5;
let y = 2;
let z = x + y;

自己尝试一下→

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Arithmetic</h1>
<h2>The + Operator</h2>

<p id="demo"></p>

<script>
let x = 5;
let y = 2;
let z = x + y;
document.getElementById("demo").innerHTML = z;
</script>

</body>
</html>

减法

减法运算符 (-) 用于减去数字。

例子

let x = 5;
let y = 2;
let z = x - y;

自己尝试一下→

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Arithmetic</h1>
<h2>The - Operator</h2>

<p id="demo"></p>

<script>
let x = 5;
let y = 2;
let z = x - y;
document.getElementById("demo").innerHTML = z;
</script>

</body>
</html>

乘法

乘法运算符 (*) 将数字相乘。

例子

let x = 5;
let y = 2;
let z = x * y;

自己尝试一下 →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Arithmetic</h1>
<h2>The * Operator</h2>

<p id="demo"></p>

<script>
let x = 5;
let y = 2;
let z = x * y;
document.getElementById("demo").innerHTML = z;
</script>

</body>
</html>

划分

运算符 (/) 用于除数。

例子

let x = 5;
let y = 2;
let z = x / y;

自己尝试一下 →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Arithmetic</h1>
<h2>The / Operator</h2>

<p id="demo"></p>

<script>
let x = 5;
let y = 2;
let z = x / y;
document.getElementById("demo").innerHTML = z;
</script>

</body>
</html>

取模运算符 (%) 返回除法余数。

例子

let x = 5;
let y = 2;
let z = x % y;

自己尝试一下→

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Arithmetic</h1>
<h2>The % Operator</h2>

<p id="demo"></p>

<script>
let x = 5;
let y = 2;
let z = x % y;
document.getElementById("demo").innerHTML = z;
</script>

</body>
</html>

在算术中,两个整数相除产生一个余数

在数学中,模运算的结果是算术除法的余数


递增

递增运算符 (++) 递增数字。

例子

let x = 5;
x++;
let z = x;

自己尝试一下 →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Arithmetic</h1>
<h2>The ++ Operator</h2>

<p id="demo"></p>

<script>
let x = 5;
x++;
let z = x;
document.getElementById("demo").innerHTML = z;
</script>

</body>
</html>

递减

递减运算符 (--) 使数字递减。

例子

let x = 5;
 x--;
let z = x;

自己尝试一下→

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Arithmetic</h1>
<h2>The -- Operator</h2>

<p id="demo"></p>

<script>
let x = 5;
x--;
let z = x;
document.getElementById("demo").innerHTML = z;
</script>

</body>
</html>

求幂

求幂运算符 (**) 将第一个操作数计算为第二个操作数的幂。

例子

let x = 5;
let z =
 x ** 2;

自己尝试一下→

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Arithmetic</h1>
<h2>The ** Operator</h2>

<p id="demo"></p>

<script>
let x = 5;
document.getElementById("demo").innerHTML = x ** 2;
</script>

</body>
</html>

x ** y 产生与 Math.pow(x,y) 相同的结果:

例子

let x = 5;
let z =
  Math.pow(x,2);

自己尝试一下→

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Arithmetic</h1>
<h2>Math.pow()</h2>

<p id="demo"></p>

<script>
let x = 5;
document.getElementById("demo").innerHTML = Math.pow(x,2);
</script>

</body>
</html>

运算符优先级

运算符优先级描述了运算执行的顺序 算术表达式。

例子

let x = 100 + 50 * 3;

自己尝试一下 →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Arithmetic</h1>
<h2>Operator Precedence</h2>
<p>Multiplication has precedence over addition.</p>

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = 100 + 50 * 3;
</script>

</body>
</html>

上面例子的结果是和150 * 3一样,还是和100一样 + 150?

是先做加法还是先做乘法?

与传统的学校数学一样,首先进行乘法。

乘法 (*) 和除法 (/) 的优先级高于 加法 (+) 和减法 (-)。

并且(就像在学校数学中一样)可以通过使用来更改优先级 括号。

使用括号时,计算括号内的运算 第一的:

例子

let x = (100 + 50) * 3;

自己尝试一下→

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Arithmetic</h1>
<h2>Operator Precedence</h2>
<p>Multiplication has precedence over addition.</p>
<p>But parenthesis has precedence over multiplication.</p>

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = (100 + 50) * 3;
</script>

</body>
</html>

当许多操作具有相同的优先级时(例如加法和 减法或乘法和除法),它们从左到右计算 正确的:

例子

let x = 100 + 50 - 3;

自己尝试一下 →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Arithmetic</h1>
<h2>Operator Precedence</h2>
<p>When many operations has the same precedence, they are computed from left to right.</p>

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = 100 + 50 - 3;
</script>

</body>
</html>
let x = 100 / 50 * 3;

自己尝试一下 →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Arithmetic</h1>
<h2>Operator Precedence</h2>
<p>When many operations has the same precedence, they are computed from left to right.</p>

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = 100 / 50 * 3;
</script>

</body>
</html>

笔记

有关运算符优先级值的完整列表,请访问:

JavaScript 运算符优先级值。