JavaScript
一、补充console相关内容
1.js在判断以下 表达式的时候 会自动先转成 布尔类型 再去判断
2.最终 s 获取结果的时候 不会转类型
3.空字符串 NaN false undefined null 0 转布尔类型 都是false
// let num = 10;
// num += 5; // num = 15
// let res = num++;
// console.log(res); // 15
// console.log(num); // 16
// let x = 10;
// let y = 20;
// let z = x > y ? ++x : y++;
// console.log(x, y, z);// x = 10 ， y = 21 , z = 20
// let num = 5;
// // 6 + 6
// let result = ++num + num++;
// console.log(result);
// console.log(num); // 7
let num = 100;
let result = num === 100 ? "苹果" : "水";
console.log(result);
// 条件?满足条件就执行:不满足条件才执行
二、断点调试
1.目标： 掌握断点调试方法，学会通过调试检查代码
2.作用：学习时可以帮助更好的理解代码运行，工作时可以更快找到bug
3.浏览器打开调试界面 ①按F12打开开发者工具 ②点到sources一栏 ③选择代码文件
4.断点：在某句代码上加的标记就叫断点，当程序执行到这句有标记的代码时会暂停下来
三、while循环
1.目标：掌握while循环语法，能重复执行某段代码
2.语法
while (循环条件) {
要重复执行的代码（循环体）
}
3.语义：（运行根据条件跳出，但不终止，直至运行结束）
①跟if语句很像，都要满足小括号里的条件为true才会进入执行代码 while大括号里代码执行完毕后不会跳出，而是继续回到小括号里判②断条件是否满足，若满足又执行大括号里的代码，然后再回到小括号判断条件，直到括号内条件不满足，即跳出
4.while循环注意事项
①变量起始值 ②终止条件（没有终止条件，循环会一直执行，造成死循环） ③变量变化量（用自增或者自减）
<script>
// 1 变量初始值
let i = 1;
// 2 终止条件
while (i <= 10) {
document.write(`这个是第${i}循环`);
// 3 变量需要改变
i++;
}
</script>
5.while循环案例
（1）案例一（用户输入相关数值，控制输出数值与客户输入相等）
let input = prompt('请输入一个数字');
num = 1;
while (num<=input) {
document.write('输出内容');
num++;
}
（2）案例二（1-100偶数求和）
let i = 1,
sum = 0;
while (i<=100) {
if (i%2===0) {
document.write(`<p>${i}</p>`);
//sum=sum+i
sum+=i
}
i++
}
console.log("你要的1-100的偶数和", sum);
//简化写法：
let i = 1;
let sum = 0;
while (i <= 100) {
// 左边满足条件了等于 true 才去执行右边的代码！！
i % 2 === 0 && (sum += i);
i++;
}
console.log("你要的1-100的偶数和", sum);
（3）案例三（爱与不爱 循环）
let inputNote = prompt("请输入“爱”或“不爱”");
while (inputNote === "不爱") {
inputNote = prompt("请输入“爱”或“不爱”");
}
alert("谢谢你！");
（4）案例四（简易银行ATM）
①完成主体构造
②了解需求：存钱、取钱、余额的实时数学关系（当存款为0时，存钱-取钱=余额，且存钱-取钱>=0）
0 存取款
定义一个 存款的金额
1 用户输入 “1” 存款
1 再弹出一个窗口 让用户来输入想要存款的数量 num1
2 money += num1;
2 用户输入 “2” 取款
1 再弹出一个窗口 让用户来输入想要取款的数量 num2
2 money -+ num2;
3 用户输入 “3” 解决：输出（3种输出方式）一个 金额
4 用户输入 “4” 结束
<script>
let input;
let money = 0;
while (input !== 4) {
input = +prompt(`
1.存款
2.取款
3.查询
4.退出
`);
if (input === 1) {
num1 = +prompt("请输入存款金额");
money += num1;
} else if (input === 2) {
num2 = +prompt("请输入取款金额");
while (money - num2 < 0) {
num2 = +prompt("余额不足，请重新输入取款金额");
}
money -= num2;
} else if (input === 3) {
alert(money);
num1 = prompt("请输入存款金额");
} else if (input === 4) {
alert("欢迎下次光临");
}
}
</script>
四、for循环
1.目标：掌握for循环重复执行某些代码
2.语法：
for (声明记录循环次数变量；循环条件；变化值) {
循环体
}
3.优点：把声明起始值、循环条件、变化值写到一起，让人一目了然
4.for循环案例
（1）案例一（1-100偶数求和）
let sum=0;
for (let i=1;i<=100;i++) {
i%2===0 &&sum+=i;
}
alert(sum);
(2)案例二（画500个星星）
let star='';
for (let i=1;i<=500;1++) {
star+='⭐';
}
document.write(star);
五、continue和break
1.循环结束： ①continue：结束本次循环，继续下次循环 ②break：跳出所在的循环
2.continue控制循环结束，跳过本次循环 继续开启下次循环 （不是必须），continue 想要跳过这个循环 不一定通过它
3.break直接 循环结束，也不是必须 ， 我们也是可以通过 if-else 来实现它的功能。但是如果可以 使用break的话 尽量使用它 （性能更加好） 因为break会终止剩下的循环。优点在于，利用break使运行更加简洁
4.案例
// 只显示 奇数 单数
for (let index = 1; index <= 10; index++) {
// 判断当前的index是不是奇数
if (index % 2 !== 0) {
console.log(index);
// 理解为 如果index为奇数，则跳过
continue;
}
console.log(index,"⭐");
}
//只输出偶数
for (let index = 1; index <= 10; index++) {
if (index % 2 === 0) {
// 是偶数了才输出
console.log(index);
continue；
}
}
for (let index = 1; index <= 10; index++) {
// 如果当前的index = 5 ，就不再往下 循环了，就终止循环
if (index === 5) {
break;
}
// // index===5&&break // 不能简写 报错！！
console.log(index);
// if (index < 5) {
// console.log(index);
// }
console.log("代码调用的次数", index);
}
六、嵌套循环
1.目标：掌握for循环重复执行某些代码
2.for 循环嵌套
for (外部声明记录循环次数的变量；循环条件；变化值) {
for (外部声明记录循环次数的变量；循环条件；变化值){
循环体
}
}
3.for循环应用
计算： 假如每天记住5个单词，3天后一共能记住多少单词？
for (let index1 = 1; index1 <= 3; index1++) {
document.write(`第${index1}天<br/>`);
// 第一天要背5个单词
// 执行5次背单词的 开始
for (let index2 = 1; index2 <= 5; index2++) {
document.write(`记住第${index2}个单词<br/>`);
}
// 执行5次背单词的 结束
}
案例：客户输入几天背几个单词
<script>
// for (read = 1; read <= 3; read++) {
// document.write(`第${read}天<br>`);
// for (words = 1; words <= 3; words++) {
// document.write(`第${words}个单词<br>`);
// }
// }
let read = +prompt("背几天");
let words = +prompt("背几个单词");
for (day = 1; day <= read; day++) {
document.write(`第${day}天<br>`);
for (num = 1; num <= words; num++) {
document.write(`第${num}个单词<br>`);
}
}
</script>
七、其他未讲到的相关技术（了解）
<script>
// 3 循环3次
each(3, function (index) {
// 输出第几天
document.write(`第${index}天<br/>`);
// 5 循环5次
each(5, function (index2) {
// 输出倍几个单词
document.write(`记住第${index2}个单词<br/>`);
});
});
function each(length, callback) {
for (let index = 1; index <= length; index++) {
callback(index);
}
}
</script>
