day_2 案例
案例1 最大公约数（逻辑思维过程）
/*
求最大公约数
+ 约数: 可以被整除的数字
=> 例子: 12 -> 1 2 3 4 6 12
+ 公约数: 同时可以被两个数字整除的
=> 例子: 12 和 8 的 公约数
-> 1 2 4
+ 最大公约数: 两个数字的公约数中最大的哪一个
=> 例子: 12 和 8 的最大公约数
-> 4
分析(培养逻辑):
+ 如何判断 12 的约数
-> 从 1 ~ 12 依次被 12 取余 了一下, 找到取余为 0 的
+ 如何判断 12 和 8 的公约数
-> 从 1 ~ 8 依次被 12 和 8 取余了一下, 找到两个取余都为 0 的
判断 max 和 min 的公约数
+ 从 1 ~ min 依次被 max 和 min 取余, 找到两个取余都为 0 的
*/
var max = 12
var min = 8
// 提前准备变量
var res = 1
// 第二次逻辑(从大向小查找)
for (var i = min; i >= 1; i--) {
// 判断同时被 max 和 min 整除
if (max % i === 0 && min % i === 0) {
console.log(i)
// 依次给 res 赋值
res = i
// 因为从大向小查找, 找到的第一个公约数就是最大公约数
// 此时就可以结束循环了
// i = -100
// 专用于结束循环的关键字
break
}
}
console.log('最大公约数是 : ', res)
// 第一次的逻辑(从小向大查找)
// // 循环
// for (var i = 1; i <= min; i++) {
// // 判断 max 和 min 取余 i 为了
// if (max % i == 0 && min % i === 0) {
// console.log(i)
// // 依次给 res 赋值
// res = i
// }
// }
// console.log('最大公约数是 : ', res)
// 辗转相除求最大公约数
/*
逻辑:
+ 判断 max % min 是否为 0
=> 如果为 0, 直接结束, min 就是最大公约数
=> 如果不为 0
-> 让 max 赋值为 原先的 min
-> 让 min 赋值为 原先的 max 和 min 的余数
-> 重复之前步骤
+ 例子: max = 188 和 min = 156
1. 判断 max % min
=> 不为 0
-> max = 156
-> min = 32
2. 判断 max % min
=> 不为 0
-> max = 32
-> min = 28
3. 判断 max % min
=> 不为 0
-> max = 28
-> min = 4
4. 判断 max % min
=> 为 0
=> 结束
此时: 188 和 156 的最大公约数就是 4
分析:
+ 前提:
=> 准备了 max 和 min 两个变量
+ 过程
=> max 和 min 进行取余操作
-> 判断是否为 0
-> 如果不为 0 进行操作
-> 如果为 0 结束
=> 当 max % min 不为 0 的时候
-> 执行操作
*/
// var max = 18
// var min = 17
// // 过程
// while (max % min !== 0) {
// console.log(max, min)
// // 执行操作
// // 需要一个第三方变量暂时记录结果
// var tmp = max % min
// // 修改 max
// max = min
// // 修改 min
// min = tmp
// }
// // 代码能执行到这里, 说明 max % min === 0
// console.log(188 + ' 和 ' + 156 + ' 的最大公约数是 : ', min)
案例2 判断质数（逻辑过程）
/*
案例 - 判断质数
+ 质数: 除了 1 和 自己本身, 没有整除的
分析过程:
+ 7 % 2
+ 7 % 3
+ 7 % 4
+ 7 % 5
+ 7 % 6
+ 以上全部没有整除, 判断 7 是一个质数
*/
// var n = 7
// 准备一个变量, 用作计数器
// var count = 0
// 循环
// 开始: 2
// 结束: <= 7
// 步长: 1
// for (var i = 2; i <= n - 1; i++) {
// // 判断依次取余
// if (n % i === 0) {
// // 有整除的了, 计数器++
// count++
// }
// }
// // 循环结束以后, 只要 count 为 0, 表示 n 是质数
// if (!count) {
// // 代码能执行到这里, 说明 !count 是 true
// // 说明 count 本身是 false
// // count 的取值范围只能是 0 和 正整数
// // 说明 count 是 0, 是质数
// console.log(n + ' 是质数')
// }
// 问题: 真的有必要循环到 n - 1 吗 ?
// 只需要循环到 一半就可以了
// for (var i = 2; i <= n / 2; i++) {
// // 判断依次取余
// if (n % i === 0) {
// // 有整除的了, 计数器++
// count++
// // 只要有任何一个取余为 0 了, 后续不需要哦了
// break
// }
// }
// // 循环结束以后, 只要 count 为 0, 表示 n 是质数
// if (!count) {
// console.log(n + ' 是质数')
// }
/*
打断循环方式判断
*/
// 循环的结束
// for (var i = 1; i <= 10; i++) {
// }
// // 该循环正常结束
// // 此时在循环外, 循环的条件一定为 false
// console.log(i <= 10) // false
// for (var i = 1; i <= 10; i++) {
// if (i === 5) break
// }
// 该循环被打断, 非正常结束
// 此时在循环外, 循环的条件一定为 true
// 因为执行了循环内的代码, 导致循环被结束了
// console.log(i <= 10) // true
// 结论
// 在循环外, 使用循环一模一样的条件来进行判断
// 如果为 false, 说明循环正常结束
// 如果为 true, 说明循环是被打断的, 非正常结束
// 判断质数
var n = 7
for (var i = 2; i <= n / 2; i++) {
// 只要有整除的, 那么直接打断循环
if (n % i === 0) break
}
// 循环结束以后
// 只要判断出循环是正常结束的, 说明没有执行过 break, 说明没有整除的, 是一个质数
// 只要判断出循环不是正常结束的, 说明执行了 break, 说明有整除的, 不是一个质数
if (i <= n / 2) {
// 不是质数
cosnole.log(n + ' 不是质数')
} else {
// 是质数
console.log(n + ' 是质数')
}
//函数isPrime（）判断质数
function isPrime(n) {
// n 就是要判断的数字
// 1. 判断 n 是不是质数
for (var i = 2; i <= n / 2; i++) {
if (n % i === 0) break
}
// 2. 根据判断结果制作返回值
// 如果是质数, 返回 true
// 如果不是质数, 返回 false
// if (i <= n / 2) {
// // 不是质数
// return false
// } else {
// // 是质数
// return true
// }
// 如果 i > n / 2 结果是 true, 那么返回值是 true
// 如果 i > n / 2 结果是 false, 那么返回值是 false
// 返回 i > n / 2 的结果
return i > n / 2
}
案例3 三角形
div {
width: 954px;
border-left: 1px solid #333;
border-bottom: 1px solid #333;
}
span {
width: 105px;
display: inline-block;
border-top: 1px solid #333;
border-right: 1px solid #333;
}
/*
使用 * 在页面输出 9 * 9 的正方形
*/
// 1. 输出一个 *
// document.write('*')
// 2. 输出一行 * (9个)
// 把步骤1 重复 9次
// for (var i = 1; i <= 9; i++) {
// // 步骤1:
// document.write('* ')
// }
// document.write('<br>')
// 3. 输出 9 行 *
// for (var j = 1; j <= 9; j++) {
// // 步骤2:
// for (var i = 1; i <= 9; i++) {
// // 步骤1:
// document.write('* ')
// }
// document.write('<br>')
// }
/*
案例2:
*
* *
* * *
* * * *
* * * * *
* * * * * *
* * * * * * *
* * * * * * * *
* * * * * * * * *
分析:
+ 当 j === 1 的时候, 第 1 行, i 的循环只能循环 1 次
+ 当 j === 2 的时候, 第 2 行, i 的循环只能循环 2 次
总结:
j 开始~结束 开始~结束
1 9~9 1~1
2 8~9 1~2
3 7~9 1~3
*/
// 步骤1: 输出一个正方形
// for (var j = 1; j <= 9; j++) {
// // 控制里层循环的循环次数
// for (var i = 1; i <= j; i++) {
// document.write('* ')
// }
// document.write('<br>')
// }
/*
案例3:
* * * * * * * * *
* * * * * * * *
* * * * * * *
* * * * * *
* * * * *
* * * *
* * *
* *
*
分析:
+ 当 j === 1 的时候, i 的循环需要执行 9 次
+ 当 j === 2 的时候, i 的循环需要执行 8 次
总结
j 开始~结束 开始~结束
1 1~9 1~9
2 2~9 1~8
3 3~9 1~7
*/
// 先输出一个正方形
// for (var j = 1; j <= 9; j++) {
// for (var i = j; i <= 9; i++) {
// document.write('* ')
// }
// document.write('<br>')
// }
/*
案例4:
*
* *
* * *
* * * *
* * * * *
* * * * * *
* * * * * * *
* * * * * * * *
* * * * * * * * *
*/
// 输出一个正方形
// for (var j = 1; j <= 9; j++) {
// // 用 空格输出一个 三角形
// for (var i = j; i <= 9; i++) {
// document.write(' ')
// }
// // 输出 *
// for (var k = 1; k <= j; k++) {
// document.write('* ')
// }
// document.write('<br>')
// }
// document.write('<div>')
// // 九九乘法表
// for (var j = 1; j <= 9; j++) {
// for (var i = 1; i <= j; i++) {
// document.write(`<span>${ i } * ${ j } = ${ i * j } </span>`)
// }
// document.write('<br>')
// }
// document.write('</div>')
// 提前准备一个空字符串
var str = ''
str += '<div>'
// 随着循环, 向 str 上组装内容
for (var j = 1; j <= 9; j++) {
for (var i = 1; i <= j; i++) {
str += `<span>${ i } * ${ j } = ${ i * j } </span>`
}
str += '<br>'
}
str += '</div>'
console.log(str)
// 一次性插入页面
document.write(str)
案例4 九九乘法表的封装
/*
函数案例1
+ 以函数书写一个九九乘法表
*/
// 提前准备实现功能的函数
// function fn() {
// // 实现九九乘法表的代码书写在函数内
// var str = ''
// str += '<div>'
// for (var j = 1; j <= 9; j++) {
// for (var i = 1; i <= j; i++) {
// str += `<span>${ i } * ${ j } = ${ i * j } </span>`
// }
// str += '<br>'
// }
// str += '</div>'
// document.write(str)
// }
// 当你需要这个功能的时候
// fn()
// fn()
// 需求: 出现两个乘法表, 第一个是 9 * 9, 第二个是 7 * 7
// 利用: 参数来解决问题
// fn()
// fn()
// 封装函数
function fn(n) {
// 实现九九乘法表的代码书写在函数内
var str = ''
str += '<div>'
// 最终具体需要循环多少次, 需要根据调用函数的时候决定
for (var j = 1; j <= n; j++) {
for (var i = 1; i <= j; i++) {
str += `<span>${ i } * ${ j } = ${ i * j } </span>`
}
str += '<br>'
}
str += '</div>'
document.write(str)
}
// 需要 9 * 9
fn(9)
// 需要 7 * 7
fn(7)
案例五 用arguments求n个数的和
function fn() {
// 把 arguments 内的每一个数字进行叠加
// 准备一个变量接受求和结果
var res = 0
// 遍历 arguments, 把每一个叠加到 res 身上
for (var i = 0; i < arguments.length; i++) {
// arguments[i] 就是 arguments 内的每一个
res += arguments[i]
}
// 输出
console.log(res)
}
fn(10, 20)
fn(10, 20, 30)
fn(10, 20, 30, 400)
fn(10, 20, 30, 400, 50)
案例六 预解析分析过程
// 1. var 的预解析
// console.log('start')
// console.log(num)
// var num = 100
// console.log(num)
// console.log('end')
/*
代码执行过程
1. console.log(num)
2. var num = 100
3. console.log(num)
打开浏览器
预解析
1. 不需要预解析
2. 需要预解析
=> var num
=> 告诉浏览器我定义了一个叫做 num 的变量
3. 不需要预解析
执行代码
1. console.log(num)
=> 预解析已经声明了 num 变量, 目前内存中是有 num 变量的
=> undefined
2. num = 100
=> 给 num 变量赋值为 100
3. console.log(num)
=> 100
*/
// 2. 声明式函数
// fn()
// function fn() { console.log('fn') }
// fn()
/*
1. fn()
2. function fn() { console.log('fn') }
3. fn()
打开浏览器
预解析
1. 不需要预解析
2. 需要预解析
=> 在浏览器声明了一个变量叫做 fn, 并且赋值为一个函数
3. 不需要预解析
代码执行
1. fn()
=> 因为在预解析阶段, 已经把 fn 定义为一个函数了
=> 正常执行
2. 不需要
3. fn()
=> 原因同上
*/
// 3. 赋值式函数
// fn()
// var fn = function () { console.log('你好 世界') }
// fn()
/*
1. fn()
2. var fn = function () { console.log('你好 世界') }
3. fn()
打开浏览器
预解析
1. 不需要预解析
2. 需要
=> var fn
=> 告诉浏览器我定义了一个叫做 fn 的变量, 暂时没有赋值
3. 不需要预解析
代码执行
1. fn()
=> 此时 fn 变量存在, 但是值是一个 undefined
=> fn() 把 undefined 当做一个函数来调用
=> 报错: fn is not a function
*/
扫一扫
4472
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
