JS基础语法：判断、字符串拼接、数据类型检测、循环（4）

JS中的判断操作语句

1、if / else if / else

var num = -6;
if(num>10){
    num++; //=>num=num+1 num+=1 在自身的基础上累加1
}else if(num>=0 && num<=10){
    num--;
}else{
    num+=2;
}
console.log(num); //=>-4

只要有一个条件成立，后面不管是否还有成立的条件，都不在判断执行了

var num = 10;
if(num>5){
    num+=2;
}else if(num>8){
    num+=3;
}else{
    num+=4;
}
console.log(num); //=>12

关于条件可以怎么写？

// >= / <= / == 常规比较
if(0){
    //=>不管你在条件判断中写什么，最后总要把其计算出TRUE/FALSE来判断条件是否成立（把其它类型的值转换为布尔类型，只有 0/NaN/''/null/undefined 是false，其余都是true）
}
​
if('3px'+3){
    //=>在JS中，+ - * / % 都是数学运算，除 + 以外，其余运算符在运算的时候，如果遇到了非数字类型的值，首先会转换为数字类型（Number），然后再进行运算
    
    //=>+ 在JS中除了数学相加，还有字符串拼接的作用（如果运算中遇到了字符串，则为字符串拼接，而不是数学相加）
​
    '3px'+3 =>'3px3'

    //特殊 {}+'str'=>NaN
}
if('3px'-3){
    '3px'-3 =>NaN
}

BAT面试题：

var num = parseInt('width:35.5px');
if(num==35.5){
    alert(0);
}else if(num==35){
    alert(1);
}else if(num==NaN){
    alert(2);
}else if(typeof num=='number'){
    //=>先算typeof num
    //=>在做比较
    alert(3);//=>alert输出的是字符串格式的 '3'
}else{
    alert(4);
}

typeof

在JS中用来检测数据类型的方式之一，除了它以外，还有：

• instanceof

• constructor

• Object.prototype.toString.call()

语法：typeof [value] =>检测value的数据类型
​
返回值：使用typeof检测出来的结果是一个字符串，字符串中包含着对应的数据类型，例如："number"/"string"/"boolen"/"undefined"/"object"/"function"
 
typeof null =>"object" 因为null代表空对象指针（没有指向任何的内存空间）
​
typeof检测数组/正则/对象，最后返回的都是"object"，也就是基于这种方式无法细分对象

面试题：
console.log(typeof []); 
//=>"object"
​
console.log(typeof typeof []); 
//=>typeof "object"
//=>"string"

2、三元运算符

语法：条件?成立做的事情:不成立做的事情; <=>相当于简单的if/else判断

var num=12;
if(num>10){
    num++;
}else{
    num--;
}
//=>改写成三元运算符
num>10?num++:num--;

特殊情况

//=>如果三元运算符中的某一部分不需要做任何的处理，我们用 null/undeifned/void 0... 占位即可
var num = 12;
num>10?num++:null;
​
//=>如果需要执行多项操作，我们把其用小括号包裹起来，每条操作语句用逗号分隔
num=10;
num>=10?(num++,num*=10):null;

思考题

var num = 12;
if(num>0){
    if(num<10){
        num++;
    }else{
        num--;
    }
}else{
    if(num==0){
        num++;
        num=num/10;
    }
}
//改写成三元运算符！
num>0?(num<10?num++:num--):num==0?(num++,num=num/10,console.log(num)):null;

3、switch case

JS中的一种判断方式

var num = '10';
if(num==10){
    num++;
}else if(num==5){
    num--;
}else{
    num=0;
}
​
/*
//=>n++ 和 n=n+1 一样吗？
var n = '10';
// n = n + 1;//=>属于字符串拼接，结果是 '101'
n++;//=>此时这种写法还是数学运算，不是字符串拼接，结果是 11
console.log(n);
*/

//=>改成switch case
switch(num){
    case 10:
        num++;
        break;
    case 5:
        num--;
        break;
    default:
        num=0;  
}
//=>switch case 应用于变量（或者表达式等）在不同值情况下的不同操作，每一种case结束后都要加break（结束整个判断）

var num = 10;
switch (num) {
    case 10:
    case 5:
        num--;
        break;
    default:
        num = 0;
}
console.log(num); //=>9
//=>不加BREAK，后面的条件不管是否成立，都会被执行；利用此机制，我们可以完成一些特殊的处理，例如：如果num等于10和等于5都要做同一件事情，那么我们写在一起，不用加break即可

switch case中每一种case情况的比较都是基于"==="绝对相等来完成的

'10'==10 
=>true 相等比较,如果等号左右两边的类型不一样，首先会转换为一样的数据类型，然后再进行比较
=>当前案例中，就是把字符串'10'转换为数字了，然后再比较的
​
'10'===10 绝对比较，如果两边的数据类型不一样，则直接不相等，它要求类型和值都完全一样才会相等（真实项目中为了保证代码的严谨性，我们应该更多使用绝对比较）

FOR循环

作用：按照一定的规律，重复去做某件事情，此时我们就需要使用循环来处理了

/*

 * FOR循环的语法组成

 *  1. 定义初始值  var i = 0

 *  2. 设定循环成立的条件（条件成立循环继续,不成立循环结束） i < ary.length

 *  3. 条件成立会执行循环体中的内容（大括号包裹的就是循环体）

 *  4. 执行步长累加的操作

 */

var ary = [12, 23, 34];

//=>输出每一项：倒着输出  34 23 12
//=>ary.length-1：当前数组中最后一项的属性名(索引)
/*
for (var i = ary.length - 1; i >= 0; i--) {
    console.log(ary[i]);
}
*/

//=>输出数组中的内容：输出奇数项的内容
/*for (var i = 0; i < ary.length; i++) {
    /!*i=0 第一项 奇数项
    i=1 第二项 偶数项
    i=2 第三项 奇数项
    索引为偶数，代表的是奇数项,如何判断当前i的值是奇数还是偶数？
    12%5:%称为模，用12除以5取余数*!/
    if (i % 2 === 0) {
        console.log(ary[i]);
    }
}*/
for (var i = 0; i < ary.length; i += 2) {
    console.log(ary[i]);
}

/*
 * 在FOR循环的循环体中，经常出现两个常用的关键字：
 *   1. continue：继续
 *   2. break：中断或者结束
 */
/*
for (var i = 0; i < 10; i++) {
    if (i < 5) {
        i++;
        continue;//=>结束本轮循环（循环体中continue后面代码将不再执行），继续执行下一轮循环
    }
    if (i > 7) {
        i += 2;
        break;//=>强制结束整个循环，不做任何的处理
    }
    i += 1;
}
console.log(i);//=>10 */

for (var i = 1; i <= 10; i += 2) {
    if (i <= 5) {
        i++;
        continue;
    } else {
        i -= 2;
        break;
    }
    i--;
    console.log(i);
}
console.log(i);//=>5