JavaScript基础语法（3）

循环语句

在javascript中，循环语句有三种，while、do..while、for循环。

while循环

基本语法：

//当循环条件为true时，执行循环体，
//当循环条件为false时，结束循环。
while(循环条件){
  //循环体：需要循环执行的语句
}

代码示例：

//计算1-100之间所有数的和
//1. 初始化变量
var i = 1;
var sum = 0;
while(i <= 100){//判断条件
  sum += i;//循环体
  i++;//自增，修改循环条件（不能省略）
}
console.log(sum);

练习：

//1. 计算所有偶数的和
//2. 循环表白案例
//3. 循环登录案例，只有当用户输入admin的时候才能登录成功，否则一直弹框

do..while循环

do..while循环和while循环非常像，二者经常可以相互替代，但是do..while的特点是不管条件成不成立，都会执行一次。

基础语法：

do{
  //循环体;
}while(循环条件);

代码示例：

//初始化变量
var i = 1;
var sum = 0;
do{
  sum += i;//循环体
  i++;//自增
}while(i <= 100);//循环条件

思考：

// 1. 计算所有偶数的和
// 2. 循环输入账号密码的案例用do..while怎么写？
// 3. 循环表白的案例用do..while怎么写？

思考：

// while循环与do..while循环的区别是啥？

断点调试

断点调试是指自己在程序的某一行设置一个断点，调试时，程序运行到这一行就会停住，然后你可以一步一步往下调试，调试过程中可以看各个变量当前的值，出错的话，调试到出错的代码行即显示错误，停下。

调试步骤：

浏览器中按F12-->sources-->找到需要调试的文件-->在程序的某一行设置断点

调试中的相关操作：

Watch:监视，通过watch可以监视变量的值的变化，非常的常用。
F10:程序单步执行，让程序一行一行的执行，这个时候，观察watch中变量的值的变化。
F8：跳到下一个断点处，如果后面没有断点了，则程序执行结束。

for循环（重点）

写while循环的经常会忘记自增，for循环其实是while循环演化过来的，语法更加的简洁明了，使用非常的广泛。

for循环语法：

//1. for循环使用分号分隔
//2. for循环有2个分号，两个分号不能少
for(初始化语句;判断语句;自增语句){
  //循环体
}

执行顺序：1243 ---- 243 -----243(直到循环条件变成false)

1. 初始化语句

2. 判断语句

3. 自增或者自减

4. 循环体

for循环代码示例：

//计算1-100之间所有数的和
var sum = 0;
for(var i = 1; i <= 100; i++){
  sum += i;
}

思考1：

//1 求1-100之间所有数的和、平均值
//2 求1-100之间所有数的乘积
//3 计算1-100之间能3整除的数的和

思考2：

//1 计算1-100之间不能被7整除的数的和
//2 求1-100之间所有偶数的和
//3 同时求1-100之间所有偶数和奇数的和

思考3（双重for循环）：

//1 打印正方形
//2 打印直角三角形
//3 打印9*9乘法表

break和continue

break:立即跳出整个循环，即循环结束，开始执行循环后面的内容（直接跳到大括号）

continue:立即跳出当前循环，继续下一次循环（跳到i++的地方）

思考：

//1. 找到1-100之间第一个能被7整除的数
//2. 打印1-10之间所有的数，除了5这个数

思考1：

//输出结果是什么？
for(var i = 1; i <=10; i++) {
  if(i == 5){
    continue;
  }
  if(i == 7){
    break;
  }
  console.log(i);
}

思考2：

//1. 求1-100之间不能被7整除的整数的和（用continue）
//2. 求200-300之间所有的奇数的和（用continue）
//3. 求200-300之间第一个能被7整数的数（break）
//4. 求200-300之间第3个能被7整数的数（break）

总结

1. 循环有很多种，但是以后用得最多的是for循环

2. 当不明确循环次数的时候，可以使用while循环

3. 当无论如何都要执行一次代码的时候，可以使用do..while循环。

4. 循环可以相互替代。

