学习javascript这一篇就够了超详细笔记（建议收藏）上

1.初识

计算机基础导读

***学完应掌握的知识点

• 能够说出什么是编程语言
• 能够区分编程语言和标记语言的不同
• 能够说出常见的数据存储单位机器换算关系
• 能够说出内存的主要作用以及特点

***本章学习的知识点

• 编程语言
• 计算机基础

编程语言

编程：

​ 就是让计算机为解决某个问题而使用每种程序设计语言编写程序代码，并最终得到结果的过程。

计算机程序：

​ 就是计算机所执行的一系列的指令集和，而程序全部都是用我们所掌握的语言来编写的，所以人们要控制计算机一定要通过计算机语言向计算机发出命令。

计算机语言：指用于人与计算机之间通讯的语言，它是人与计算机之间传递消息的媒介。

计算机语言的种类非常多，总的来说可以分成机器语言，汇编语言和高级语言三大类。

​ 实际上计算机最终所执行的都是机器语言，它是由0 和 1 组成的二进制数，二进制是计算机语言的基础。

编程语言：

​ 可以通过类似于人类语言的“语言”来控制计算机，让计算机来为我们做事情，这样的语言就叫做编程语言。

​ 编程语言是用来控制计算机的一系列指令，它有固定的格式和词汇（不同的编程语言的格式和词汇不一样），必须遵守。

​ 如今通用的编程语言有两种形式：汇编语言和高级语言。

​ 汇编语言和机器语言实质是相通的，都是直接对硬件操作，只不过指令采用了英文缩写的标识符，容易识别和记忆。

高级语言注意是相对于低级语言而言，他并不是特指某一种具体的语言，而是他包括了很多编程语言，程永德有c语言，c++，java，c#，python，javascript，go语言，objective-c，swift等。

翻译器：

​ 高级语言所编制的程序不能直接被计算机识别，必须经过转换才能被执行，为此，我们需要一个翻译器可以将我们所编写的源代码转换为机器语言，这也被称为二进制化。记住1和0. -->

​ var num = 1; num = num + 1;// ++num num = num + 1; console.log(num); // 3 // 2.前置递增运算符 ++ 写在变量的前面 var age = 10; ++age; // 类似于age = age + 1; console.log(age); // 3.先加1 后返回值 var p = 10; console.log(++p + 10); // 自增自减只能搭配变量使用 </script>

后置自增运算符

<script>
        var num = 10;
        num++; //num = num + 1   ++num
        console.log(num);
        // 1.前置自增和后置自增如果单独使用 效果是一样的
        // 2.后置自增 口诀：先返回值 后自加1
        var age = 10;
        console.log(age++ + 10);
        console.log(age);
    </script>

递增运算符练习

<script>
        var a = 10;
        ++a; // ++a = 11   a = 11
        var b = ++a + 2; // a = 12  ++a = 12
        console.log(b); //14

        var c = 10;
        c++; //c++ = 11  c = 11
        var d = c++ + 2; //c++ = 11  c = 12
        console.log(d); // 13

        var e = 10;
        var f = e++ + ++e; //1.e++ = 10  e = 11  2.e = 12  ++e = 12
        console.log(f); //22
        // 后置自增 先表达式返回原值 后面变量再自加1
    </script>

前置递增和后置递增小结

* 单独使用时 运行结果相同

* 与其他代码联用时 执行结果会不同

* 后置：先原值运算 后自加（先人后己）

* 前置： 先自加 后运算（先己后人）

* 开发时 大多使用后置递增/减 并且代码独占一行 例如 num++ 或num–

比较运算符

<script>
        console.log(3 >= 5);//false
        console.log(3 <= 5);//true
        // 1.我们程序里面的等于符号 是 == 默认转换数据类型 会把字符串的数据类型转换为数字型 只要求值相等就可以
        console.log(3 == 5);//false
        console.log('风向' == "张学友");//false
        console.log(18 == '18');//true
        console.log(3 != 5);//true  (!= 不等于)
        // 2.我们程序里面有全等 一模一样 要求两侧的值 还有 数据类型完全一致才可以 true
        console.log(3 === 5);//false
        console.log('5' == 5);//false

        // 等号小结
        // * = ：赋值  把右边给左边
        // * ==：判断 判断两边值是否相等（注意此时有隐式转换）
        // * ===：全等 判断两边的值和数据类型是否完全相同
    </script>

