流程控制
- 流程控制:我们想要实现一个复杂的效果,只简单的代码是肯定不行的,还要实现代码执行过程的控制;
- 生活:这种情况下,要做这件事;那种情况下,要做那件事;
- 程序:来源生活,高于生活;
表达式
- 特点:在js代码中,只要可以返回一个结果的,都可以称为一个表达式;
// 下面都可以称为表达式
a++; // a = a+1 ,
5 > 6; // 结果是 false
1+1;
- 技巧:在浏览器后台可以直接敲JS代码,回车返回的就是该表达式的结果;
- 各种数据类型的转化,各种数据参与的运算符,最后都会返回一个结果,都可以称为一个表达式;
语句
- 语句:可以理解为一个行为,一般在行为和行为之间,都会使用 ; 隔开。
- 行为:告诉浏览器,我要干什么,你按照我写的思路,给我实现出来给用户看;
- 可以理解为:语句,是有思维参与在里面的表达式,升级版的表达式;
- 语句有时候会有返回值,有时候就没有;更侧重是一个行为上的理解;
// 行为:输出了一个12+12这个表达式的结构 在控制台
console.log(12+12);
// 行为:弹出了个提示框
alert('helloworld');
- 简而言之:一个程序可以由多个语句组成,一个语句可以由多个表达式组成;
- 技巧:和上面一样,也可以在浏览器控制台打印语句;默认也会把语句的返回值显示出来;
结构
- 写程序,就是写各种语句的组织,归根到底,就是各种表达式参与我们的思维的体现;在写代码的结构表现上分为下面三种:
- 顺序结构:从上到下执行的代码就是顺序结构,程序默认就是由上到下顺序执行的;
- 分支结构:不同的情况下,走不同的分支;
- 循环结构:重复做一件事情,其作用就是用来重复执行代码的;
- 特点:重复,有规律的变化;
- 程序的世界中大量的逻辑就是 分支和循环 相互套用;
分支结构
- 作用:不同的条件,采取不同的行为;
if语句
- if结构:单个if结构,解决的一个分支的判断问题
// if语句:我想看条件表达式的结果成立时,会怎么样;
// 条件表达式:需要返回Boolean值;如果返回的不是Boolean值,就隐式转化为Boolean值;
if(true) {
// 当 条件表达式 的结果是 true 时 执行的代码
}
// 例如:判断一下一个人的性别是不是男的
var gender = prompt('请输入性别');
if(gender === '男'){
console.log('这是一个男人');
}
// 当输入的结果是 '男' 的时候,就会在控制台中输出消息,否则没有消息输出
if-else语句
- 通过 if 条件来决定,执行哪一个 {} 里面的代码
- 语法: if (条件) { 条件为 true 的时候执行 } else { 条件为 false 的时候执行 }
- 两个 {} 内的代码一定有一个会执行
if(条件表达式){
//当条件表达式的结果是 true 时执行的代码
}else {
//当条件表达式的结果是 false 时执行的代码
}
//例如: 判断一下一个人的性别是不是男的,如果是男的,让他去男厕所,否则去女厕所
// 当输入的结果是 '男' ,输出 男厕所,否则输出 女厕所
var gender = prompt('请输入性别');
if(gender === '男'){
console.log('请去男厕所');
}
else {
console.log('请去女厕所');
}
if-else-if语句
- 解决多分支的判断问题
// 当满足这个
if(条件表达式1){
//当条件表达式1的结果是 true 时执行的代码
}
else if(条件表达式2){
//当条件表达式2的结果是 true 时执行的代码
}
else if(条件表达式3){
//当条件表达式3的结果是 true 时执行的代码
}
// 中间可以继续写多个判断 ...
else {
// 多个条件表达式的结果都是 false 的时候执行的代码
}
//例如: 判断一下一个人的性别是不是男的,如果是男的,让他去男厕所,如果是女的,让他去女厕所,否则不让他上厕所
var gender = prompt('请输入性别');
if(gender === '男'){
console.log('请去男厕所');
}else if(gender === '女') {
console.log('请去女厕所');
}else {
console.log('你个不男不女的家伙,我们这里没有你能上的厕所,去别处吧');
}
- 案例:求两个数的最大值;
var num1 = prompt('请输入第一个数字');
var num2 = prompt('请输入第二个数字');
num1 = parseFloat(num1);
num2 = parseFloat(num2);
if(num1 < num2){
console.log('第一个数字比较大,他是:' + num1);
}
else if ( num1 === num2 ){
console.log('两个数字一样大');
}
else {
// 如果以上两个条件都不成立,就必然是num1 < num2了
console.log('第二个数字比较大,他是:' + num2);
}
switch-case语句
- 特点:用于多个固定值之间的判断,只能做固定值的判断
switch (要判断的变量) {
case 情况1:
情况1要执行的代码
break
case 情况2:
情况2要执行的代码
break
case 情况3:
情况3要执行的代码
break
default:
上述情况都不满足的时候执行的代码
}
-
非常规:这个结构里面的break并不是必须的,如果两个 case 之间没有break ,执行完了一个break 之后,会继续执行下面的case的代码;但是一般情况都是带着break的;
-
案例:输入星期几,看要做什么事情;
// 1.用户可以输入;用变量拿到用户的输入;
var info = prompt("请输入周:");
// 2.switch case 语法进行固定值比较;JS 提醒用户;
switch (info) {
case "一":
// 背后进行判断,===
alert("学习");
break;
case "二":
// 背后进行判断,===
alert("双11");
break;
case "三":
// 背后进行判断,===
alert("约会");
break;
case "四":
// 背后进行判断,===
alert("电影");
break;
case "五":
// 背后进行判断,===
alert("逛街");
break;
case "六":
// 背后进行判断,===
alert("吃饭");
break;
case "日":
// 背后进行判断,===
alert("敲代码");
break;
// 可以加一个default,当我们的输入错误的时候,可以提示用户
default:
alert("您输入的不是星期");
break;
}
三元表达式
- 表达式:有值会返回;
- 语法:if else 的简写;有返回值;
- 条件 ? 条件为 true 的时候执行 : 条件为 false 的时候执行
// 表达式1 ? 表达式2 : 表达式3;
// 首先 要知道 表达式 会返回结果;
// 过程:先执行表达式1,判断其结果是true还是false,
// 如果是true,则执行表达式2,然后将 表达式2的执行结果 作为整个三元表达式的结果进行返回,
// 如果是false,则执行表达式3,并将 表达式3的结果 作为整个三元表达式的结果
//例如: 求二个数字中谁更大
var a = 10; var b = 20;
var max = a > b ? a : b;
console.log(max);