JavaScript 运算符

运算符 = 用于赋值。

运算符 + 用于加值。

---

运算符 = 用于给 JavaScript 变量赋值。

算术运算符 + 用于把值加起来。

在以上语句执行后，x 的值是：

<p>点击按钮计算 x 的值.</p>
<button onclick="myFunction()">点击这里</button>
<p id="demo"></p>
<script>
  function myFunction() {
    y = 5;
    z = 2;
    x = y + z;
    document.getElementById("demo").innerHTML = x;
  }
</script>

尝试一下 »

---

JavaScript 算术运算符

y=5，下面的表格解释了这些算术运算符：

<p>假设 y=5，计算 x=y+2，并显示结果。</p>
<button onclick="myFunction()">点击这里</button>
<p id="demo"></p>
<script>
  function myFunction() {
    var y = 5;
    var x = y + 2;
    var demoP = document.getElementById("demo")
    demoP.innerHTML = "x=" + x;
  }
</script>

尝试一下 »

<p>设置 y=5, 计算出 x=y-2, 并输出结果。</p>
<button onclick="myFunction()">点我</button>
<p id="demo"></p>
<script>
  function myFunction() {
    var y = 5;
    var x = y - 2;
    var demoP = document.getElementById("demo");
    demoP.innerHTML = "x=" + x;
  }
</script>

尝试一下 »

<p>设置 y=5, 计算出 x=y*2, 并输出结果。</p>
<button onclick="myFunction()">点我</button>
<p id="demo"></p>
<script>
  function myFunction() {
    var y = 5;
    var x = y * 2;
    var demoP = document.getElementById("demo")
    demoP.innerHTML = "x=" + x;
  }
</script>

尝试一下 »

<p>设置 y=5, 计算 x=y/2, 并输出结果。</p>
<button onclick="myFunction()">点我</button>
<p id="demo"></p>
<script>
  function myFunction() {
    var y = 5;
    var x = y / 2;
    var demoP = document.getElementById("demo")
    demoP.innerHTML = "x=" + x;
  }
</script>

尝试一下 »

<p>设置 y=5, 计算出 x=y%2, 并显示结果。</p>
<button onclick="myFunction()">点我</button>
<p id="demo"></p>
<script>
  function myFunction() {
    var y = 5;
    var x = y % 2;
    var demoP = document.getElementById("demo")
    demoP.innerHTML = "x=" + x;
  }
</script>

尝试一下 »

<p>设置 y=5, 计算出 x=++y, 并显示结果。</p>
<button onclick="myFunction()">点我</button>
<p id="demo"></p>
<script>
  function myFunction() {
    var y = 5;
    var x = ++y;
    var demoP = document.getElementById("demo")
    demoP.innerHTML = "x=" + x + ", y=" + y;
  }
</script>
<p><strong>注意:</strong>两个值 x 和 y 都受到影响。</p>

尝试一下 »

<p>设置 y=5, 计算出 x=y++, 并显示结果。</p>
<button onclick="myFunction()">点我</button>
<p id="demo"></p>
<script>
  function myFunction() {
    var y = 5;
    var x = y++;
    var demoP = document.getElementById("demo")
    demoP.innerHTML = "x=" + x + ", y=" + y;
  }
</script>
<p><strong>注意:</strong> x 和 y 两个值都受到影响。</p>

尝试一下 »

<p>设置 y=5, 计算出 x=--y, 并显示结果。</p>
<button onclick="myFunction()">点我</button>
<p id="demo"></p>
<script>
  function myFunction() {
    var y = 5;
    var x = --y;
    var demoP = document.getElementById("demo")
    demoP.innerHTML = "x=" + x + ", y=" + y;
  }
</script>
<p><strong>注意:</strong> x 和 y 两个值都会被影响。</p>

尝试一下 »

<p>设置 y=5, 计算出 x=y--, 并显示结果。</p>
<button onclick="myFunction()">点我</button>
<p id="demo"></p>
<script>
  function myFunction() {
    var y = 5;
    var x = y--;
    var demoP = document.getElementById("demo")
    demoP.innerHTML = "x=" + x + ", y=" + y;
  }
</script>
<p><strong>注意：</strong>x 和 y 两个值都会受到影响。</p>

尝试一下 »

运算符	描述	例子	x 运算结果	y 运算结果	在线实例
+	加法	x=y+2	7	5	实例 »
-	减法	x=y-2	3	5	实例 »
*	乘法	x=y*2	10	5	实例 »
/	除法	x=y/2	2.5	5	实例 »
%	取模（余数）	x=y%2	1	5	实例 »
++	自增	x=++y	6	6	实例 »
		x=y++	5	6	实例 »
--	自减	x=--y	4	4	实例 »
		x=y--	5	4	实例 »

---

JavaScript 赋值运算符

赋值运算符用于给 JavaScript 变量赋值。

给定 x=10 和 y=5，下面的表格解释了赋值运算符：