逻辑运算符

<script>
        //1.逻辑与 && （and）：两侧都为true 结果才是true 只要有一侧为false 结果就位false
        console.log(3 > 5 && 3 > 2);//false
        console.log(3 < 5 && 3 > 2);//true
        //2.逻辑或 || （or）：两侧都为false 结果才是假false 只要有一侧为true 结果就是true
        console.log(3 > 5 || 3 > 2);//true
        console.log(3 > 5 || 3 < 2);//false
        // 3.逻辑非 ！（not）
        console.log(!true); //false
    </script>

逻辑运算练习

<script>
        var num = 7;
        var str = '风中传来苦咸~';
        console.log(num > 5 && str.length >= num);//true

        console.log(num < 5 && str.length >= num);//false

        console.log(!(num < 10));//false

        console.log(!(num < 10 || str.length == num));//false


    </script>

逻辑中断值逻辑与 和 逻辑或

<script>
        // 逻辑中断（短路运算）的原理：当有多个表达式（值）时，左边的表达式值可以确定结果时 就不再继续运算右边的值

        // 1.用我们的布尔值参与的逻辑运算 true && false == false
        // 2.123 && 456 是值 或者是 表达式 参与逻辑运算
        // 3.逻辑与短路运算 如果表达式1 结果为真 则返回表达式2  如果表达式1为假  那么返回表达式1
        console.log(123 && 456); // 456
        console.log(0 && 456); // 0
        console.log(0 && 456 && 1 + 2 && 45 * 232); // 0
        console.log('' && 456 && 1 + 2 && 45 * 232); // ''
        // 如果有 空的或者否定的为假 其余是真的 0 '' null undefined NaN
        // 4. 逻辑或短路运算 如果表达式1结果为真  则返回的是表达式1 如果表达式1为假  则返回的表达式为2
        console.log(123 || 456);//123
        console.log(123 || 456 || 4522 + 114);//123
        console.log(0 || 456 || 4522 + 114);// 456
        // 逻辑中断很重要 它会影响我们程序运行结果
        var num = 0;
        console.log(123 || num++);// 123
        console.log(num); //0


    </script>

赋值运算符

<script>
        var num = 10;
        // num = num + 1;  num++
        // num = num + 2; //num +=2;
        // 每次加个2再赋值  自增2
        //num += 2;
        // 每次加个5再赋值  自增5
        num += 5;
        console.log(num);
        // 每次乘以3 再赋值 自乘3
        var age = 2;
        age *= 3;
        console.log(age);
    </script>

运算符优先级

​

<注意：

​ 一元运算符里面的 逻辑非优先级很高

​ 逻辑与比逻辑或优先级高 -->

        // 练习
        var a = 3 > 5 && 2 < 7 && 3 == 4;
        console.log(a);

        var b = 3 <= 4 || 3 > 1 || 3 != 2;
        console.log(b);

        var c = 2 === "2";
        console.log(c);

        var d = !c || b && a;
        console.log(d);

5.流程控制及案例

流程控制导读

**学完要掌握的知识点

- 能够使用if分支语句

- 能够使用switch 分支语句

- 能够使用三元表达式

**本章学习内容

* 流程控制

* 顺序流程控制

* 分支流程控制if语句

* 三元表达式

* 分支流程控制switch 语句

流程控制

< * 在一个程序执行的过程中 各条代码的执行顺序对程序的结果是有直接影响的。很多时候我们要通过控制代码的执行顺序来实现我们要完成的功能 -->

顺序流程控制

< * 顺序结构是程序中最简单 最基本的流程控制 他没有特定的语法结构 程序会按照代码的先后顺序 依次执行 程序中大多数代码都是这样执行的 -->

if分支语句

// 分支结构：由上到下执行代码的过程中 根据不同条件 执行不同的路径代码（执行代码多选一的过程） 从而得到不同的结果

​ // JS语言提供了两种分支结构语句

