JavaScript运算符控制语句

运算符

运算符有很多分类，比如：
算数运算符
自增运算符
逻辑运算符
赋值运算符
关系运算符
三元运算符
条件运算符

操作符

1.算数运算符 (返回值为number类型)

  +  -  *  /  %    加、减、乘、除、取余

2.一元运算符

  ++  、 --  、+  、 -

  ++a，对于a，先自增，再运算

  a++，对于a，先运算，再自增
  正号 +

（1）正号不会对数字产生任何影响。比如说，2和+2是一样的。

（2）我们可以对一个其他的数据类型使用+，来将其转换为number【小技巧】。比如：

var a = true;
a = +a;   // 注意这行代码的一元运算符操作
console.log('a：' + a);
console.log(typeof a);

​
console.log(’-----------------’);
​
var b = ‘18’;
b = +b; // 注意这行代码的一元运算符操作
console.log(‘b：’ + b);
console.log(typeof b);
负号 -
负号可以对数字进行取反。

自增和自减
自增 ++
自增分成两种：a++和++a。

（1）对于一个变量自增以后，原变量的值会立即自增1。也就是说，无论是 a++ 还是++a，都会立即使原变量的值自增1。

（2）我们要注意的是：a是变量，而a++和++a是表达式。

那这两种自增，有啥区别呢？区别是：a++ 和 ++a的值不同：（也就是说，表达式的值不同）

a++的值等于原变量的值（a自增前的值）
++a的值等于新值 （a自增后的值）
自减 –
原理同上。

代码举例

    var n1=10;
    var n2=20;
​
    var n = n1++; //n1 = 11  n1++ = 10
​
    console.log('n='+n);  // 10
    console.log('n1='+n1); //11
​
    n = ++n1
     //n1 = 12  ++n1 =12
    console.log('n='+n); //12
    console.log('n1='+n1); //12
​
    n = n2--;
    // n2=19 n2--=20
    console.log('n='+n); //20
    console.log('n2='+n2); //19
​
    n = --n2; //n2=18 --n2 = 18
    console.log('n='+n); //18
    console.log('n2='+n2); //18

3.比较运算符 （返回值为boolean类型）

 ==  直接比较值
     var  a = 12;

     var  b = '12';

     console.log(a == b)

 输出结果为  true

===  先比较数据类型，再比较值
     var  a = 12;

     var  b = '12';

     console.log(a ===b)

 输出结果为  false
 关系（比较）运算符

通过关系运算符可以比较两个值之间的大小关系，如果关系成立它会返回true，如果关系不成立则返回false。

关系运算符有很多种，比如：

>   大于号
<   小于号
>=  大于或等于
<=  小于或等于
==  等于
=== 全等于
!=  不等于
!== 不全等于

关系运算符，得到的结果都是布尔值：要么是true，要么是false。

举例如下：

var result = 5 > 10; // false
非数值的比较
（1）对于非数值进行比较时，会将其转换为数字然后再比较。

举例如下：

console.log(1 > true); //false
console.log(1 >= true); //true
console.log(1 > "0"); //true

​
//console.log(10 > null); //true
​
//任何值和NaN做任何比较都是false
​
console.log(10 <= “hello”); //false
console.log(true > false); //true
​
如果符号两侧的值都是字符串时，不会将其转换为数字进行比较。比较两个字符串时，比较的是字符串的Unicode编码。

比较字符编码时，是一位一位进行比较。如果两位一样，则比较下一位，所以借用它可以来对英文进行排序。

PS：所以说，当你尝试去比较"123"和"56"这两个字符串时，你会发现，字符串"56"竟然比字符串"123"要大。也就是说，下面这样代码的打印结果，其实是true:（这个我们一定要注意，在日常开发中，很容易忽视）

// 比较两个字符串时，比较的是字符串的字符编码，所以可能会得到不可预期的结果
console.log(“56” > “123”); // true
因此：当我们在比较两个字符串型的数字时，一定一定要先转型，比如 parseInt()。

