JS第四天
[toc]
!= 与!==的区别
let a = 1 ;let b = "1"
console.log(a==b) ; //true 因为==忽略类型，判断里面的值
console.log(a===b) ; //false 因为===不忽略类型，判断类型 和值
console.log(a！=b) ; //false 因为用双等号（==） a和b是相等
console.log(a！==b) ; //true 因为=== a和b是不相等
一行打印两个结果，中间逗号隔开
console.log(a,b) //a,b
console.log(undefined) //false
console.log(undefined===undefined) //true
NaN == NaN //false
短路运算：整段代码的结果 等于 && 最后运行的那段代码
let s = 100 && "hello" console.log(s) //hello
js在判断以下表达式 会自动先转成 布尔类型 再去判断
最后 s 获取结果的时候 不会转类型
let b = ""&& "he" console.log(b) //"" 判断转false ,但用时，还是返回原值
let ss = undefined && "11" console.log(ss) //undefined
let cc = false && "yaya" console.log(cc) //false
空字符串 NaN false undefined null 0 转布尔类型 都是false 其余是true
转Boolean的一些易错点
let num = 10;
num += 5; //num = 15
let res = num++
console.log(res);//15 后置置增先运算后自加
console.log(num); //16
let x = 10,y=20
let z = x > 20 ? ++x :y++
console.log(x,y,z) //x = 10,y= 21,z = 20
!"" //隐式转布尔 false 加！ true
！{} //console.log(Boolean({})) true 加！ false
！！5 true
!undefined true
字符串.chartCodeAt() -----字符串转数字多少，可以打印出来判断
"2" > 19 "2"转成数字
console.log("2" > 19) //运算符两侧如果有一个是字符串和一个数字，把字符串转数字后比较
“1”.chartCodeAt() 字符串转数字多少
字符串数字，和字符串数字比较
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>字符串.charCodeAt()方法</title>
</head>
<body>
<script>
// 比较“1” 与“29”
console.log('"1">"29" -----> ', "1">"29"); //false 49>50 false 只比较一位 '1 '与 '2'
let num1 = "1",num2="2"
console.log('"1". -----> ', num1.charCodeAt()); //49
console.log('"2". -----> ', num2.charCodeAt()); //50
</script>
</body>
</html>
"2" 和 "1" 做比较 ，如果 “2” > "1" 得出结果 不会再往下 判断 “2” 与“9” 直接关系
“2” 和 “19” 看成数字 本质 字符串 “2” 和 “1” 字符串做比较
charCodeAt() 字符串点它，可以看大小
循环语句
while 循环
重复执行某段代码 while:在。。。期间
语法：
while(循环条件){
要重复执行的代码（循环体）
}
解释：
跟if语句很像，都要满足小括号里面的条件为true才会进入执行代码
while大括号里代码执行完毕后不会跳出，而是继续回到小括号里判断条件是否满足，满足又执行括号里面的代码，然后再回到小括号里面判断条件，直到括号内条件不满足，跳出循环
let i = 1
while(i <=3){
document.write("循环3次<bt>")
i++
}
循环三要素：
1,。变量起始值
2，终止条件（没有终止条件，循环一直执行，造成死循环）
3，变量的变化量（用自增或自减）
while循环练习
需求页面输出1-100
计算从1-100的总和并输出
计算1-100之间所有偶数和
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>页面输出1-100</title>
</head>
<body>
<script>
// 1页面输出1-100
let i = 1
while(i <= 100){
document.write(i + "<br/>")
i++
}
// 2 计算从1加到100 和
// let i = 1,all = 0
// while(i <= 100) {
// all += i
// i++
// }
// document.write(all)
// 3 计算1-100之间所有的偶数和
//分析：2 + 4 +。。。 + 100
//判断当前是不是偶数，对2取整，求余 没有余数
// 2 % 2 = 0 4% 2 = 0 5% 2 = 1
// let i = 1 ,oddSum = 0
// while(i <= 100) {
// if(i % 2 === 0){
// oddSum += i
// }
// i++
// }
// document.write(oddSum)
// 3 求1-100的奇数和
// let i = 1,oddSum = 0
// while(i <= 100) {
//这一行代码不是能直接执行，满足某系条件执行
// if(i % 2 !== 0){
// oddSum += i
// }
//无论当前的i是偶数还是奇数，i++ 都要执行 ，必须进行下一轮的循环
// i++
// }
// document.write(oddSum)
// 1-100 总和
// while(i <= 100) {
// oddSum += i
// i++
// }
// document.write(oddSum)
</script>
</body>
</html>
1-100和 精简写法
let i = 1,sum = 0
while(i<=100){
sum += i++
//分析
//sum += 1 //sum = sum + 1
//sum = sum + i++
//sum = sum + i
//i ++
}
1-100 求偶
分析：
1.偶数和奇数判断条件 对2求余 是否等于0
2 if条件 来判断当前的i 是不是偶数
是 执行代码 业务 计算总和 sum += i
精简写法
let i = 1; sum = 0
while(i<= 100) {
//加括号，看成一个整体，左边满足，才进行右边
(i % 2 === 0) && (sum += i);
i++
}
console.log('1-100偶数和'，sum)
ATM取款机案例
分析：
需求：
1.打开页面的时候，弹窗一个对话框
显示
1，取款
2，存款
3，查询余额
4，退出
2，用户需要输入的一些信息
1 用户输入 1 继续弹窗 ，又问一遍 以上 1的内容
2用户输入 2 继续弹窗 ，又问一遍 以上 1的内容
3用户输入 3 继续弹窗 ，又问一遍 以上 1的内容
4用户输入 4 结束
第一步 1， 只要用户输入不是4 都弹窗 否则不弹窗 （跟爱不爱我案例类似）
1，声明一个变量 用来存放 用户的输入值 （1,2,3,4）
2,写循环 条件
let input,
money = 0;
while (input !== 4) {
// 不满足条件一直弹窗
//一定要 变量 发生变化
input = +prompt(`
请选择你要操作的服务
1 存储
2 取款
3 查看余额
4 退出`);
// 开始对用户的输入做判断
if (input === 1) {
console.log('1 -----> ', 1);
let addMoney = +prompt('请输入要存款的金额');
money += addMoney;
} else if (input === 2) {
console.log('2 -----> ', 2);
let reduceMoney = +prompt('请输入要取款的金额');
// 判断，如果不满足条件，金额大于你的存储就不能进行，并提醒用户输入有误
if (reduceMoney > 0 && reduceMoney < money) {
money -= reduceMoney;
} else {
alert('输入金额有误');
}
} else if (input === 3) {
console.log('3 -----> ', 3);
alert('您现在还有' + money + '元');
} else if (input === 4) {
console.log('4,退出 -----> ', 4);
}
}
断点调试
for循环
- 重复执行代码
- 好处：把声明起始值，循环条件，变化值写一起
for(声明记录循环次数的变量，循环条件，变化值){
循环体
}
for(let i =1;i<9;i = i + 1){
循环体
}
for循环嵌套
在一个循环里套一个循环，一般用在for循环里
for(外部声明记录循环次数的变量，循环条件，变化值){
for(内部声明记录循环次数的变量，循环条件，变化值){
循环体
}
}
for 循环和 while 的使用
当明确次数时，推荐使用：for循环
当不明确次数时，推荐使用：while循环
循环退出
循环结束：
continue:结束本次循环，继续下次循环
break: 跳出所在的循环
可以用break时，尽量使用，性能更优
for(let i = 1;i<=10;i++){
if(i<5){
console.log(i)
}
console.log("代码调用次数",i) // 下面会打印
}
//使用break后
for(let i = 1;i<=10;i++){
if(i<5){
console.log(i)
break
}
console.log("代码调用次数",i) // 下面不会打印---可以节省性能
}
测试题：
let i = 0
for(;i<10;i++){
if(i%2==0){
continue
}
console.log(i);
if(i===7){break;}
}
console.log(i)
//1,3,5,7,7
循环的方式： for循环 if else 三元表达式 短路运算 都算不算循环
break 关键字可以用于循环当中，跳出当前循环 ，break后面的代码不会再执行，break关键字的使用一般会有一个前提条件
let num = 10
for(let i = 0;i<10;i++){
num++
if(i==3){
break
}
}
console.log(num) //14 当i == 3时，break跳出循环，num++一共会执行4次（i==0,i==,i==2,i==3）
num 为 14
关于break关键字作用：break关键字可以结束for语句，可以结束while语句，可以中止本次循环的执行
1，break关键字可以结束if语句（错误）
for(let i = 0;i<5;i++){
let j = i
console.log(i)
console.log(j)
} //报错
for(let i = 0;i<10;i++){
if(i === 7){
break
}
if(i==5){
continue
}
console.log(i) //012346
}
数组
1，声明语法 ：
let 数组名 = [数据1，数据2，。。。，数据n]
数组是按顺序保存，所以每个数据都要有自己的编号。
在数组中，数据的编号叫：“索引或下标”
数组编号从0开始
数组可以存储任意类型的数据
2数组的遍历
用循环把数组中每个元素都访问到，一般用for循环遍历
语法：
for(let i = 0;i < 数组名.length;i++){
数组名[i]
}
let arr = [10,20,30]
for(let i = 0;i < arr.length;i++){
document.write(arr[i])
}
3.数组的增加新的数据
数组的.push()方法将一个或多个元素添加到数组的末尾，并返回该数组的新长度、
语法：
arr.push(元素1，元素2，。。。，元素n)
如：
let arr = [1,2,3,4]
arr.push(5)
console.log(arr) // [1,2,3,4,5]
arr.unshift(新增的内容) 方法将一个或者多个元素添加到数组的开头，并返回改数组的新长度
语法：
arr.unshift(元素1，。。。，元素n)
如：
let arr = [1,2,3]
arr.unshift(100)
console.log(arr) //[1,2,3,100]
数组的删除元素
数组.shift()方法：从数组中删除第一个元素、并返回该元素的值
语法：arr.shift()
let arr = [1,2,3]
arr.shift()
console.log(arr) //[2,3]
数组.splice()方法：删除指定元素（常用）
语法：
arr.splice(start,deleteCount)
arr.splice(起始位置，删除几个元素)
解释：
start 起始位置 指定的开始位置 （从0开始）
deleteCount:
表示要删除几个
可选的，如果省略则默认从指定位置删除到最后
- 关于数组（数据的集合）的增删改查
查：查询数组数据，数组[下标] ，访问数组数据
增：给数组添加新的数据 arr.push(新增内容) ----添加在数组最前面
arr.unshift(新增的内容)---添加在数组的末尾
改：重新赋值 数组[下标] = 新值
删： 删除数组中的数据
arr.pop() 删除数组最后一个
arr.shift() 删除第一个
arr.spllice(操作的下标，删除的个数)