​ // * if语句

​ // * switch语句

​ // 1.if 的语法结构 如果 if

​ // if（条件表达式） {

​ //执行语句

​ // }

​ // 2.执行思路 如果 if 里面的条件表达式结果为真 true 则执行大括号里面的 执行语句

​ // 如果 if 条件表达式结果为假 则不执行大括号里面的语句 则执行if 语句后面的代码

​ // 3.代码体验

var age = prompt('请输入你的年龄：');
        if (age >= 18) {
            alert('你成年了');
        }

// 语句可以理解为一个行为 循环语句和分支语句就是典型的语句 一个程序由很多个语句组成 一般情况下 会分割成一个一个的语句

案例-网吧

// 弹出prompt 输入框 用户输入年龄 程序把这个值取过来保存到变量中

// 使用if 语句来判断年龄 如果年龄大于18 就执行if 大括号里面的输出语句

var age = prompt('请输入你的年龄：');
        if (age >= 18) {
            alert('先生请进~');
        }

if-else 双分支语句

        // 1.语法结构 if 如果 else 否则
        // if (条件表达式) {
        //     执行语句1
        // } else {
        //     执行语句2
        // }
        // 2.执行思路 如果表达式结果为真 那么执行语句1 否则 执行语句2
        // 3.代码验证
        var age = ('请问你的年龄？');
        if (age >= 18) {
            alert('先生请进~');
        } else {
            alert('滚，回家写作业去！')
        }
        // 5.if 里面的语句1 和 else 里面的语句2 最终只能有一个语句执行 2选1
        // 6.else 后面直接跟大括号

案例-判断闰年

// 算法：能够被4整除且不能被100整除的为瑞年（如2004年就是闰年 1901年不是闰年）或者能被400整除的也是闰年

// 弹出prompt 输入框 让用户输入年份 把这个值取过来保存到变量中

// 使用if 语句来判断是否是闰年 如果是闰年 就执行if 大括号里面的输出语句 否则就执行else里面的输出语句

// 一定要注意里面的且 && 还有或者 || 的写法 同时注意判读能整除的方法是取余为0

var year = prompt('请输入年份：');
        if (year % 4 == 0 && year % 100 != 0 || year % 400 == 0) {
            alert('你输入的年份是闰年');
        } else {
            alert('你输入的年份是平年');
        }

案例-张学友

var yourname = prompt('请输入你的名字');
        if (yourname == '陈冠希') {
            alert('给你五块钱');
        } else {
            alert('走开');
        }

if-else 多分枝语句

// 1.多分枝语句 就是利用多个条件来选择不同的语句执行 得到不同的结果 多选一 的过程
        // 2.if  else if 语句就是多分枝语句
        // 3.语法规范
        if (条件表达式1) {
            //语句1
        } else if (条件表达式2) {
            //语句2
        } else if (条件表达式3) {
            //语句3
        } else {
            //最后的语句；
        }
        // 4.执行思路
        // 如果条件表达式1 满足就执行 语句1 执行完毕后 退出整个if 分支语句
        //如果条件表达式1 不满足 则判断条件表达式2 满足的话 执行语句2 以此类推
        // 如果上面的所有条件表达式都不成立 则执行else 里面的语句
        // 5.注意点
        // （1）多分枝语句还是多选一 最后只能有一个语句执行
        // （2）else if 里面的条件理论上是可以任意多个的
        // （3）else if 中间有个空格了

案例-成绩

var mark = prompt('请输入你的成绩：');
        if (mark >= 90) {
            alert('包包，真棒！');
        } else if (mark >= 70) {
            alert('包包，你已经很出色了！');
        } else if (mark >= 60) {
            alert('孩子,，你很危险！');
        } else {
            alert('熊孩子，我不想跟你说话，我只想用皮鞭跟你说话！');
        }

三元表达式

