web学习笔记（十四）

shan33__

已于 2024-03-07 14:52:49 修改

阅读量1.6k

点赞数 46

分类专栏：笔记文章标签：学习笔记算法前端

于 2024-01-10 11:48:48 首次发布

本文链接：https://blog.csdn.net/shan33__/article/details/135483054

版权

笔记专栏收录该内容

83 篇文章 6 订阅

订阅专栏

本文详细介绍了JavaScript数组的基础概念、创建方式、索引与获取、遍历、长度检测、数据类型、操作（增删查改）、浅拷贝与深拷贝的区别，以及常用数组方法如冒泡排序和数组排序技巧。

摘要由CSDN通过智能技术生成

1.数组

1.1数组的概念

数组Array是指一组数据的集合，其中的每个数据被称作元素，在数组中可以存放任意类型（字符串，数字，布尔值等）的元素。数组是一种将一组数据存储在单个变量名下的存储方式。数组是引用类型，而不是基本数据类型。

1.2数组的创建

（1）利用 new 创建数组

var 数组名 = new Array();// 创建一个新的空数组

（2）利用数组字面量创建数组

1. 使用数组字面量方式创建空的数组 var 数组名 = [];
2. 使用数组字面量方式创建带初始值的数组 var 数组名 = ['小白','小黑','大黄','瑞奇'];
数组的字面量是方括号 [ ]

声明数组并赋值称为数组的初始化，数组初始化的方式有两种

         //方式一：构造函数
         var arr1=new Array(1,2,3,4,5,6,7,8,'asd');
        // 当Array后面的括号里面只包含了一个数字，而没有其他元素时，表示的时数组的长度为10，
        //而不是数组里面只包含了10一个元素
          var arr = new Array(10);
         //方式二：字面量
          var arr=[1,2,3,4,5,6,7,8,'asd'];

数组是引用数据类型。
这种字面量方式也是我们以后最多使用

1.3数组的索引和获取

（1）索引 (下标) ：用来访问数组元素的序号（数组下标从 0 开始），因此数组中的个数要比索引数大一。

（2）数组的获取：数组可以通过索引来访问、设置、修改对应的数组元素，我们可以通过“数组名[索引]”的形式来获取数组中的

// 定义数组
var arrStus = [1,2,3];
// 获取数组中的第2个元素
alert(arrStus[1]);

1.4数组的遍历、长度和检测数据类型

（1）数组的遍历：可以通过for循环把数组中的每个元素从头到尾都访问一次。

var arr = ['red','green', 'blue']; 
for(var i = 0; i < arr.length; i++){
console.log(arr[i]);
}

也可以用for...in循环进行遍历，前者遍历时会将没有存放数据的空位置打印出来undefined，后者只会打印有数据的位置。

  var arr = ['red', 'green', 'blue'];
        for (var k in arr) {
            console.log(arr[k]);
        }

（2）数组的长度：可以使用“数组名.length”可以访问数组元素的数量（数组长度），当我们数组里面的元素个数发生了变化，这个length 属性跟着一起变化。

var arrStus = [1,2,3]; 
alert(arrStus.length);	// 3

arr[arr.length]可以确保一直在数组最后一项添加元素。
当数组声明完成后，数组的长度仍然可以修改。

  var arr=[1,2,3];//声明一个数组，此时数组长度为3
       arr.length=5;//修改数组长度
       console.log(arr);

（3）检测数组的数据类型：可以通过运算符 instanceof来检测数组的数据类型，结果返回一个布尔值。

console.log(arr instanceof Array);//true

1.5数组的操作

（1）增

格式：数组名[索引号]=值; eg: arr[0]=12;

可以不按照顺序添加,没有数据的索引的位置表现为空属性（empty）
arr[arr.length]=值；表示始终在数组的末尾添加新值。

(2) 改

格式：数组名[索引号]=新值; eg: arr[0]=22;

（3）删（这两种方法都不是很好用，之后可以用内置方法进行完成操作）

① delete 数组名[索引号] 不是很好用，有隐藏问题，只能清除数据，但对应索引号位置还在。

②直接修改数组长度，（缺点：只能从尾部开始修改，选择删除尾部的几个数据；优点：删除数据后对应索引号的位置也不在了）

arr.length=3;

(4) 查

格式： console.log(数组名[索引号]);

当查看数组中一个未存放数据的位置时，控制台输出结果为undefined

   var arr = ['red', 'green', 'blue'];
        console.log(arr);
        console.log(arr[8]);

1.6深拷贝和浅拷贝

浅拷贝，指的是重新分配一块内存，创建一个新的对象，但里面的元素是原对象中各个子对象的引用，拷贝的是引用地址，如果修改任意一个数据，两个数组中数据同步修改。

        var arr = [1, 2, 34, 6, 7, 8, 98, 9];
        var arr1 = arr;
        console.log(arr, arr1);
        //(8) [1, 2, 34, 6, 7, 8, 98, 9] 
        //(8) [1, 2, 34, 6, 7, 8, 98, 9]
        arr1[3] = 33;//两个数组里面数据同步修改
        console.log(arr, arr1);
        // (8) [1, 2, 34, 33, 7, 8, 98, 9] 
        // (8) [1, 2, 34, 33, 7, 8, 98, 9]

深拷贝，是指重新分配一块内存，创建一个新的对象，并且将原对象中的元素，以递归的方式，通过创建新的子对象拷贝到新对象中，拷贝堆内存中数据，修改其中一个数组中的元素，另一个不会同步修改。因此，新对象和原对象没有任何关联。

        var arr = [1, 2, 34, 6, 7, 8, 98, 9];
        var arr1=[];
        for(let i=0;i<arr.length;i++){
            
            arr1[i]=arr[i];
        }
        console.log(arr, arr1);
        // (8) [1, 2, 34, 6, 7, 8, 98, 9]
        // (8) [1, 2, 34, 6, 7, 8, 98, 9]
        arr1[3] = 33;//两个数组里面数据不同步修改
        console.log(arr, arr1);
        //  (8) [1, 2, 34, 6, 7, 8, 98, 9]
        //  (8) [1, 2, 34, 33, 7, 8, 98, 9]

区别：浅拷贝，修改原数组或新数组，两个数组的值会同步修改，深拷贝，修改原数组或新数组，两个数组的值不会同步修改
本质区别：浅拷贝修改了值，不会新建一个内存地址的对象，深拷贝如果修改了值，及时复制了一份新的内存地址，原始地址的值不会被改变