<p>设置 x=10 和 y=5, 计算 x=y, 并显示结果。</p>
<button onclick="myFunction()">点我</button>
<p id="demo"></p>
<script>
  function myFunction() {
    var x = 10;
    var y = 5;
    x = y;
    var demoP = document.getElementById("demo")
    demoP.innerHTML = "x=" + x;
  }
</script>

尝试一下 »

<p>设置 x=10 和 y=5, 计算 x+=y, 并显示结果。</p>
<button onclick="myFunction()">点我</button>
<p id="demo"></p>
<script>
  function myFunction() {
    var x = 10;
    var y = 5;
    x += y;
    var demoP = document.getElementById("demo")
    demoP.innerHTML = "x=" + x;
  }
</script>

尝试一下 »

<p>设置 x=10 和 y=5, 计算 x-=y, 并显示结果。</p>
<button onclick="myFunction()">点我</button>
<p id="demo"></p>
<script>
  function myFunction() {
    var x = 10;
    var y = 5;
    x -= y;
    var demoP = document.getElementById("demo")
    demoP.innerHTML = "x=" + x;
  }
</script>

尝试一下 »

<p>设置 x=10 和 y=5, 计算 x*=y, 并显示结果。</p>
<button onclick="myFunction()">点我</button>
<p id="demo"></p>
<script>
  function myFunction() {
    var x = 10;
    var y = 5;
    x *= y;
    var demoP = document.getElementById("demo")
    demoP.innerHTML = "x=" + x;
  }
</script>

尝试一下 »

<p>设置 x=10 和 y=5, 计算 x/=y, 并显示结果。</p>
<button onclick="myFunction()">点我</button>
<p id="demo"></p>
<script>
  function myFunction() {
    var x = 10;
    var y = 5;
    x /= y;
    var demoP = document.getElementById("demo");
    demoP.innerHTML = "x=" + x;
  }
</script>

尝试一下 »

<p>设置 x=10 和 y=5, 计算 x%=y, 并显示结果。</p>
<button onclick="myFunction()">点我</button>
<p id="demo"></p>
<script>
  function myFunction() {
    var x = 10;
    var y = 5;
    x %= y;
    var demoP = document.getElementById("demo")
    demoP.innerHTML = "x=" + x;
  }
</script>

尝试一下 »

运算符	例子	等同于	运算结果	在线实例
=	x=y		x=5	实例 »
+=	x+=y	x=x+y	x=15	实例 »
-=	x-=y	x=x-y	x=5	实例 »
*=	x*=y	x=x*y	x=50	实例 »
/=	x/=y	x=x/y	x=2	实例 »
%=	x%=y	x=x%y	x=0	实例 »

---

用于字符串的 + 运算符

+ 运算符用于把文本值或字符串变量加起来（连接起来）。

如需把两个或多个字符串变量连接起来，请使用 + 运算符。

txt3 运算结果如下:

<p>点击按钮创建及增加字符串变量。</p>
<button onclick="myFunction()">点击这里</button>
<p id="demo"></p>
<script>
  function myFunction() {
    txt1 = "What a very";
    txt2 = "nice day";
    txt3 = txt1 + txt2;
    document.getElementById("demo").innerHTML = txt3;
  }
</script>

尝试一下 »

要想在两个字符串之间增加空格，需要把空格插入一个字符串之中：

在以上语句执行后，变量 txt3包含的值是：

<p>点击按钮创建及增加字符串变量。</p>
<button onclick="myFunction()">点击这里</button>
<p id="demo"></p>
<script>
  function myFunction() {
    txt1 = "What a very ";
    txt2 = "nice day";
    txt3 = txt1 + txt2;
    document.getElementById("demo").innerHTML = txt3;
  }
</script>

尝试一下 »

或者把空格插入表达式中：:

在以上语句执行后，变量txt3 包含的值是：

<p>点击按钮创建及增加字符串变量。</p>
<button onclick="myFunction()">点击这里</button>
<p id="demo"></p>
<script>
  function myFunction() {
    txt1 = "What a very";
    txt2 = "nice day";
    txt3 = txt1 + " " + txt2;
    document.getElementById("demo").innerHTML = txt3;
  }
</script>

尝试一下 »

---

对字符串和数字进行加法运算

两个数字相加，返回数字相加的和，如果数字与字符串相加，返回字符串，如下实例：

x,y, 和 z 输出结果为:

<p>点击按钮创建及增加字符串变量。</p>
<button onclick="myFunction()">点击这里</button>
<p id="demo"></p>
<script>
  function myFunction() {
    var x = 5 + 5;
    var y = "5" + 5;
    var z = "Hello" + 5;
    var demoP = document.getElementById("demo");
    demoP.innerHTML = x + "<br>" + y + "<br>" + z;
  }
</script>

尝试一下 »

规则:如果把数字与字符串相加，结果将成为字符串！