一。if else 语句

 

if else用来表示中文里的 如果…， 就…， 否则……

 

// 条件为true, 执行if后面的括号代码， 否则执行 else 后面括号代码

 

if（条件） {

 

// todo

 

}else{

 

// todo

 

}

 

// 多重判断

 

if（）{

 

} else if（） {

 

} else {

 

}

 

具体例子

 

<script>

 

   var a = 100;

 

   var b = 20;

 

   debugger;

 

   if （a > b） {

 

      console.log（'a 大于 b'）;

 

   } else {

 

      console.log（'a 小于 b'）;

 

   } 

 

</script>

 

<!-- 多重判断 -->

 

<script>

 

   var gender = prompt（'请输入性别'）;

 

   if （gender === '男'） {

 

      alert（'你是个男的'）;

 

   } else if（gender === '女'） {

 

      alert（'你是个妹子'）;

 

   } else {

 

      alert（'性别未知'）;

 

   }

 

</script>

 

二。类型转换

 

【腾讯文档】05-类型转换-备课​​​​​​

 

问题： 以下代码会打印什么

 

<script>

 

   var a = 'aa';

 

   var b = 'bb';

 

   if （a+b） {

 

      console.log（'xxxxxxx'）;

 

   } else {

 

      console.log（'yyyyyyyy'）;

 

   } 

 

</script>

 

1.显式转换

 

1.Number（变量名）将其他类型转为数字//快捷方式  变量名*1

 

2.String（变量名）；转字符串// 变量名+ ‘’

 

3.Boolean（变量名）；//!!变量名

 

<script>

 

    var str = '123';

 

    // 转换为数字

 

    var num = Number（str）;

 

    console.log（num）;

 

    console.log（typeof num）;

 

    // 结果为NaN

 

    var str2 = 'abcd';

 

    var num2 = Number（str2）;

 

    console.log（num2）;

 

    //结果为0

 

    var str3 = '';

 

    var num3 = Number（str3）;

 

    console.log（num3）; 

 

 </script>

 

2.隐式转换

 

<script>

 

   var a = 'aa';

 

   var b = 'bb';

 

    // a+b => aabb aabb会自动转换为true, 所以执行结果为 xxxxxx

 

   if （a+b） {

 

      console.log（'xxxxxxx'）;

 

   } else {

 

      console.log（'yyyyyyyy'）;

 

   } 

 

</script>

 

3.数据类型转换规则

 

【腾讯文档】类型转换规则 腾讯文档

 

三。运算符

 

【腾讯文档】js运算符思维导图 腾讯文档

 

1.算术运算

 

1.+-*/

 

2.相加的生活，有一个数为字符串，则+表示字符串拼接

 

<script>

 

    var a = 20;

 

    var b = 7;

 

    var num1 = a+b;

 

    var num2 = a-b;

 

    var num3 = a*b;

 

    var num4 = a/b;

 

    // 计算余数

 

    var num5 = a % b; 

 

    console.log（num1）;

 

    console.log（num2）;

 

    console.log（num3）;

 

    console.log（num4）;

 

    console.log（num5）; 

 

</script> 

 

<script>

 

  // 有一个数为字符串， 则+表示字符串拼接  

 

  var a = 100;

 

  var b = prompt（'请输入数字'）;

 

  console.log（typeof b）;

 

  console.log（a+Number（b））;

 

</script>  

 

2.关系运算符（比较运算符）

 

var a = 10;

 

var b = '10';

 

console.log（a == b）; // true,类型不同， 先转换成相同类型

 

console.log（a === b）; // false, 类型不同为false, 类型相同再判断值是否相同

 

3.逻辑运算符

 

1.逻辑非！，取反即可

 

var boo1 = false;  // !boo1 => true  !!bool 

 

var num = 100; //  !num => false

 

var str = ''; // !str => true

 

var obj = null; // !obj => true

 

var username; // !username => true

 

