Web前端之JS概述、函数和数组（3）——逻辑结构

一、复习

1. 原始类型和引用类型
（1） 数值型 21 2.1e9
（2）字符串型 ‘1’ charCodeAt()
（3）布尔型 true/false
（4）未定义型 undefined
（5）空 null
2.typeof
（1）隐式转换
数值+字符串 数值+布尔型 布尔型+字符串
- * / 转数值 自动调用Number
（2） 强制转换

Number()  true/false  1/0
parseInt()/parseFloat()/toString()

3.运算符
算术运算符 + - * / % ++ –
比较运算符 > < >= <= == != === !==
逻辑运算符 || && !
位运算符 & | ^ >> <<
赋值运算符 = += -= *= /= %=

4.学习一门编程语言的基本步骤
(1)了解背景知识：历史、现状、特点、应用场景
(2)搭建开发环境：编写hello world
(3)变量和常量
(4)数据类型
(5)运算符
(6)逻辑结构
(7)通用小程序
(8)函数和对象
(9)第三方库、框架
(10)实用的项目

二、逻辑结构

1.运算符——三目运算符
由三个运算数或表达式组成的结构

条件表达式 ? 表达式1 : 表达式2

如果条件表达式为true，执行表达式1；
如果条件表达式为false，执行表达式2；
2.两个浏览器端函数

 alert()  弹出警示框
 prompt()  弹出提示(输入)框，输入的值是**字符串类型**

3.流程控制
程序=数据+算法
程序分为顺序执行、选择执行、循环执行
(1)if语句

语句1;
 if(条件表达式){
   语句2;
 }
 语句3;

①执行语句1
②如果条件表达式为true，执行语句2
③执行语句3

(2)if-else语句

语句1;
if(条件表达式){
  语句2;
}else{
  语句3;
}
语句4;

执行过程：
①执行语句1
②执行条件表达式，如果是true，执行语句2；如果是false，执行语句3
③执行语句4；

练习1：声明变量保存成绩，如果超过60分，打印及格；否则打印不及格。
练习2：声明两个变量存储账号和密码，如果账号是root，并且密码是123456，打印登录成功；否则打印登录失败。
练习3：使用弹出提示框分别输入商品的价格和数量，如果总价满500打九折，打印应付金额；使用变量存储当前会员卡的余额，如果余额足够支付，打印支付成功，否则打印余额不足。

//弹出提示框输入单价和数量
var price=prompt('input price');//string
var count=prompt('input count');//string
//计算总价
//乘号的两端自动转成了数值型
var total=price*count;//number
//总价满500打九折
if(total>=500){
  total*=0.9;
}
console.log(total);
//声明变量，存储会员卡余额
var money=300;
//支付环节
//判断余额是否大于等于商品总价
if(money>=total)
  console.log('pay success');
else
  console.log('pay error');

如果if和else后的大括号中只有一行代码，则大括号可以省略

if(score>=60)  console.log('及格');

条件表达式中几个特殊的情况 undefined、null、0、’’、NaN 在条件表达式中都表示false

(3)if-else嵌套
用于判断多种情况

语句0;
if(条件表达式1){
  语句1;
}else if(条件表达式2){
  语句2;
}else ... if(条件表达式n){
  语句n;
}else{
  语句n+1;  //以上所有的条件表达式均为false
}

执行过程：
①执行语句0
②执行条件表达式1
如果条件表达式1为true，执行语句1
如果条件表达式1为false，执行条件表达式2
如果条件表达式2为true，执行语句2
如果条件表达式2为false，执行条件表达式n
③如果以上所有的条件表达式都为false，执行语句n+1
(4)switch-case
和if-else类似，是一种特殊的多项分支语句
语句0;

switch(表达式){
  case 1:    //如果表达式的值为1
    语句1....
    break;
  ...
  case n:
    语句n...
    break;
  default:
    语句n+1;  //以上所有的条件都是false
}

说明：表达式和case中的值比较的时候使用的是全等于(===)。
对比if-else嵌套和switch-case语句
相同点：两者都可以用于多项分支语句
不同点：if-else既可以判断相等，又可以判断不相等，适用范围比较广；switch-case只适用于全等的情况，在结构上更为清晰合理，执行效率相对比较高。

2.循环执行
循环：就是一遍又一遍执行相同或者相似的代码

循环的两个要素
循环的条件：控制循环的次数
循环体：重复执行的相同或者相似代码

while循环:

while(循环条件){
  循环体
}

三、课后任务：

1.复习今天内容，整理思维导图
2.练习：
使用switch-case判断一个人的成绩标准（分数/10,取整）
100
90~100以下
80~90以下 …
使用循环打印 10~1
使用循环打印 20 22 24 26 28 30

   //练习1：使用switch-case判断一个人的成绩标准（分数/10,取整）
    var score=68;
    //100     10
    //90~99   9
    //80~89   8
    //70~79   除以10取整  7
    //60~69   6
    score=parseInt(score/10);
    //console.log(score);
    switch(score){
      case 10: 
      //没有加break，自动往后执行，遇到break停止
      case 9:
    	console.log('优秀');
        break;
      case 8:
    	console.log('良好');
        break;
      case 7:
    	console.log('中等');
        break;
      case 6:
    	console.log('及格');
        break;
      default:
    	console.log('不及格');
    }
    //使用循环打印 10~1
    //初始值10，循环条件大于等于1；每次循环减1
    /*
    var i=10;
    while(i>=1){
      console.log(i);
      i--;
    }
    */
    //使用循环打印 20  22  24  26  28  30
    //初始值20，循环条件小于等于30，每次循环加2
    /*var i=20;
    while(i<=30){
      console.log(i);
      i+=2;
    }
    */
    //打印1~100之间的奇数
    //奇数：和2取余结果为1
    //初始值1，循环条件<=100，每次循环后加1
    /*
    var i=1;
    while(i<=100){
      //循环体
      //打印奇数
      if(i%2==1){//判断是否为奇数
    	console.log(i);
      }
      i++;
    }
    */
    //练习：计算1~100之间所有整数的和
    //产生1~100所有的整数
    var i=1;
    //存储所有的整数的和,初始化为0
    var sum=0;
    while(i<=100){
      //i表示1~100所有整数
      //把i加入到sum中
      sum+=i;
      //每次加一个数字，就打印一次
      //console.log(sum);
      i++;
    }
    //只是打印最终的结果
    console.log(sum);
    //练习：计算1~100所有能被3整除的数字的和
    //获取所有能被3整除的数字
    //把获取的这些数字加入到sum中
    var i=1;
    var sum=0;
    while(i<=100){
      //判断是否满足能被3整除
      if(i%3==0){
    	//i表示所有能被3整除的数
        //console.log(i);
    	//把所有能被3整除的数加到sum中
    	sum+=i;
      }
      i++;
    }
    console.log(sum);

(3)预习do-while、for循环

程序员必做50题
https://wenku.baidu.com/view/af66e2f14afe04a1b071de42.html