// 1.有三元运算符组成的式子称为三元表达式
        // 2.++num   3+5   ? :
        // 3.语法结构
        // 条件表达式 ? 表达式1 : 表达式2
        // 4.执行思路 
        // 如果条件表达式结果为真 则 返回 表达式1 的值 如果条件表示结果为假 则返回 表达式2 的值
        // 5.代码体验
        var num = 10;
        var result = num > 2 ? 'yes' : 'no'; //我们知道表达式是有返回值的
        console.log(result);
        // if (num > 5) {
        //     result = '是的';
        // } else {
        //     result = '不是的';
        // }
        // console.log(result);

数字补零案例

// 用户输入0 ~ 59之间的一个数字

// 如果数字小于10 则在这个数字前面补0 （加0拼接） 否则 不做操作

// 用一个变量接收这个值 然后输出

var time = prompt('请输入一个数字');
        //三元表达式  表达式 ? 表达式1 ：表达式2;
        var result = time < 10 ? '0' + time : time; // 把返回值赋值给一个变量
        alert(result);

switch语句

 // 1.switch 语句也是多分枝语句 也可以实现多选一 他是基于不同的条件来执行不同的代码 当然要针对变量设置一系列的特定值的选项时 就可以使用switch
        // 2.语法结构 switch 转换 开关   case 小例子作者选项的意思
        // switch (表达式) {
        //     case value1:
        //         执行语句1;
        //         break;
        //     case value2:
        //         执行语句2;
        //         break;
        //         可以写很多个
        //     default:
        //         执行最后的语句;
        // }
        // 3.执行思路 利用我们的表达式的值 和case 后面的选性值相匹配 如果匹配上 就执行case里面的语句 如果都没有匹配上 那么就执行default 里面的语句
        // 4.代码验证
        switch (1) {
            case 1:
                console.log('我是1');
                break;
            case 2:
                console.log('我是2');
                break;
            default:
                console.log('没有结果');
        }

switch注意事项

// 1.我们开发里面 表达式我们经常写成变量

// 2.我们 num的值 和case里面的值 相匹配的时候是 全等 必须是值和数据类型一致才可以 num === 1

// 3.break 如果当前的case里面没有break 则不会退出switch 是继续执行下一个case 直到遇见break停止

var num = 1;
        switch (num) {
            case 1:
                console.log(1);
                break;

            case 2:
                console.log(2);
                break;

            case 3:
                console.log(3);
                break;
        }

案例-查询水果

// 弹出prompt 输入框 让用户输入水果名称 把这个值取过来保存到变量中
        // 将这个变量作为switch 括号里面的表达式
        // case 后面的值写几个不同的水果名称 注意一定要加引号 因为必须是全等匹配
        // 弹出不同的价格即可 同样注意每个case 之后加上break 以便退出 switch 语句
        // 将default 设置为没没有此水果
        var fruit = prompt('请输入查询水果名称：');
        switch (fruit) {
            case '苹果':
                alert('苹果35/斤');
                break;
            case '榴莲':
                alert('榴莲3.5/斤');
                break;
            default:
                alert('没有此水果');
        }

案例-问候机器人

// 判断时间阶段
        // 用户输入12点之前 弹出中午好 18点之前 弹出傍晚好 23点之前 弹出深夜好
        var time = prompt('主人，请输入时间：');
        if (time <= 12) {
            alert('主人，中午好！');
        } else if (time <= 18) {
            alert('主人，傍晚好！');
        } else if (time <= 23) {
            alert('主人，深夜好！');
        } else if (time == 24) {
            alert('主人，该睡了！');
        } else {
            alert('主人，请输入正确时间！');
        }

案例-比较最大值

// 比较两个最大值 （用户以此输入2个值 最后弹出最大的那个值）
        var one = prompt('请输入第一个值');
        var two = prompt('请输入第二个值');
        if (one > two) {
            alert(one + '比较大');
        } else {
            alert(two + '比较大');
        }

案例-奇偶判断

// 用户输入一个数 来判断是奇数还是偶数
        var num = prompt('请输入一个数字');
        if (num % 2 != 0) {
            alert('奇数');
        } else {
            alert('偶数');
        }

案例-判断周几

