【JavaScript】32_数组初步

简介: # 1、简介数组(Array)- 数组也是一种复合数据类型,在数组可以存储多个不同类型的数据- 数组中存储的是有序的数据,数组中的每个数据都有一个唯一的索引 可以通过索引来操作获取数据- 数组中存储的数据叫做元素- 索引(index)是一组大于0的整数- 创建数组 通过Array()来创建数组,也可以通过[]来创建数组- 向数组中添加元素 语法: 数组[索引] = 元素- 读取数组中的元素 语法: 数组[索引] - 如果读取了一个不存在的元素,不好报错而是返回undefined- length - 获取数组的长

1、简介

数组(Array)

  • 数组也是一种复合数据类型,在数组可以存储多个不同类型的数据
  • 数组中存储的是有序的数据,数组中的每个数据都有一个唯一的索引
    可以通过索引来操作获取数据
  • 数组中存储的数据叫做元素
  • 索引(index)是一组大于0的整数
  • 创建数组
    通过Array()来创建数组,也可以通过[]来创建数组
  • 向数组中添加元素
    语法:

    数组[索引] = 元素
    
  • 读取数组中的元素
    语法:

    数组[索引]
    - 如果读取了一个不存在的元素,不好报错而是返回undefined
    
  • length

    • 获取数组的长度
    • 获取的实际值就是数组的最大索引 + 1
    • 向数组最后添加元素:
      数组[数组.length] = 元素
    • length是可以修改的
    <script>
        const obj = {name:'孙悟空',age:18}

        const arr = new Array()
        const arr2 = [1,2,3,4,5]//数组字面量

        arr[0] = 43
        arr[1] = 22
        arr[2] = 44
        arr[3] = 88
        arr[4] = 99

        // 使用数组时,应该避免非连续数组,因为它性能不好
        // arr[100] = 99

        // console.log(arr[1])
        // console.log(typeof arr) // object
        // console.log(arr.length)

        arr[arr.length] = 33;
        arr[arr.length] = 66//没有用,因为越界

        arr.length = 5
        console.log(arr)
    </script>

2、遍历数组

遍历数组

- 遍历数组简单理解,就是获取到数组中的每一个元素

    <script>
        //任何类型的值都可以成为数组中的元素
        let arr = [1,'hello',true,null,{name:'孙悟空'},() => {}]

        //创建数组时尽量要确保数组中存储的数据的类型是相同类型的
        arr = ['孙悟空','猪八戒','沙和尚']
        console.log(arr)

        arr = ['孙悟空','猪八戒','沙和尚','唐僧','白骨精']  
        for(let i = 0; i < arr.length-1; i++){
            console.log(arr[i])
        }

        for(let i = arr.length-1; i >= 0; i--){
            console.log(arr[i])
        }

        /* 
            定义一个Person类,类中有两个属性name和age
                然后创建几个Person对象,将其添加到一个数组中

            遍历数组,并打印未成年人的信息
        */

        class Person {
            constructor(name,age){
                this.name = name;
                this.age = age;
            }
        }

        const personArr = [
            new Person('孙悟空',18),
            new Person('沙和尚',25),
            new Person('红孩儿',9)
        ]
        
        for(let i = 0; i < personArr.length; i++){
            if(personArr[i].age < 18){
                console.log(personArr[i])
            }
        }
    </script>

3、for-of语句

for-of语句可以用来遍历可迭代对象

语法:

for(变量 of 可迭代的对象){

​ 语句...

}

执行流程:

for-of的循环体会执行多次,数组中有几个元素就会执行几次,

​ 每次执行时都会将一个元素赋值给变量

    <script>
        const arr = ['孙悟空','猪八戒','沙和尚','唐僧']
        for(let value of arr){
            console.log(value)
        }

        for(let value of 'hello'){
            console.log(value)
        }
    </script>
相关文章
|
19天前
|
自然语言处理 前端开发 JavaScript
🛠️ JavaScript数组操作指南:20个精通必备技巧🚀
本文详细介绍了 JavaScript 中的 20 个高效数组操作技巧,涵盖了从基本的添加、移除元素,到数组转换和去重等高级操作。强调了不可变性的重要性,提供了清晰的代码示例,帮助开发者编写更整洁和高效的代码。无论是新手还是经验丰富的开发者,这些技巧都将显著提升您的编码能力,使您在项目中更具竞争力。
16 2
|
23天前
|
JavaScript 前端开发 测试技术
JS都有哪些操作数组的方法
JS都有哪些操作数组的方法
19 3
|
24天前
|
JavaScript
js删除数组中已知下标的元素
js删除数组中已知下标的元素
33 4
|
23天前
|
缓存 JavaScript 前端开发
JavaScript中数组、对象等循环遍历的常用方法介绍(二)
JavaScript中数组、对象等循环遍历的常用方法介绍(二)
27 1
|
26天前
|
JavaScript 前端开发 Java
【javaScript数组,函数】的基础知识点
【javaScript数组,函数】的基础知识点
22 5
|
30天前
|
JavaScript 前端开发 索引
探索JavaScript数组:基础
探索JavaScript数组:基础
16 3
|
29天前
|
JavaScript 前端开发 索引
JS 删除数组元素( 5种方法 )
JS 删除数组元素( 5种方法 )
28 1
|
1月前
|
JavaScript 前端开发
如何在JS中声明一个数组
如何在JS中声明一个数组
18 0
|
1月前
|
存储 JavaScript 前端开发
JavaScript Array(数组) 对象
JavaScript Array(数组) 对象
24 3
|
23天前
|
JavaScript 前端开发 API
JS中数组的方法flat()怎么用
JS中数组的方法flat()怎么用
13 0