六：打印九九乘法表
- 需求驱动开发
- 建议一个复杂的效果：先完成一个简单的功能，再根据效果进行代码的完善
// 打多行
// 第一行： j = 1 i:1
// 第二行： j = 2 i:1，2
// 第三行： j = 3 i:1，2，3
for (let j = 1; j <= 9; j++) {
// 先打印一行
for (let i = 1; i <= j; i++) {
document.write(`<span>${i} * ${j} = ${i * j}</span>`)
}
document.write('<br>')
}
`
七：数组-求和，最大值和最小值
- 凡是要获取数组的每一个元素，都是循环遍历
- 数组的遍历，在现阶段如果没有特别意外，都是使用for循环
- 函数返回多个值的时候，要将值包装为对象
将代码封装为一个函数
- 函数的声明定义
- 函数的参数传递
- 函数的返回值
获取最大，最小，和：我们需要获取数组的每一个元素，进行相应的操作
// 封装函数，求数组和的和，最大值，最小值
// arr:数组，调用方法需要传入数组
function getValue(arr) {
let sum = 0,
max = arr[0], // 不能直接赋值为0，我们压根不知道数组中是什么值(全部是负数怎么办)
min = arr[0] // 不能直接赋值为0，我们压根不知道数组中是什么值(全部是正数怎么办)
// 循环遍历数组
for (let i = 1; i < arr.length; i++) {
// 求和
sum += arr[i]
// 求最大值：如果遍历的元素大于max,说明max需要被覆盖
if (arr[i] > max) {
max = arr[i]
}
// 求最小值：如果遍历的元素小于min,说明min需要被覆盖
if (arr[i] < min) {
min = arr[i]
}
}
// 方法只是进行操作，而不能对操作结果进行处理
// 如果在函数中使用reutrn直接返回多个值，最终只有最后一个值
//return只能返回一个变量,所以我们一般对多个进行包装，如果没有特别意外，都包装为对象
return { sum, max, min }
// return { 'sum':sum, 'max':max, 'min':min }
}
let result = getValue([12, 3, 2134, 23, 543, 6, 54, 6756])
console.log(result)
`
八：动态生成柱子
- 要动态，先静态
- 凡是说到动态渲染，必须要准备好 数据 + 静态结构
- 现阶段的动态渲染的实现过程就是：遍历拼接
接收用户的输入数据---多个值，定义数组进行存储
遍历数组，根据数组元素值动态拼接指定的html结构
细节：不要忘记了父容器
// 柱子的数量，柱子的数量对应于需要接收的用户输入的值的数量
let num = 4
// 定义一个数组用于存储用户数据--数组命名：要么单词本身是一个复数或本身表示数组，要么你自己添加s/es
// arr list children items names
let datas = []
// 循环遍历为数组添加元素
for (let i = 0; i < num; i++) {
// push / unshift / 数组[索引] = 值
// datas.push(+prompt())
datas[i] = +prompt(`请输入第${i + 1}个值`)
}
// 实现动态渲染:数据 + 结构 --实现的过程就是 遍历拼接
// 遍历谁：datas
// 拼接什么：
let htmlStr = `<div class="box">`
for (let i = 0; i < datas.length; i++) {
htmlStr += ` <div class="sub" style='height:${datas[i]}px'>
<span>${datas[i]}</span>
<p>第${i + 1}季度</p>
</div>`
}
htmlStr += '</div>'
document.write(htmlStr)
`
九：猜数字游戏
- 回顾api,阶段总结
- 学会拆分业务中的需求
1.得自动的生成一个1-10 之间的数字
2.添加while循环
让用户输入数字，进行比较
- 如果大了，就提示大了 --继续输入
- 如果小了，就提示小了 --继续输入
- 如果猜 对了，给出提示 -- 不再继续 break
// 1.生成一个1-10之间的随机数字
// Math.random():生成0-1之间的小数，包含0不包含1
let num = Math.ceil(Math.random() * 10)
// 让用户循环--重复输入-重复次数不确定，就用for
for (;;) {
let guess = prompt('请输入你猜测的数字')
// - 如果大了，就提示大了 --继续输入
if (guess > num) {
alert('输入大了，继续！！！')
}
// - 如果小了，就提示小了 --继续输入
else if (guess < num) {
alert('输入小了，继续！！！')
}
// - 如果猜 对了，给出提示 -- 不再继续 break
else {
alert('棒')
break
}
}
`
十：删除数组中所有的偶数
自己模拟一个数组
遍历数组，实现元素的删除
// 删除数组中所有的偶数
let arr = [12, 456, 234, 4, 34, 6, 8, 10, 878]
// 遍历，删除splice(索引，数量)
for (let i = 0; i < arr.length; i++) {
if (arr[i] % 2 == 0) {
arr.splice(i, 1)
i--
}
}
console.log(arr)