// 根据用户输入的值(数字1~7) 返回星期几
        var num = prompt('请输入1~7');
        switch (num) {
            case '1':
                alert('今天周一');
                break;
            case '2':
                alert('今天周二');
                break;
            case '3':
                alert('今天周三');
                break;
            case '4':
                alert('今天周四');
                break;
            case '5':
                alert('今天周五');
                break;
            case '6':
                alert('今天周六');
                break;
            case '7':
                alert('今天周日');
                break;
            // default:
            //     alert('熊孩子，乱输什么玩意');
        }

案例-班长口袋有多少钱

// 接收班长口袋里的钱数 若大于等于2000 请大家吃西餐 若小于2000 大于等于1500 请大家吃快餐 
        // 若小鱼1500 大于1000 请大家喝饮料 若小于1000 大于等于500 请大家吃棒棒糖 否则提醒班长 下次把钱带够
        var money = prompt('班长你带了多少钱？');
        if (money > 2000) {
            alert('带大家去吃海底捞吧！');
        } else if (money >= 1500) {
            alert('那请大家吃快餐吧！');
        } else if (money >= 1000) {
            alert('只能请大家喝饮料了！');
        } else if (money >= 500) {
            alert('那棒棒糖吧！');
        } else {
            alert('那就请大家吃屁吧哈哈哈哈哈！！！！！！！！！');
        }

6.循环及案例

循环导读

**学完要掌握的知识点

- 能够说出循环的目的

- 能够说出for循环的执行过程

- 能够使用断点调试来观察代码的执行过程

- 能够使用for循环完成累加求和等案例

- 能够使用双重for循环完成乘法表案例

- 能够说出break 和 continue 的区别

**要学的知识点

* 循环

* for循环

* 双重for循环

* while循环

* do while循环

* continue break

循环的目的

// 在实际问题中 有许多具有规律性的重复操作 因此程序中要完成这类操作就需要重复执行某些语句
        //循环的目的 可以重复执行某些代码
        console.log('媳妇我对了');
        console.log('媳妇我对了');
        console.log('媳妇我对了');
        console.log('--------------------');
        for (var i = 1; i <= 100; i++) {
            console.log('媳妇你错了');
        }

for循环语法结构

// 1.for 重复执行某些代码 通常跟计数有关系
        // 2.for 语法结构
        // for （初始化变量; 条件表达式; 操作表达式）{
        //循环体
        // }
        // 3.初始化变量 就是用var 声明一个普通变量 通常用于作为计数器使用
        // 4.条件表达式 就是用来决定每一次循环是否继续执行 就是终止的条件
        // 5.操作表达式 是每次循环最后执行的代码 经常用于我们计数器变量进行更新（递增或者递减）
        // 6.代码体验 我们重复打印100句 你好
        for (var i = 1; i <= 100; i++) {
            console.log('你好代码');
        }

for循环的执行过程

 // for 循环的执行过程
        for (var i = 1; i <= 100; i++) {
            console.log('hellow word!');
        }
        // 1.首先执行里面的计数器变量 var i = 1 .但是这句话在for 里面只执行一次 index
        // 2.去i <= 100 来判断是否满足条件 如果满足条件 就去执行 循环体 不满足条件退出循环
        // 3.最后去执行 i++ i++是单独写的代码 递增 第一轮结束
        // 4.接着去执行i <= 100 如果满足条件 就去执行 循环体 不满足条件退出循环 第二轮

断点调试

for (var i = 1; i <= 100; i++) {
            console.log('hellow word!');
        }
        // 断点调试:
        // * 断点调试是指自己在程序的某一行设置一个断点 调试时 程序运行到这一行就会卡住 然后你可以一步步往下调试 调试过程可以看到各个变量的值 出错的话 调试到出错的代码行即显示错误 停下
        // * 断点调试可以帮我们观察程序运行的过程
        // 浏览器中按f12-->sources-->找到需要调试的文件-->在程序的某一行设置断点
        // Watch：监视 通过watch可以监视变量的值得变化 非常的常用
        // f11：程序单步执行 让程序一行一行的执行 这个时候 观察watch中变量的值得变化
        // 代码调试的能力非常重要 只有学会了代码调试 才能学会自己解决bug的能力 初学者不要觉得调试代码麻烦就不去调试 知识点花点功夫肯定学的会 但是代码调试这个东西 自己不去练 永远学不会