2.逻辑与&&：中文里并且的意思

 

        规律：前者为true取后者，否则取前者

 

        当都是布尔的时候，只有当俩者为true时结果为true，否则为false。

 

// 计算以下式子的值（参与运算的都是布尔类型）

 

true && true => true

 

true && false => false

 

false && true => false

 

false && false =>   false

 

// 计算以下式子的值（参与运算的是其他类型）

 

var num1 = 100;

 

var num2 = 0;

 

num1 && num2 => 0

 

num2 && num1 => 0

 

var a = 'web';

 

var b; 

 

a && c =>  // 报错，计算的结果为c, 而c没有声明

 

b && c =>   undefined

 

3.逻辑或||:中文里的或者意思

 

        规律：前者为true取前者，否则取后者

 

        当都是布尔的生活，只要有一个为true，结果皆为true，否则为false。

 

<script>

 

console.log（true || true ）;  // true

 

console.log（true || false ）;  // true

 

console.log（false || true ）; // true

 

console.log（false || false ）; // false

 

 var num1 = 100;

 

var num2 = 0;

 

console.log（num1 || num2 ）;  // 100

 

console.log（num2 || num1 ）;  // 100

 

var a = 'web';

 

var b; 

 

console.log（a || c ）;  // web

 

console.log（b || c ）; // 报错，计算的结果为c, 而c没有声明

 

</script>

 

4.一元计算符

 

i++，i先用原值运算，再自加1，后面要是有i它值为i+1；

 

++i，i先是给自己加1，再进行运算。

 

<!-- ++ 自加 -->

 

<script>

 

var i = 10;

 

var j = 20;

 

var i2 = 10 + i++;   // i先运算再自加1

 

console.log（'i2',i2）; // 20

 

console.log（'i',i）; // 11

 

var j2 = 10 + ++j; // j先自加1再运算

 

console.log（'j2',j2）; // 31

 

console.log（'j',j）;  // 21 

 

</script>

 

自减运算， 道理类似自加运算

 

<script>

 

var i = 10;

 

var j = 20;

 

var i2 = 10 + i--;   // i先运算在自减1

 

console.log（'i2',i2）; //  20

 

console.log（'i',i）; //  9

 

var j2 = 10 + --j; // j先自减1再运算

 

console.log（'j2',j2）; //  29

 

console.log（'j',j）;  //  19

 

</script>

 

练习：

 

<!-- 练习1 -->

 

<script>

 

var i = 10; 

 

var i2 = 10 + i++; // i=10 i2=20

 

var i3 = 10+ ++i; // i=12 i3=22

 

var i4 = 10 + i--; // i=11 i4=22   

 

var i5 = 10 + --i;  // i =10 i5=20   

 

// 求i,i2,i3,i4,i5的值

 

console.log（i,i2,i3,i4,i5）;

 

var count = 60; // 说出控制台打印的值

 

console.log（--count）;  // 59

 

console.log（--count）;  // 58

 

console.log（--count）;//57

 

console.log（--count）;//56

 

console.log（--count）; //55

 

</script>

 

<!-- 练习2 -->    

 

<script>

 

var i = 1;

 

var j = 1;

 

var a = 10;

 

// 11   10+ 1

 

var b = a + i++;

 

//     11+  3   + 3   + 2

 

var c = b + ++i + i++ + ++j;

 

var d = a + b + c;

 

// i=4 j=2 a=10,b=11, c=19 d=40

 

console.log（i,j,a,b,c,d）; 

 

</script>   

 

5.复合赋值运算符

 

<script>

 

var a = 10;

 

a += 10;  

 

console.log（a）; // 20

 

a -= 10;

 

console.log（a）; // 10

 

a *= 10;

 

console.log（a）; // 100

 

a /= 10;

 

console.log（a）; // 10

 

a %= 10;

 

console.log（a）; // 0 

 

</script>

 

6.运算符优先级

 

（） > 自加（自减） > 算术 > 关系 > 逻辑 > 赋值