（3）任何值和NaN做任何比较都是false。

符号的强调
注意这个符号，它是判断是否等于，而不是赋值。

（1）==这个符号，还可以验证字符串是否相同。例如：

console.log("我爱你中国" == "我爱你中国");        //输出结果为true

（2）==这个符号并不严谨，会将不同类型的东西，转为相同类型进行比较（大部分情况下，都是转换为数字）。例如：

console.log("6" == 6);      // 打印结果：true。这里的字符串"6"会先转换为数字6，然后再进行比较
console.log(true == "1");   // 打印结果：true
console.log(0 == -0);       // 打印结果：true

​
console.log(null == 0); // 打印结果：false
（3）undefined 衍生自 null，所以这两个值做相等判断时，会返回true。

console.log(undefined == null); //打印结果：true。
（4）NaN不和任何值相等，包括他本身。

console.log(NaN == NaN); //false
问题：那如果我想判断 b的值是否为NaN，该怎么办呢？

答案：可以通过isNaN()函数来判断一个值是否是NaN。举例：

console.log(isNaN(b)); //false
如上方代码所示，如果 b 为 NaN，则返回true；否则返回false。

全等不会做类型转换。例如：

console.log("6" === 6);     //false
console.log(6 === 6);       //true

上述内容分析出：
例如：

console.log(3 != 8);    //true
console.log(3 != "3");  //false，因为3=="3"是true，所以反过来就是false。
console.log(3 !== "3"); //true，应为3==="3"是false，所以反过来是true。

4.逻辑运算符

 &&（并且）  同真则在，有假则假
     a && b

     若 a 为真，返回 b

     若 a 为假，返回 a

  || （或者） 同假则假，有真则真
     a && b

     若 a 为真，返回 a

     若 a 为假，返回 b

 ！ 非

举例1：

console.log(3 < 2 && 2 < 4);

输出结果为false。

举例2：（判断一个人的年龄是否在18~60岁之间）

var a = prompt("请输入您的年龄");
alert(a>=18 && a<= 65);

上面的这个a>=18 && a<= 65千万别想当然的写成18<= a <= 65，没有这种语法。

（1）能参与逻辑运算的，都是布尔值。

（2）JS中的&&属于短路的与，如果第一个值为false，则不会看第二个值。举例：

//第一个值为true，会检查第二个值
true && alert("看我出不出来！！");  // 可以弹出 alert 框

​
//第一个值为false，不会检查第二个值
false && alert(“看我出不出来！！”); // 不会弹出 alert 框
（3）JS中的||属于短路的或，如果第一个值为true，则不会看第二个值。举例：

（4）如果对非布尔值进行逻辑运算，则会先将其转换为布尔值，然后再操作。举例：

var a = 10;
a = !a;

​
console.log(a); // false
console.log(typeof a); // boolean
上面的例子，我们可以看到，对非布尔值进行!操作之后，返回结果为布尔值。

5.三目运算符

 a ? b : c

 若 a 为真，则返回值为 b ；

 若 a 为假，则返回值为 c

三元运算符
三元运算符也叫条件运算符。

语法：

条件表达式?语句1:语句2;
执行的流程：

条件运算符在执行时，首先对条件表达式进行求值：

如果该值为true，则执行语句1，并返回执行结果
如果该值为false，则执行语句2，并返回执行结果
如果条件的表达式的求值结果是一个非布尔值，会将其转换为布尔值然后再运算。
6.赋值运算符 （返回值为undefined类型）

=

a = 12；

将12赋值给 a
赋值运算符

可以将符号右侧的值赋值给符号左侧的变量。

举例：

+=。a += 5 等价于 a = a + 5
-=。a -= 5 等价于 a = a - 5
*=。a *= 5 等价于 a = a * 5
/=。a /= 5 等价于 a = a / 5
%=。a %= 5 等价于 a = a % 5