for循环重复执行相同的代码

for (var i = 1; i <= 10; i++) {
            console.log('卡塞痛');
        }
        // 我们可以让用户控制输出的次数
        var num = prompt('请您输入次数');
        for (i = 1; i <= num; i++) {
            console.log('哈塞给');
        }

for循环重复执行不同的代码

// for 循环可以重复执行不同的代码 因为我们有计数器变量 i 的存在 i每次循环值都会变
        // 我们想输入一个人的一生1~100岁
        // for (i = 1; i <= 100; i++) {
        //     console.log('他今年' + i + '岁了');
        // }
        for (i = 1; i <= 100; i++) {
            if (i == 1) {
                console.log('这个人一岁了，出生了');
            } else if (i == 100) {
                console.log('这个人一百岁了，死了');
            } else {
                console.log('这个人' + i + '岁了');
            }
        }  

for循环重复某些操作

// for 循环重复执行某些操作 比如我们做了一百次加法运算
        // 求1~100 之间的整数累加和
        // 需要循环100次 我们需要一个计时器 i
        // 我们需要一个存储结果的变量 sum 但是初始值一定是0
        // 核心算法：1+2+3+4+5+...   sum = sum + i;
        var sum = 0; // 求和 的变量
        for (var i = 1; i <= 100; i++) {
            // sum = sum + i;
            sum += i;
        }
        console.log(sum);

for循环案例

// 1.求1~100之间所有数和的平均数 需要一个和的变量 sum 还需要一个平均值 average 变量
        var sum = 0;
        var average = 0;
        for (var i = 1; i <= 100; i++) {
            sum = sum + i;
        }
        average = sum / 100;
        console.log(average);
        // 2.求1~100之间奇数和偶数的和 我们需要一个偶数的和变量 even 还有奇数和变量 odd
        var even = 0;
        var odd = 0;
        for (var i = 1; i <= 100; i++) {
            if (i % 2 == 0) {
                even = even + i;
            } else {
                odd = odd + i;
            }
        }
        console.log('偶数和为' + even);
        console.log('奇数和为' + odd);
        // 3.求1~100之间能被三整除的数的和
        var result = 0;
        for (var i = 1; i <= 100; i++) {
            if (i % 3 == 0) {
                result = result + i;
            }
        }
        console.log(result);

案例-学生成绩

// 弹出输入框输入总的班级人数（num）
        // 依次输入学生的成绩（保存起来score） 此时我们需要用到for循环 弹出的次数跟班级总人数有关系 条件表达式i <= num
        // 进行业务处理：计算成绩 先求总成绩 （sum） 之后求出平均成绩（average）
        // 弹出结果
        var sum = 0;
        var average = 0;
        var num = prompt('请输入班级总人数：');
        for (var i = 1; i <= num; i++) {
            var score = prompt('请输入第' + i + '个学生成绩');
            //因为从prompt取过来的数据是 字符串型需要转换为数字型
            sum = sum + parseFloat(score);
        }
        average = sum / num;

        alert('学生总成绩为' + sum + '分');
        alert('学生平均成绩为' + average + '分');

一行打印多个小星星

 // 一行打印多个小星星
        // console.log('✈✈✈✈✈✈');
        // for (var i = 1; i <= 5; i++) {
        //     console.log('✈');
        // }
        //追加字符串*****
        // var str = '';
        // for (var i = 1; i <= 5; i++) {
        //     str = str + '✈';
        // }
        // console.log(str);
        var num = prompt('请输入星星颗数');
        var str = '';
        for (var i = 1; i <= num; i++) {
            str = str + '✈';
        }
        console.log(str);

双重for循环执行过程

// 1.双重for循环 语法结构
        // for （外层的初始化变量; 外层的条件表达式; 外层的操作表达式）{
        //     for（里层的初始化变量; 里层的条件表达式; 里层的操作表达式）{
        //         // 执行语句
        //     }
        // }
        // 2.我们可以把 里面的循环 看做是 外层循环的语句
        // 3.外层循环 循环一次 里面的循环执行全部
        // 4.代码验证
        for (var i = 1; i <= 3; i++) {
            console.log('这是外层循环的第' + i + '此');
            for (var j = 1; j <= 3; j++) {
                console.log('这是里层循环的第' + j + '次');
            }
        }

