20220712 第二组 刘世琦 学习记录
作者：互联网
JavaScript
循环 （4种循环）
1.for循环（i是index的缩写）
for(let i = 0;i < 10;i++){
// // 循环体
console.log(i);
面试题：for循环的执行步骤
1.let i = 0：初始化条件，当i = 0时，循环开始（只走一次，在第一次循环开启之前初始化）
2.i < 10：判断条件，会和初始化条件配合循环的执行
3.循环体：循环在重复做什么事情
4.i++：循环条件，每次循环体执行完毕可以让初始化条件（i）产生变化
a.i可以看做是一个局部变量
b.循环条件是可以根据实际情况更改的
c.当修改循环条件时，要确保循环可以向着终点前进去改变
d.在我们开发中，尽量避免死循环
数组有一个属性：length-长度
长度：数组中有多少个元素，注意区分长度和下标（索引） 最大下标+1=长度
取出数组中的最后一个元素，不能是undefined
把数组中的每个元素都操作一遍—数组的遍历（迭代）
练习1：找出数组中的最大值，可以用三元、if...else来找出数组中的最大值
let arr = [10, 5, 9, 7, -5, 100, 24];
//数组中最大值
let max = arr[0];
for (let i = 0; i < arr.length; i++) {
if (arr[i] > max) {
max = arr[i];
}
}
console.log("该数组最大值为" + max);
练习2：判断一个数在数组中是否存在，如果存在，返回它的下标，如果不存在，返回-1
·在JS代码里不要出现重复定义的变量，如果两个变量的作用域出现了重叠不要出现重名的情况，尤其是全局和局部，变量最好不要重名
let arr = [10, 5, 9, 7, -5, 100, 24];
//数组中最大值
let max = arr[0];
for (let i = 0; i < arr.length; i++) {
if (arr[i] > max) {
max = arr[i];
}
}
console.log("该数组最大值为" + max);
2.for in 语句，能做的较少，只能做遍历操作
let arr = [1,2,3,4,5];
// for in语句，能做得事情较少，只能做遍历操作
// 可以理解为a是arr数组的下标通过映射给a
for(let a in arr){
console.log(arr[a]);
}
可以理解为a是arr数组的下标通过映射给a
3.while
1.let a = 10 ：初始化条件
2.a < 100：循环判断条件
3.打印输出，循环体
4.a++：循环条件
·while循环的执行流程
1.初始化条件
2.判断条件
3.执行循环体
4.自增
| while循环 | | for循环 |
| 初始化条件不好控制 ---- | ---- | --每个for循环的初始化条件都是-- |
| 循环条件不好控制 | | 每个for循环的a++都是隔离的 |
while在写函数时，返回值便于管理
练习3：今年是2022年，今天我们公司有10人，每年公司会以10%的比重招人（每年涨10%），问哪一年公司人数突破100人，人数是多少。
function count(){
let year = 2022;
let sum = 10;
while(sum <= 100) {
sum *= 1.1;
year++;
}
return year + "年人数超过了100人，人数是：" + sum;
}
// 需求就是最后我要打印输出哪一年超过了100人，人数是：xxxx
console.log(count());
4.do while循环
let a = 10;
do {
console.log(a);
a++;
} while (a > 100);
1.let a ：初始化条件
2.do：做什么事
3.打印输出 循环体
4.a > 100：判断条件
5.a++：循环条件
·do...while和while的区别
do...while是先执行一次，再判断；while是如果条件不成立，一次都不走
do...while无论条件是否成立，循环都至少执行一次
·死循环
·for( ; ; ){ } ·while(true){ } ·do{ }while(true);
·通常情况下，循坏都会搭配if...else使用
JS的内置函数
·Array：
1.concat( ) 连接
2.join( ) 设置分隔符连接数组为一个字符串
3.pop( ) 删除最后一个元素
4.sort( ) 排序，从小到大排序
·Global：
1.isNaN( ):判断一个值是不是数字
2.parseFloat( ):把一个整数转换成小数
3.parseInt( ) :把一个小数转成整数，取整
4.number( ):把一个值转成number类型
5.string( ):把其他类型转成字符串
String：
1.cherAt( ):取出指定位置的字符
2.indexOf( ):判断指定的字符是否存在，如果存在，返回下标，如果不存在，返回-1
3.lastindexOf( ):从后往前找
4.replace( a,b):替换字符串（把所有的a替换成b）
5.split(‘-’ ):根据括号里的（-）去拆分字符串，得到一个数组
6.substring(1,6 ):字符串的截取（从下标为1的位置截取到下标为6的位置）
Math：
1.ceil( ):向上取整（往大了取整）
2.floor( ):向下取整（往小了取整）
3.round( ):四舍五入
4.random( ):随机：生成一个0-1的随机数
5.tan( ) sin cos cot 三角函数
6.E PI
Date
1.new Date( ):获取系统当前日期
2.getDate( ):返回日期的日 1-31
3.getHours( ):返回时间中的时 0-23
4.getMinutes( ):返回时间中的分 0-60
5.getSecond( ):返回时间中的秒
6.getTime( ):获取系统当前时间
7.getYear( ):获取年
元素节点
·innerText能修改也能获取
（1）修改
（2）获取
·innerHTML
往文本框里加东西
传统方法
1.根据id去抓取HTML元素
2.根据class抓取HTML元素，得到的是一堆元素
3.根据标签（tag）抓取HTML元素，得到的是一堆元素
新方法
1.根据选择器去抓取一个元素
2.根据选择器去抓取全部元素
InnerText和innerHTML弊端：会覆盖。
课堂练习
<body>
<p>账号：<input type="text" id="username"></p>
<p>密码：<input type="password" id="pwd"></p>
<p><input type="button" value="登录" onclick="login()"></p>
<script>
/*
需求：当用户名==admin，密码==123456时，提示登陆成功
否则失败
添加按钮单击事件
判断 if登录成功
*/
function login() {
let username = document.querySelector("#username").value;
let pwd = document.querySelector("#pwd").value;
if (username=="admin" && pwd=="123456") {
alert("登录成功")
console.log("登录成功");
}else{
alert("用户名或密码错误")
console.log("用户名或密码错误");
}
}
</script>
</body>
省市区三级联动
<!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>省市区三级联动</title>
</head>
<body>
<select id="sheng" onchange="setShi()">
<option value="">---请选择省---</option>
<option value="jl">吉林省</option>
<option value="hb">河北省</option>
</select>
<select id="shi" onchange="setQu()">
<option>---请选择市---</option>
</select>
<select id="qu">
<option>---请选择区---</option>
</select>
<script>
function setShi() {
let sheng = document.querySelector("#sheng").value;
let shi = document.querySelector("#shi");
let html = shi.innerHTML;
let qu = document.querySelector("#qu");
if (sheng == 'jl') {
html = '<option>---请选择市---</option><option value="cc">长春市</option><option value="sp">四平市</option>';
}
if (sheng == 'hb') {
html = '<option>---请选择市---</option><option value="sjz">石家庄市</option><option value="st">邢台市</option>';
}
qu.innerHTML = '<option>---请选择区---</option>'
shi.innerHTML = html;
}
function setQu() {
let shi1 = document.querySelector("#shi").value;
let qu = document.querySelector("#qu");
let html = qu.innerHTML;
qu.innerHTML = '<option>---请选择区---</option>';
if (shi1 == 'cc') {
html = "<option>---请选择区---</option><option value='ng1'>南关区1</option><option value='ng2'>南关区2</option>";
}
if (shi1 == 'sp') {
html = "<option>---请选择区---</option><option value='kc1'>宽城区1</option><option value='kc2'>宽城区1</option>";
}
if (shi1 == 'sjz') {
html = "<option>---请选择区---</option><option value='cd1'>信都区1</option><option value='xd2'>信都区2</option>";
}
if (shi1 == 'xt') {
html = "<option>---请选择区---</option><option value='qd1'>桥东区1</option><option value='qd2'>桥东区2</option>";
}
qu.innerHTML = html;
}
</script>
</body>
</html>
总结
对于今天的学习对我来讲理解起来有一些困难，并且知识点居多，存在听得懂但不会做的现象，通过老师对课上练习的讲解，我发现其实困难并不难，但是自己会想不到某些情况或者在编写时存在很多多余代码，会在以后的学习中去悟透各个知识点并且学会应用，能够做到见题知意能够在脑海里形成自己的思路，而不是去一味的学习，培养自己解决问题的能力。在今天的晚间小测时，虽然只有十道题并且拿了满分，但是我的答题时间比较长，可以看出我对于今天的知识掌握的熟练度并不够，我会继续通过进一步的学习，以及对所学内容进行整理！
今天的学习心情还不错，但是对于今天的作业令我苦恼，好一个眼高手低，并没有我想象的那么容易，今天的作业我想了很久但是未能完全解决，明天会继续认真听课，培养独立思考的能力。
标签：20220712,arr,---,while,循环,let,数组,刘世琦,第二组 来源： https://www.cnblogs.com/Liusq11/p/16472455.html