掌握数组操作：创建、访问、遍历与高级API详解-优快云博客

本文链接：https://blog.youkuaiyun.com/weixin_45239190/article/details/119961153

1.创建

2.数组的访问

数组
引用数据类型

作用：用来保存多个值，可以保存任意数据类型
数组是以中括号[]为界限，值与值之间使用逗号分隔,数组长度属性length，数组长度是动态的

1.创建

1）数组字面量

  var arr = [1,2,3,4]
  //arr.length  => 4
  var arr = [123,"hello",true,null];

2)构造函数

var arr = [元素1,元素2....元素N];
var arr = [123,"hello",true,null];

        var arr = new Array() =>空数组[] =>间接Object
        arr.length => 0
        传递一个参数：给数组指定一个数组长度 var arr1 = new Array(5) ，arr.length = 5
        传递多个参数：相当于初始化数组 var arr1 = new Array(1,2) => [ 1, 2 ]

2.数组的访问

数组下标，数组下标是从0开始的，一直到数组的长度-1,如果访问下标超过数组长度，不报错，但是会返回undefined

arr[i]

    arr[0]  =>1
    arr[1]  =>2
    arr[4]  =>undefined  溢出
    var arr = ['tom',12]               arr[0]    0:'tom',1:12
    arr[2] = true
    var obj = {name:'tom',age:12}      obj.name || obj['name']
    obj.gender = '男'

给数组添加项：arr[下标] = 值（任意数据类型）
删除数组项：arr.length = arr.length - 3

修改length

如果修改后的length大于原长度，则多出的部分会空出来

如果修改后的length小于原长度，则原数组中多出的元素会被删除

//向数组的最后一个位置添加元素
 arr[arr.length] = 70;

3.数组的遍历

1）forEach

数组.forEach(function(value , index , obj){  
  //value:正在遍历的元素
  //index:正在遍历元素的索引
  //obj:被遍历对象
});

var arr = ["sun","zhu","sha"];
   arr.forEach(function(value,index,obj)){
   console.log("value = "+value);
}

2）for循环

        <script type="text/javascript">
			//创建数组
			var arr = ["sun","zhu","sha"];
			
			//遍历数组
			for(var i=0;i<arr.length;i++){
				console.log(arr[i]);
			}
		</script>

4.数组的检测

//使用typeof检查数组时，会返回object
console.log(typeof arr);     //object

instanceOf arr(目标) instanceOf Array =>是数组，返回true，不是数组，返回false
Array.isArray(arr)

5.数组序列化

toString() 默认将数组的每一项使用“,”隔开，以字符串的形式输出
join(参数) 将数组的每一项以想要的符号分开，以字符串的方式输出

var arr = [1,2,3,4,5,6,7]
//toString()
console.log(arr.toString())   //1,2,3,4,5,6,7

//join()
console.log(arr.join('~'))     //1~2~3~4~5~6~7

6.数组的API

var arr = ["sun","zhu","sha"];

    栈、队列方法：改变原数组
        栈（先进后出，后进先出）
            pop()   移除数组中的最后一个项并且返回该项，同时将数组的长度减一

var result = arr.push("tang","zhi","bai");
console.log(arr);  //Array(6) [ "sun", "zhu", "sha", "tang", "zhi", "bai" ]
console.log("result = "+result);  //6

push() 可接受任意类型的参数，将它们逐个添加到数组的末尾，并返回数组的长度

arr.pop();
console.log(arr);  //Array(5) [ "sun", "zhu", "sha", "tang", "zhi" ]

队列（先进先出，后进后出）
shift() 移除数组中的第一个项并且返回该项，同时将数组的长度减一

arr.shift();
console.log(arr);   //Array(5) [ "sun", "zhu", "sha", "tang", "zhi" ]

unshift() 在数组的前端添加任意个项，并返回数组的长度

arr.unshift("niu");
console.log(arr);   //Array(6) [ "xin", "sun", "zhu", "sha", "tang", "zhi" ]

    排序
        reverse() 反转数组项的顺序，改变原数组

arr.reverse();

        sort()
            默认排序：该方法会调用每个数组项的toString() 方法，然后按照字符序列排序
            自定义排序：
                a.该方法可以接受一个比较函数作为参数，比较函数有两个参数
                b.如果第一个参数位于第二个参数之前，返回负数
                c.如果第一个参数位于第二个参数之后，返回正数

var arr = [2,15,27,55,39,13,4,6]
var a = arr.sort(function(a,b){
    if(a>b){
         return 1
     }else if(a<b){
        return -1
     }else{
         return 0
     }
    //return a-b  升序
    //return b-a   降序
})
console.log(a)

截取方法
concat

数组的拼接 不改变原数组 返回副本

var arr = ["sun","zhu","sha"];
var arr2 = ["baigu","yutu","zhihzu"];
var arr3 = ["baigu","yutu","zhihzu"];
			
var result = arr.concat(arr2,arr3,"niu","tie");
console.log(result);

slice

截取数组 不改变原数组 截取到的数组

slice(a) 从a开始截取，一直到数组结束

slice(a,b) 从a开始截取，一直到第b项，但是不包含第b项 => [a,b)

splice

删除 splice(a,b) 从第a项开始删除，删除b项返回删除掉的项

插入 splice(a,0,b,c,d) 从第a项开始，插入，插入b,c,d 返回空数组

替换 splice(a,b,i1,i2,i3) 从第a项开始，删除b项，将i1,i2,i3插入

    索引方法
        indexOf()
            从数组开头向后查找，使用全等操作符，找不到该元素返回-1。
            第一个参数为要查找的项，第二个参数（可选）为索引开始位置
        lastIndexOf()
            从数组末尾向前查找，使用全等操作符，找不到该元素返回-1。
            第一个参数为要查找的项，第二个参数（可选）为索引开始位置

    迭代方法
        参数：每一项上运行的函数，运行该函数的作用域对象（可选）
        every()
            对数组中的每一元素运行给定的函数，如果该函数对每一项都返回true，则该函数返回true
        some()
            对数组中的每一运行给定的函数，如果该函数对某一项返回true，则返回true
        filter()
            对数组中的每一项运行给定的函数，会返回满足该函数的项组成的数组
        map()
            对数组中的每一元素运行给定的函数，返回每次函数调用的结果组成的数组
        forEach()
            对数组中的每一元素运行给定的函数，没有返回值，常用来遍历元素

var arr = [1,2,5,7,8,6]
 var r = arr.every(function(item,index,arr){
    return item>2
 })

 var r2 = arr.some(function(item,index,arr){
     return item>2
 })

var r3 = arr.filter(function(item,index,arr){
    return item>4
})

var r4 = arr.map(function(item,index,arr){
    return item*2
})

var r5= []
arr.forEach(function(item,index,arr){
    //console.log(item);
    r5.push(item)
})

 console.log(r)    //false  所有的元素都大于2不对
 console.log(r2)   //true   有大于2的元素
 console.log(r3);   //[ 5, 7, 8, 6 ]  返回大于4的元素
 console.log(r4);   //[ 2, 4, 10, 14, 16, 12 ]
 console.log(r5);