数组

所谓数组，就是将多个元素（通常是同一类型）按一定顺序排列放到一个集合中，那么这个集合我们就称之为数组。

数组：多个元素的集合，这个集合有顺序，有长度。用途是存储大量的数据。

思考：

//为什么要有数组？
//1. 我们知道，一个变量能够存储一个值，当我们想要存储多个值的时候，就可以使用数组。比如存储一个班级里面所有学生的姓名。
//2. 使用数组可以对多个相同类型的值统一的管理，存储起来方便，操作的时候也会很方便。

数组初体验

在javascript数组是一个有序的列表，可以在数组中存放任意的数据

创建数组，通过数组的构造函数可以创建一个数组

var arr = new Array();//new表示新的 Array:表示数组  new Array表示创建一个数组。

通过数组的下标可以操作数组，数组类似于火车车厢

//给数组设置值，数组中可以存放任意的值
//数组名[下标] = "值"    
arr[0] = "张三";//在下标0的地方存放张三
arr[1] = 111; //在下标1的地方存放111
arr[2] = true; //在下标2的地方存放true

//获取数组中的值
//数组名[下标]
console.log(arr[0]);//打印下标0的值

创建数组

通过构造函数创建数组

var arr = new Array();//创建了一个空数组
var arr = new Array("zs","ls","ww");//创建了一个数组，里面存放了3个字符串
var arr = new Array(1,2,3,4);//创建了一个数组，里面存放了4个数字

通过数组字面量创建数组

var arr1 = []; //创建一个空数组
var arr2 = [1, 3, 4]; //创建一个包含3个数值的数组，多个数组项以逗号隔开
var arr3 = ["a", "c"]; // 创建一个包含2个字符串的数组

数组的下标与长度

数组的下标：数组是有序的，数组中的每一个元素都对应了一个下标，下标是从0开始的

var arr = ["zs", "ls", "ww"];

数组的长度：跟字符串一样，数组有一个length属性，指数组中存放的元素的个数。

var arr = ["zs", "ls", "ww"];
arr.length;//这个数组的长度是3
//空数组的长度是0

下标与长度的关系：最大的下标 = length - 1

数组的赋值与取值

数组的取值

//格式：数组名[下标]
//功能：获取数组对应下标的那个值，如果下标不存在，则返回undefined。
var arr = ["red", "green", "blue"];
arr[0];//red
arr[2];//blue
arr[3];//这个数组的最大下标为2,因此返回undefined

数组的赋值

//格式：数组名[下标] = 值;
//如果下标有对应的值，会把原来的值覆盖，如果下标不存在，会给数组新增一个元素。
var arr = ["red", "green", "blue"];
arr[0] = "yellow";//把red替换成了yellow
arr[3] = "pink";//给数组新增加了一个pink的值

思考：如何给一个数组增加新的元素？

• arr[arr.length] = 值

• arr.push(值)

//1. 把1-100之间所有的数，放到数组中
//2. 把1-100之间所有的奇数，放到数组中
//3. 把1-100之间能被3整数的数字，存到数组中

数组的遍历

遍历：遍及所有，对数组的每一个元素都访问一次就叫遍历。

数组遍历的基本语法：

for(var i =0; i < arr.length; i++) {
    //数组遍历的固定结构
}

思考1：

var arr = [298, 1, 3, 4, 6, 2, 23, 88,77,44];
//1 求一组数中的所有数的和跟平均值
//2 求一组数中的最大值
//3 求一组数中的最小值和最小值所在的位置
//4 求一组数中的最大值和最小值以及所在位置

思考2：

var arr = ["a", "bb","ccc","dddd"];
//1.让一个数组倒叙保存另一个数组中的每一项
//2 将字符串数组用|或其他符号分割
//3 有一个字符串数组，求字符串数组中每项的长度，并把长度的数值存储到新的数组中
//4 将数组中值为0的项去掉，将不为0的值存入一个新的数组

冒泡排序

1. 初级版本

2. 中级版本

3. 高级版本（思路）