7.字符串拼接符 （返回值为string类型）

+

乘方
如果想计算 a 的 b 次方，可以使用如下函数：

Math.pow(a, b);

Math的中文是“数学”，pow是“power 幂”。

举例1：

代码实现：

var a = Math.pow(3, Math.pow(2, 2));
console.log(a);

举例2：

代码实现：

var a = Math.pow(Math.pow(3, 2), 4);
console.log(a);

开方
如果想计算数值a的开二次方，可以使用如下函数：

 Math.sqrt(a);

sqrt即“square 开方”。比如：

var a = Math.sqrt(36);

​

非布尔值的与或运算【重要】

非布尔值进行与或运算时，
会先将其转换为布尔值，然后再运算，
但返回结果是原值。比如说：

var result = 5 && 6; // 运算过程：true && true;
console.log('result：' + result); // 打印结果：6（也就是说最后面的那个值。）

，返回结果是哪个原值呢？我们来看一下。

与运算的返回结果：（以两个非布尔值的运算为例）

如果第一个值为true，则必然返回第二个值（所以说，如果所有的值都为true，则返回的是最后一个值）
如果第一个值为false，则直接返回第一个值
或运算的返回结果：（以两个非布尔值的运算为例）

如果第一个值为true，则直接返回第一个值
如果第一个值为false，则返回第二个值
流程控制语句
在一个程序执行的过程中，各条语句的执行顺序对程序的结果是有直接影响的。所以，我们必须清楚每条语句的执行流程。而且，很多时候我们要通过控制语句的执行顺序来实现我们要完成的功能。

if语句
if语句有以下三种。

1、条件判断语句
条件成立才执行。如果条件不成立，那就什么都不做。

格式：

    if (条件表达式) {
        // 条件为真时，做的事情
​
    }
2、条件分支语句
格式1：

    if (条件表达式) {
        // 条件为真时，做的事情
​
    } else {
        // 条件为假时，做的事情
​
    }
格式：（多分支的if语句）

    if (条件表达式1) {
        // 条件1为真时，做的事情
​
    } else if (条件表达式2) {
        // 条件1不满足，条件2满足时，做的事情
​
    } else if (条件表达式3) {
        // 条件1、2不满足，条件3满足时，做的事情
​
    } else {
        // 条件1、2、3都不满足时，做的事情
    }
以上所有的语句体中，只执行其中一个。

switch语句（条件分支语句）
switch语句也叫条件分支语句。

格式：

switch(表达式) {
    case 值1：
        语句体1;
        break;
​
    case 值2：
        语句体2;
        break;
​
    ...
    ...
​
    default：
        语句体 n+1;
        break;
}
switch语句的执行流程

执行流程如下：

（1）首先，计算出表达式的值，和case依次比较，一旦有对应的值，就会执行相应的语句，在执行的过程中，遇到break就会结束。

（2）然后，如果所有的case都和表达式的值不匹配，就会执行default语句体部分。

switch 语句的结束条件
情况a：遇到break就结束，而不是遇到default就结束。（因为break在此处的作用就是退出switch语句）
情况b：执行到程序的末尾就结束。

case穿透的问题
switch 语句中的break可以省略，但一般不建议。否则结果可能不是你想要的，会出现一个现象：case穿透。

举例1：（case穿透的情况）

    var num = 4;
​
    //switch判断语句
    switch (num) {
        case 1:
            console.log("星期一");
            break;
        case 2:
            console.log("星期二");
            break;
        case 3:
            console.log("星期三");
            break;
        case 4:
            console.log("星期四");
        //break;
        case 5:
            console.log("星期五");
        //break;
        case 6:
            console.log("星期六");
            break;
        case 7:
            console.log("星期日");
            break;
        default:
            console.log("你输入的数据有误");
            break;
    }
​
上方代码的运行结果，可能会令你感到意外：

