javascript数组的使用总结

最新推荐文章于 2023-04-28 13:56:40 发布

原创最新推荐文章于 2023-04-28 13:56:40 发布 · 389 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript

javascript 专栏收录该内容

37 篇文章

订阅专栏

本文详细介绍了JavaScript中的数组数据类型，包括创建方法、检测方法、转换方式及数组拷贝等。此外，还介绍了数组的栈方法、队列方法和重排序方法。

数组属于什么数据类型

让我们一起复习一下吧：

javascript基本数据类型有五种：Number、String、Undefined、boolean、Null
引用类型有：
引用类型是一种数据结构，将数据和功能组织在一起：
Object、Array、Date、RegExp、Function
基本包装类型： Boolean、Number、String
单体内置对象：Global、Math

javascript数组和其他不同之处：

js数组可以保存任何数据类型的项在同一个数组里面，比如第一项是数字，第二项是字符串，第三项是对象……

创建数组：

使用Array构造函数：
传入一个参数时，参数如果是数字，则代表新的数组的长度为该数字，如果其他类型的参数，则代表是包含该数据一项的数组；
传入多个参数时，参数依次做为数组的项；

 var array1 = new Array(3); //表示array1是一个长度为3的数组
 var array2 = new Array("a","b", "c", "d"); //表示：数组["a","b", "c", "d"]；

数组字面量

 var array1 = ["a","b", "c", "d"]；
 var array2 = [];//创建了一个空数组
 var array3 = [1,2,3,]//创建了3个或者4个项的数组,不同的浏览器不同；

检测数组：

方法一：instanceof操作符

if (value instanceof Array){
  //...进行某些操作
 }

instanceof 操作符的问题在于，它假设只有一个全局执行环境，如果网页中包含多个框架，那么它存在两个不同以上的全局执行环境，从而存在两个不同版本的Array构造函数。当从一个框架传入一个数组与第二框架中原生创建数组分别具有各自不同的构造函数。

方法二: Array.isArray()方法

为了解决instanceof操作符存在的问题，es5新增了Array.isArray()方法，这个方法最终目的是为了确定这个值是不是数组，不管是哪个全局环境创建的；

if (Array.isArray(value){
  //...
 }

字符串和数组的转换方法：

数组转换成字符串

所有的对象都有toLocaleString（），toString（）和valueof（）方法。
调用toString（）方法会返回由数组中每个值的字符串形式拼接而成的一个以逗号分隔的字符串。
调用valueof（）返回的还是数组，实际上，为了创建这个字符串会调用数组的每一项toString（）方法；
调用localeString()方法，也会返回由数组中每个值的字符串形式拼接而成的一个以逗号分隔的字符串，不同的是，为每一项调用tocaleString()方法；

  var array1 = ['a','b','c'];
    console.log(array1.toString());//"a,b,c"
    console.log(array1.valueOf());// ["a", "b", "c"]
  var array2 = [1,'a','b','c'];
    console.log(array2.valueOf());//[1, "a", "b", "c"]
    console.log(array2.toString());//"1,a,b,c"

join()方法，传入的参数为分隔字符，用来分隔数组的每一项，从而组成数组

var array1 = [1,'a','b','c'];
console.log(array1.join("||"));// "1||a||b||c"

将字符串转换成数组

字符串对象调用split()方法可以生成数组，参数为切割字符串的字符，举一个栗子看看吧：

var string = "i am a pretty girl";
console.log(string.split(" "));//["i", "am", "a", "pretty", "girl"]

数组的潜拷贝和深拷贝

什么是浅拷贝

把一个数组整体直接赋值给另一个变量的时候，这个变量只是得到了数组的引用；这个时候相当于有两个名字和这个数组相对应，通过一个引用改变数组的值，另一个引用也会得到改变；
下面举个例子看看浅拷贝

var array1 = ['a','b', 'c', 'd'];
var array2 = array1;
array1[0] = 'e';
console.log(array2[0]); // e

如何实现深拷贝

和浅拷贝相对，是将原数组中的每一个元素一个一个复制到新的数组当中；

 var array1 = ['a','b', 'c', 'd'];
function arrayCopy(oldArray){
   var newArray = []; 
   for (var i = 0; i < oldArray.length; i++){
   newArray[i] = oldArray[i];
 }
 return newArray; 
}
  var array2 = arrayCopy(array1);
  console.log(array2);
  array1[0] = "e";
  console.log(array2[0]);//["a", "b", "c", "d"]

栈方法、队列方法

这里写图片描述

push()和pop（）方法实现栈方法；
shift（）和push()方法实现队列方法；

重排序方法：

reverse()反转数组；

var array1 = ['a','b', 'c', 'd'];
console.log(array1.reverse());//["d", "c", "b", "a"]

sort(); 自定义排序规则

当没有参数时，默认按照字符串的比较方法；
sort（）接收一个排序函数函数作为规则；
这个排序函数接收两个参数，分别是前一项和后一项；函数有三个，返回值当返回值为正时前一项移到后一项的后面；当为负数时，前一项调整到后一项的前面；返回0时，位置不变；
举个栗子看看：

  var values = [0,1,56,23,34,3];
        values.sort(function compare(value1,value2){
            if (value1 < value2) {
                console.info(values);
                return -1;
            } else if (value1 > value2) {
                console.info(values);
                return 1;
            }else{
                console.info(values);
                return 0;
            }
        });
        console.log(values);//0,1,3,23,34,56