JavaScript

前端-公瑾

已于 2022-06-05 20:30:53 修改

阅读量110

点赞数 1

文章标签： javascript

于 2022-04-01 19:31:10 首次发布

本文链接：https://blog.csdn.net/qq_49029709/article/details/123904981

版权

文章目录

前言
一、循环
二、数组
三、总结

前言

掌握循环语句，让程序具备重复执行能力
掌握数组声明及访问的语法

一、循环

1.for循环基本使用

目标：掌握for循环重复执行某些代码

1. for循环语法
⚫ 也是重复执行代码
⚫ 好处：把声明起始值、循环条件、变化值写到一起，让人一目了然
在这里插入图片描述
⚫ for循环流程图

⚫ for循环和while循环在使用上面有什么不同的应用场景呢？

➢ 已知循环的次数的时候推荐使用for循环
➢ 未知确循环的次数的时候推荐使用while循环

1.循环中断

目标：能说出continue和break的区别

⚫ 循环退出：
➢ 正常退出：当条件表达式不满足
➢ 意外退出： continue ，break 一般是在循环语句里面使用使用的时候一般会配合 if语句
⚫ 循环中断：
➢ continue：在循环体里面当遇到 continue关键字中断本次循环然后继续执行下一次循环
➢ break：在循环里面当遇到 break关键字会将整个循环结束

1.循环嵌套

目标：掌握循环嵌套

for 循环嵌套
在这里插入图片描述
➢ 一个循环里再套一个循环，一般用在for循环里

for 循环嵌套-应用

计算：假如每天记住5个单词，3天后一共能记住多少单词？
拆解：
➢ 第一天： 5个单词
➢ 第二天： 5个单词
➢ 第三天： 5个单词

<!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>Document</title>
</head>

<body>
  <script>
    // 外层循环 循环3次
    for (let i = 1; i <= 3; i++) {
      document.write(`第${i}天<br>`)
      // 内层循环 循环5次
      for (let j = 1; j <= 5; j++) {
        document.write(`记了第${5 * (i - 1) + j}个单词<br>`)
      }
    }
  </script>
</body>

</html>

二、数组

1.数组是什么

目标：能说出数组是什么

⚫ 数组(Array)是一种可以按顺序保存数据的数据类型
⚫ 为什么要数组？
➢ 思考：如果我想保存一个班里5个人的姓名怎么办？
➢ 如果有多个数据可以用数组保存起来

2.数组的基本使用

目标：能够声明数组并且能够获取里面的数据

1. 声明语法
在这里插入图片描述
⚫ 例

⚫ 数组是按顺序保存，所以每个数据都有自己的编号
⚫ 数组中的编号从0开始，所以小明的编号为0，小刚编号为1，以此类推
⚫ 在数组中，数据的编号也叫索引或下标
⚫ 数组可以存储任意类型的数据

2. 取值语法
在这里插入图片描述
⚫ 例

⚫ 通过下标取数据
⚫ 取出来是什么类型的，就根据这种类型特点来访问

3. 一些术语：
➢ 元素：数组中保存的每个数据都叫数组元素
➢ 下标：数组中数据的编号
➢ 长度：数组中数据的个数，通过数组的length属性获得
在这里插入图片描述
4. 遍历数组：

用循环把数组中每个元素都访问到,一般会用for循环遍历

⚫ 语法：
在这里插入图片描述

3.操作数组

目标：掌握利用push向数组添加元素(数据)

数组本质是数据集合, 操作数据无非就是增删改查语法：

在这里插入图片描述
1. 数组增加新的数据

数组.push() 方法将一个或多个元素添加到数组的末尾，并返回该数组的新长度 (重点)

语法：

arr.unshift(新增的内容) 方法将一个或多个元素添加到数组的开头，并返回该数组的新长度

语法：
在这里插入图片描述
2. 数组删除元素

数组.pop() 方法从数组中删除最后一个元素，并返回该元素的值

语法：
在这里插入图片描述
数组.shift() 方法从数组中删除第一个元素，并返回该元素的值

语法：
在这里插入图片描述
数组.splice() 方法删除指定元素

语法：
在这里插入图片描述
解释：

➢ start 起始位置:
➢ 指定修改的开始位置（从0计数）
➢ deleteCount:
➢ 表示要移除的数组元素的个数
➢ 可选的。如果省略则默认从指定的起始位置删
除到最后

删除元素的使用场景：

随机抽奖，中奖的用户就需要从数组里面删除，不允许重复抽奖
点击删除按钮，相关的数据会从商品数据中删除
后期课程我们会用到删除操作，特别是splice

4.数组案例

冒泡排序

⚫ 冒泡排序是一种简单的排序算法。
⚫ 比如数组 [2,3,1,4,5] 经过排序成为了 [1,2,3,4,5] 或者 [5,4,3,2,1]
⚫ 排序：指数据从小到大排列或者从大到小排列
⚫ 数组中的排序：指的是将数组元素进行从小到大排列或者从大到小排列
⚫ 冒泡排序算法简介：

比较相邻的元素，前一个比后一个大（或者前一个比后一个小）调换位置
每一对相邻的元素进行重复的工作，从开始对一直到结尾对，这步完成后，结尾为最大或最小的数.
针对除了最后一个元素重复进行上面的步骤
重复1-3步骤直到完成排序
⚫ 这个算法的名字由来是因为越小的元素会经由交换慢慢“浮”到数列的顶端。

<!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>Document</title>
</head>

<body>
  <script>
    const arr = [2, 3, 5, 4, 1]
    // 使用for循环来依次将相邻的元素进行比较
    for (let i = 0; i < arr.length - 1; i++) {
      for (let j = 0; j < arr.length - 1 - i; j++) {
        // 如果数组的前一个元素比数组的后一个数组要大 则交换他们的位置
        if (arr[j] > arr[j + 1]) {
          // 交换位置 > 交换两个变量的方式
          let temp
          // 将arr[j] 变量的值 赋值为temp
          temp = arr[j]
          // 将arr[j + 1] 变量的值 赋值为arr[j]
          arr[j] = arr[j + 1]
          // 将temp 变量的值 赋值为arr[j + 1]
          arr[j + 1] = temp
        }
      }
    }
    console.log(arr)
  </script>
</body>

</html>

三、总结

在这里插入图片描述

前端-公瑾

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JavaScript

文章目录前言一、循环1.for循环基本使用1.循环中断1.循环嵌套二、数组1.数组是什么2.数组的基本使用3.操作数组4.数组案例三、总结前言掌握循环语句，让程序具备重复执行能力掌握数组声明及访问的语法一、循环1.for循环基本使用目标：掌握for循环重复执行某些代码1. for循环语法⚫ 也是重复执行代码⚫ 好处：把声明起始值、循环条件、变化值写到一起，让人一目了然⚫ for循环流程图⚫ for循环和while循环在使用上面有什么不同的应用场景呢？➢ 已知循环的次数的时
复制链接

扫一扫