打印五行五列星星

// 打印五行五列小飞机
        var str = '';
        for (var i = 1; i <= 5; i++) {
            for (j = 1; j <= 5; j++) {
                str = str + '✈';
            }
            // 如果一行打印完毕五个小飞机 就要另起一行 加\n
            str = str + '\n';
        }
        console.log(str);

打印n行n列小飞机

var rows = prompt('请输入打印行数：');
        var cols = prompt('请输入打印列数：');
        var str = '';
        for (i = 1; i <= rows; i++) {
            for (j = 1; j <= cols; j++) {
                str = str + '✈';
            }
            str = str + '\n';
        }
        console.log(str);

案例-打印倒三角形

var str = '';
        for (var i = 1; i <= 10; i++) {  //外层循环控制行数
            for (var j = i; j <= 10; j++) {  // 里层循环打印的个数不一样 j = i
                str = str + '✈';
            }
            str = str + '\n';
        }
        console.log(str);

案例-打印正三角形

var str = '';
        for (var i = 1; i <= 10; i++) {
            for (var j = 1; j <= i; j++) {
                str = str + '✈';
            }
            str = str + '\n';
        }
        console.log(str);

案例-九九乘法表

// 九九乘法表
        // 一共有九行 但是每行的个数不一样 因此需要用到双重 for 循环
        // 外层的 for 循环控制行数 i 循环九次 可以打印九行
        // 内层的 for 循环控制每行公式 j
        // 核心算法: 每一行 公式的个数正好和行数一致 j <= i;
        // 每行打印完毕 都需要重新换一行
        var str = '';
        for (var i = 1; i <= 9; i++) {  //外层循环控制的行数
            for (var j = 1; j <= i; j++) {  //里层循环控制每一行的个数 j <= i
                //1 × 1 = 2;
                // str = str + '✈';
                str += j + '×' + i + '=' + i * j + '\t';
            }
            str = str + '\n';
        }
        console.log(str);

for循环小结

< * for 循环可以重复执行某些相同代码

* for 循环可以重复执行些许不同的代码 因为我们有计数器

* for 循环可以重复执行某些操作 比如算数运算符加法操作

* 随着需求增加 双重for循环可以做更多 更好看的效果

* 双重for循环 外层循环一次 内层for 循环全部执行

* for 循环是循环条件和数字直接相关的循环

* 分析要比写代码更重要

* 一些核心算法想不到 但是要学会 分析他执行过程

* 举一反三 自己经常总结 做一些相似的案例 -->

while循环

// 1.while 循环语法结构 while 当....的时候
        // while （条件表达式）{
        //    // 循环体
        // }
        // 2.执行思路 当条件表达式结果为true 则执行循环体 否则 退出循环 
        // 3.代码验证
        var num = 1;
        while (num <= 100) {
            console.log('hao');
            num++;
        }
        // 4.里面应该也有计数器 初始化变量
        // 5.里面应该也有操作表达式 完成计数器的更新 防止死循环

案例-while循环

// while 循环案莉
        // 1.打印人的一生 一到一百岁
        var i = 1;
        while (i <= 100) {
            console.log('这个人今年' + i + '岁了');
            i++;
        }
        // 2.计算1~100之间所有整数的和
        var sum = 0;
        var j = 1;
        while (j <= 100) {
            sum = sum + j;
            j++;
        }
        console.log(sum);
        // 3.弹出一个提示框 你爱我吗？如果输入我爱你 就结束 否则 一直问
        var message = prompt('你爱我吗？');
        while (message !== '我爱你') {
            message = prompt('你爱我不爱我？');
        }
        alert('我也爱你啊 笔芯');

do while 循环

// 1.do while 循环 语法结构
        // do {
        //     //循环体 
        // } while (条件表达式)
        // 2. 执行思路 跟while 不同的地方在于 do while 先执行一次循环体 再判断条件 如果条件表达式结果为真 则继续执行循环体 否则退出循环
        // 3.代码验证
        var i = 1;
        do {
            console.log('how are you ?');
            i++;
        } while (i <= 100)
        // 4.我们的的do while至少执行一次

