11.18
1.9 回顾和作业讲评
1.9.1 基本语法:
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script>
//条件结构
if(1>2){
// {} 内部代码是条件为真执行的代码
console.log("1>2")
}
if(1<2){
// {} 内部代码是条件为真执行的代码
console.log("1<2")
}
//如果x没有赋值,undefined
//判断x条件为false
let x;
if(x){ //false
console.log("x")
}
//有值，非boolean的值,通常可能是一个字符串
//如果有赋值，true
let y = '哈';
if(y){
console.log("y: "+y)
}
//但是这个值如果是boolean类型，就按照boolean类型去判断
let z = false;
if(z){
console.log("z: "+z)
}
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>看两段代码不同之处</title>
</head>
<body>
<script>
//根据学生成绩来统计等级
let score = 90;
if(score>=90 && score<=100){
console.log("优秀!")
}
if(score>=80 && score<90){
console.log("良好!")
}
if(score>=70 && score<80){
console.log("中等!")
}
console.log("********************")
let score1 = 90;
if(score1>=90 && score1<=100){
console.log("优秀!")
}
else if(score1>=80 && score1<90){
console.log("良好!")
}
else if(score1>=70 && score<80){
console.log("中等!")
}
</script>
</body>
</html>
1.9.2 作业讲评:
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<input type="text" id="num">
<input type="button" value="计算阶乘" id="btn">
<input type="text" id="result" value="0">
<script>
document.getElementById("btn").onclick = function(){
//1 获取文本框的值
let n = document.getElementById("num").value;
//2 计算阶乘 1*2*3*4....n
let sum = 1;
for(let i=1;i<=n;i++){
sum = sum*i;
}
document.getElementById("result").value = sum;
}
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<input type="text" id="num1" placeholder="请输入第一个数字"><br/>
<select id="op">
<option value="+">+</option>
<option value="-">-</option>
<option value="*">*</option>
<option value="/">/</option>
</select><br/>
<input type="text" id="num2" placeholder="请输入第一个数字"><br/>
<input type="button" value="计算" id="btn"><br/>
<input type="text" id="result" value="0">
<script>
document.getElementById("btn").onclick = function(){
//1 获取文本框1的值
let n1 = parseFloat(document.getElementById("num1").value);
//2 获取文本框2的值
let n2 = parseFloat(document.getElementById("num2").value);
//3 获取运算符
let op = document.getElementById("op").value;
//条件判断
let sum = 0;
switch (op){
case "+":
sum = n1+n2;
break;
case "-":
sum = n1-n2;
break;
case "*":
sum = n1*n2;
break;
case "/":
if(n2 == 0){
alert("除数不能为0");
document.getElementById("result").value="除数不能为0";
return ;
}
sum = n1/n2;
break;
}
document.getElementById("result").value = sum;
}
</script>
</body>
</html>
用户在文本框中输入年和月份，我们输出这年的这个月有多少天.
分析:
如果用户输入月份不是2月份的话，我们的年其实灭有意义的。
只需要根据月份就能判断这个月有多少天，规则:
1 3 5 7 8 10 12 =>31天
4 6 9 11 =>30天
2月份: 平年 28 闰年 29 ,平年或者闰年和year有关. 闰年的判断标准: 能被4整除，不能被100整除. 或者能被400整除.
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>输入年和月份</title>
</head>
<body>
<input type="text" id="year" placeholder="请输入年"><br/>
<input type="text" id="month" placeholder="请输入月"><br/>
<input type="button" value="计算天数" id="btn"><br/>
<input type="text" id="result" value="0">
<script>
document.getElementById("btn").onclick = function(){
//1 获取文本框1的值
let year = parseFloat(document.getElementById("year").value);
//2 获取文本框2的值
let month = parseFloat(document.getElementById("month").value);
//不管年，先按照月份来计算
let days = 0;
switch (month){
case 1:
case 3:
case 5:
case 7:
case 8:
case 10:
case 12:
days=31;
break;
case 4:
case 6:
case 9:
case 11:
days=30;
break;
//如果2
case 2:
// 闰年的判断标准: 1 [能被4整除， 与 不能被100整除]. 或者【能被400整除】. 整除标准语言中有没有余数
if((year%4==0 && year%100!=0) || (year%400==0)){
days=29;
}
else{
days=28;
}
break;
}
//将结果赋值到文本框中
document.getElementById("result").value = days;
}
</script>
</body>
</html>
1.10 循环结构
解决了什么问题? 重复的动作.重复的操作.相同的或者相似的.
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script>
//for
//while
//do-while
// for(表达式1;表达式2;表达式3){
//
// //循环体
// }
//表达式1先执行一次，而且只执行一次 -》给变量赋值
//表达式2是是条件判断，表达式1执行完成后，去执行表达式2 ; 条件运算符 或者配合逻辑运算符
//true 执行 循环体, false 循环体不执行，直接跳过循环体
//当表达式为2并执行完循环体后，我们的代码区执行表达式3 ==>变量的变化 i++
//表达式3执行完成之后，继续执行表达式2
// for(let i = 1;i <= 5;i++){
//
// // console.log("i :"+i); //输出i的值
// console.log(i+": 学习使我快乐!");
// }
for(let i = 1;i <= 10;i= i+1){
// console.log("i :"+i); //输出i的值
console.log(i+": 学习使我快乐!");
}
console.log("*******************");
for(let i = 10;i >= 1;i--){
// console.log("i :"+i); //输出i的值
console.log(i+": 学习使我快乐!");
}
// console.log("学习使我快乐!");
// console.log("学习使我快乐!");
// console.log("学习使我快乐!");
// console.log("学习使我快乐!");
// console.log("学习使我快乐!");
// console.log("学习使我快乐!");
// console.log("学习使我快乐!");
// console.log("学习使我快乐!");
// console.log("学习使我快乐!");
// console.log("学习使我快乐!");
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script>
//需要打印随机数
//不确定次数
let n = Math.floor(Math.random()*100); //[0 100)
console.log("n :"+n)
for(let i =0;i<=n;i++){
console.log("哈喽呀 :"+i)
}
</script>
</body>
</html>
猴子吃桃问题:
1.10.1 猴子吃桃问题：
猴子第一天摘下若干个桃子，当即吃了一半，还不过瘾，又多吃了一个。第二天早上又将第一天剩下的桃子吃掉一半，又多吃了一个。以后每天早上都吃了前一天剩下的一半多一个。到第 10 天早上想再吃时，发现只剩下一个桃子了。编写程序求猴子第一天摘了多少个桃子。
分析: 只吃了9次(天)
定义一个循环，从第1天，到2天，3天…..9天. sum
for(let i = 1;i<=9;i++){
吃掉的: sum/2+1
剩下的: sum= sum-(sum/2+1);
}
反过来: 定义一个循环，从第9天，到8天，7天…..1天.
for(let i = 9;i>=1;i--){
//没吃之前有几个?
sum= (sum+1)*2
//4 10
}
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script>
let sum = 1;//第九天吃完之后还剩1个.[第10天早上起来还没吃]
for(let i = 9;i>=1;i--){
//没吃之前有几个?
sum= (sum+1)*2
console.log("第"+i+"天没吃之前有"+sum+"个桃子")
//4 10
}
</script>
</body>
</html>
1.10.2 小球问题:
有一个弹力球，从100米的高度，落地后会弹起来.每次弹起的高度是原来高度的一半.
问，第10次落地后弹起来的高度是多少?
分析:
循环变量1开始执行到10,循环执行了10次.
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script>
//原始高度
let height = 100;
//i表示第几次落地
for(let i = 1;i<=10;i++){
//弹起后的高度
height = height / 2;
}
console.log(height);
</script>
</body>
</html>
接着上面的问题:
第10次落地的时候，这个小球经过的总的路程是多少米?
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script>
//原始高度
let height = 100;
//定义变量保存每次落地时经历的路程.
let sum = height;
//i表示第几次落地
for(let i = 1;i<=10;i++){
//这个sum?
console.log("第 "+i+" 次落地时候经过的距离: "+sum+" 米")
//弹起后的高度
height = height / 2;
//计算结果(将每次弹起高度+下落高度) 累加
if(i!=10){
sum = sum + 2*height;
}
}
console.log("第10次落地后弹起的高度: " + height);
console.log("第10次落地时经过的距离: " + sum);
</script>
</body>
</html>
1.11 循环练习:
1.11.1 for循环实现计算 2+22+222+2222+22222的和
1.11.2 判断并输出500以内既能够被3整除又能够被5整除的整数
1.11.3 寻找所有的水仙花数
水仙花数定义：
a、一定是三位数
b、每一位的立方，加起来正好是这个数的本身，比如153=111 + 555 + 333；
浙公网安备 33010602011771号