星期四
星期五
星期六
上方代码的解释：因为在case 4和case 5中都没有break，那语句走到case 6的break才会停止。

举例2：

    //switch判断语句
    var number = 5;
​
    switch (number) {
        default:
            console.log("我是defaul语句");
            // break;
        case (2):
            console.log("第二个:" + number);
            //break;
        case (3):
            console.log("第三个:" + number);
            break;
        case (4):
            console.log("第四个:" + number);
            break;
    }
​
上方代码的运行结果，你也许会意外：

我是defaul语句
第二个:5
第三个:5
上方代码的解释：代码走到 default 时，因为没有遇到 break，所以会继续往下走，直到遇见 break 或者走到程序的末尾。 从这个例子可以看出：switch 语句的结束与 default 的顺序无关。

for循环
for循环的语法
语法：

for(①初始化表达式; ②条件表达式; ④更新表达式){
    ③语句...
}

执行流程：

①执行初始化表达式，初始化变量（初始化表达式只会执行一次）

​
②执行条件表达式，判断是否执行循环：
如果为true，则执行循环③
如果为false，终止循环
​
④执行更新表达式，更新表达式执行完毕继续重复②

for循环举例：

for (var i = 1; i <= 100; i++) {
    console.log(i);
}

上方代码的解释：

for循环举例
for (var i = 1; i < 13; i = i + 4) {
console.log(i);
}

：1、5、9

for (var i = 1; i < 10; i = i + 3) {
    i = i + 1;
    console.log(i);
}

输出结果：2、6、10

题目2：

for (var i = 1; i <= 10; i++) {

​
}
console.log(i);
输出结果：11

题目3：

for(var i = 1; i < 7; i = i + 3){

​
}
console.log(i);
输出结果：7

题目4：

for (var i = 1; i > 0; i++) {
    console.log(i);
}

死循环。

while循环语句
while循环
语法：

while(条件表达式){
语句…
}
执行流程：

while语句在执行时，先对条件表达式进行求值判断：
​
如果值为true，则执行循环体：
循环体执行完毕以后，继续对表达式进行判断
如果为true，则继续执行循环体，以此类推
​
如果值为false，则终止循环
如果有必要的话，我们可以使用 break 来终止循环。

do…while循环
语法：

do{
    语句...
}while(条件表达式)

​
执行流程：

do...while语句在执行时，会先执行循环体：

​
循环体执行完毕以后，在对while后的条件表达式进行判断：
如果结果为true，则继续执行循环体，执行完毕继续判断以此类推
如果结果为false，则终止循环
​
​
while循环和 do…while循环的区别
这两个语句的功能类似，不同的是：

while是先判断后执行，而do…while是先执行后判断。
也就是说，do…while可以保证循环体至少执行一次，而while不能。

break 和 continue

break
break可以用来退出switch语句或整个循环语句（循环语句包括for、while。不包括if。if里不能用 break 和 continue，否则会报错）。
break会立即终止离它最近的那个循环语句。
可以为循环语句创建一个label，来标识当前的循环（格式：label:循环语句）。使用break语句时，可以在break后跟着一个label，这样break将会结束指定的循环，而不是最近的。
举例1：通过 break 终止循环语句

for (var i = 0; i < 5; i++) {
    console.log('i的值:' + i);
    if (i == 2) {
        break;  // 注意，虽然在 if 里 使用了 break，但这里的 break 是服务于外面的 for 循环。
    }
}

​
打印结果：

i的值:0
i的值:1
i的值:2
举例2：label的使用

outer:
for (var i = 0; i < 5; i++) {
    console.log("外层循环 i 的值：" + i)
    for (var j = 0; j < 5; j++) {
        break outer; // 直接跳出outer所在的外层循环（这个outer是我自定义的label）
        console.log("内层循环 j 的值:" + j);
    }
}

​
打印结果：

外层循环 i 的值：0

continue
continue可以用来跳过当次循环。
同样，continue默认只会离他最近的循环起作用。