案例-do while循环

// 1.打印一个人的一生
        var i = 1;
        do {
            console.log('how are you?');
            i++;
        } while (i <= 100)
        //2.计算1~100之间整数的和
        var sum = 0;
        var j = 1;
        do {
            sum = sum + j;
            j++;
        } while (j <= 100);
        console.log(sum);
        // 3.弹出一个框问 你爱我吗？如果不爱 一直弹 否则结束
        do {
            message = prompt('你爱我吗？');
        } while (message !== '我爱你');
        alert('我也爱你');

循环小结

< * js中循环有for、双for、while、do while -->

continue关键字

// continue 关键字 退出本次循环（当前次的循环）  继续执行剩余次数循环
        for (var i = 1; i <= 5; i++) {
            if (i == 3) {
                continue;// 只要遇见 continue 就退出本次循环 直接跳到i++
            }
            console.log('我正在吃第' + i + '个包子');
        }
        // 1.求1~100之间 除了能被7整除之外的整数和
        var sum = 0;
        for (var i = 1; i <= 100; i++) {
            if (i % 7 == 0) {
                continue;
            }
            sum = sum + i;
        }
        console.log(sum);

break关键字

//break 退出整个循环
        for (var i = 1; i <= 5; i++) {
            if (i == 3) {
                break;
            }
            console.log('第' + i + '个包子');
        }

命名规范及语法格式

< * 变量 函数的命名必须要有意义 -->

< * 变量的名称一般用名词 -->

< * 函数的名称一般用动词 -->

< 注意操作符和注释等空格使用 -->

循环作业

求一到一百所有数的和和平均数

var sum = 0;
        var average = 0;
        for (var i = 1; i <= 100; i++) {
            sum = sum + i;
        }
        average = sum / 100;
        console.log('总和为：' + sum);
        console.log('平均数为：' + average);

求一到一百所有偶数的和

var sum = 0;
        for (var i = 1; i <= 100; i++) {
            if (i % 2 == 0) {
                sum = sum + i;
            }
        }
        console.log(sum);

求一百以内七的倍数的总和

var sum = 0;
        for (var i = 1; i <= 100; i++) {
            if (i % 7 == 0) {
                sum = sum + i;
            }
        }
        console.log(sum);

使用for循环打印三角形

var str = ''
        for (var i = 1; i <= 5; i++) {
            for (var j = 1; j <= i; j++) {
                str = str + '♠';
            }
            str = str + '\n';
        }
        console.log(str);

for循环完成99乘法表

var str = '';
        for (var i = 1; i <= 9; i++) {
            for (var j = 1; j <= i; j++) {
                // str = str +'**';
                str += j + '×' + i + '=' + i * j + '\t';
            }
            str += '\n';
        }
        console.log(str);

简易atm

var money = 100;
        while (true) {
            var items = prompt('欢迎光临风向银行~' + '\n' + '请输入序列号执行以下服务~' + '\n' + '1.存钱' + '\n' + '2.取钱' + '\n' + '3.显示余额' + '\n' + '4.退出银行');
            switch (parseFloat(items)) {
                case 1:
                    var cun = prompt('请输入存款金额~');
                    money = money + parseFloat(cun);
                    alert('账户余额' + money + '元');
                    break;
                case 2:
                    var qu = prompt('请输入取款金额');
                    if (parseFloat(qu) > money) {
                        alert('抱歉穷光蛋，你的余额不足~');
                    } else {
                        money -= parseFloat(qu);
                        alert('账户余额' + money + '元');
                    }
                    break;
                case 3:
                    if (money > 50000) {
                        alert('账户余额' + money + '元' + '富婆抱抱我');
                    } else {
                        alert('账户余额' + money + '元' + '没多少马内了哦');
                    }
                    break;
                case 4:
                    alert('先生慢走~');
                    break;
                default:
                    alert('把眼睛睁开~');
                    break;
            }
            // 用户选择 4 跳出循环
            if (parseFloat(items) == 4) {
                break;
            }
        }

js（上）结束…