03-js循环&数组

孙小明的测试修炼手册

已于 2023-06-29 01:50:54 修改

阅读量47

点赞数

分类专栏：前端实战-JS 文章标签： javascript 前端开发语言

于 2023-06-29 01:04:39 首次发布

本文链接：https://blog.csdn.net/weixin_44431329/article/details/131447686

版权

前端实战-JS 专栏收录该内容

5 篇文章 0 订阅

订阅专栏

1、for循环

格式：

for(起始值：循环条件;变化值){
循环体
}

案例

利用for循环输入1到100岁

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        for(let i= 0;i<=100;i++){
            document.write('当前的年龄为：'+ i +"岁")
        }
    </script>
</body>
</html>

计算1到100的偶数和

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        let sum = 0;

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

    </script>
</body>
</html>

循环数组

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        let arr = ['张三','李四','王五']
        for (let i = 0; i < arr.length; i++) {
            console.log(arr[i]);
        }
    </script>
</body>
</html>

2、数组

1、声明数组

 let arr = ['张三','李四','王五']

数组是按照顺序保存的，所以每个数据都有自己的编号
数组的索引为0
数组可以存储任意数据

2、数组的取值

格式：

数组名[索引下标]

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        let arr = ['张三','李四','王五']
        arr[1]
    </script>
</body>
</html>

3、数组的长度

格式

数组名.length

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        let arr = ['张三','李四','王五']
        ar.length
    </script>
</body>
</html>

4、数组的遍历

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        let arr = ['张三','李四','王五']
        for (let i = 0; i < arr.length; i++) {
            console.log(arr[i]);
        }
    </script>
</body>
</html>

5、数组添加数据

push
数组名.push(元素1,元素2) 将一个或者多个元素添加到数组的末尾，并返回该数组的长度
格式：

数组名.push(元素1,元素2)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        let arr = ['张三']
        arr.push('李四')
    </script>
</body>
</html>

unshift
数组名.push(元素1,元素2) 将一个或者多个元素添加到数组的开头，并返回该数组的长度
格式：

数组名.unshift(元素1,元素2)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        let arr = ['张三']
        arr.unshift('李四')
    </script>
</body>
</html>

6、删除数组元素

shift删除数组元素
shift()方法从数组中删除第一个元素，并返回该数组的值
格式：

arr.shift()

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        let arr = ['张三']
        arr.shift('李四')
    </script>
</body>
</html>

pop()删除最后的元素
格式：

arr.pop()

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        let arr = ['张三']
        arr.pop()
    </script>
</body>
</html>

splice删除数组元素
格式：

arr.splice(起始位置，删除第几个元素)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        let arr = ['张三']
        arr.splice(0,1)
    </script>
</body>
</html>

孙小明的测试修炼手册

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
03-js循环&数组

格式：案例计算1到100的偶数和循环数组2、数组1、声明数组数组是按照顺序保存的，所以每个数据都有自己的编号数组的索引为0数组可以存储任意数据2、数组的取值格式：3、数组的长度格式4、数组的遍历5、数组添加数据push数组名.push(元素1,元素2) 将一个或者多个元素添加到数组的末尾，并返回该数组的长度格式：unshift数组名.push(元素1,元素2) 将一个或者多个元素添加到数组的开头，并返回该数组的长度格式：6、删除数组元素
复制链接

扫一扫