JavaScript基础(16)_数组方法、数组遍历、foreach

原创已于 2023-01-12 22:56:47 修改 · 514 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #前端

于 2023-01-12 22:52:59 首次发布

JavaScript 专栏收录该内容

36 篇文章

订阅专栏

本文详细介绍了JavaScript中数组的一些主要操作方法，如unshift用于在数组开头添加元素，push在末尾添加，shift移除首元素，pop移除末元素，concat连接数组，join转换为字符串，reverse反转数组，sort进行排序，以及splice删除和插入元素。此外，还提到了for循环和forEach遍历数组的方法，以及sort方法的自定义排序规则。文章最后展示了对象数组的处理示例。

数组方法

unshift():向数组开头添加一个或多个元素，并返回新的数组长度。向前边插入元素以后，其他的元素索引会依次调整。

push():向数组的末尾添加一个或多个元素，并返回数组新的长度。该方法会将数组新的长度作为返回值返回。

shift():删除数组的第一个元素，并将被删除的元素作为返回值返回。

pop():删除数组的最后一个元素，并将被删除的元素作为返回值返回。

concat():连接两个或多个数组，并将新的数组返回。该方法不会对原数组产生影响。

join():将数组转换为一个字符串。该方法不会对原数组产生影响，而是将转换后的字符串作为结果返回。在join()中可以指定一个字符串作为参数，这个字符串将会成为数组中元素的连接符，如果不指定连接符，则默认使用，作为连接符。

reverse():反转数组(前边的去后边，后边的去前边)。该方法会直接修改原数组。

sort():可以用来对数组中的元素进行排序。该方法会影响原数组，默认会按照Unicode编码进行排序。

sort()数值排序

我们可以自己修改回调函数来指定排序的规则，回调函数需要两个形参，浏览器将会分别使用数组中的元素作为实参去调用回调函数，使用哪个元素调用不确定，但是肯定是在数组中a一定在b前边，浏览器会根据回调函数的返回值来决定元素的顺序。如果返回一个大于0的值，则元素会交换位置，如果返回0或者负数，则元素位置不变。

根据自定义评判标准:

a 小于 b，在排序后的数组中 a 应该出现在 b 之前，就返回一个小于 0 的值。

如果 a 等于 b，就返回 0。

如果 a 大于 b，就返回一个大于 0 的值。

因此对数值进行排序可以增加回调函数，修改为：

数值升序排列：return a-b；

arr.sort(function(a,b){return a-b;})

数值降序排列：return b-a；

arr.sort(function(a,b){return b-a;})

slice(start,end):从某个已有的数组返回选定的元素。该方法不会改变原数组，而是将截取到的元素封装到一个新数组中返回。

参数：

1.截取开始位置的索引，包含开始索引。

2.截取结束位置的索引，不包含结束索引。第二个参数可以省略不写，此时会截取从开始索引往后的所有元素。

注意：参数也可以传递一个负值，表示从后往前计算，可以理解为倒数第~

splice():删除数组中的指定元素。使用splice()会影响到原数组，会将指定元素从原数组中删除，并将删除的元素作为返回值返回。

参数：

第一个，表示开始位置的索引。

第二个，表示删除的数量。

第三个及以后。。，可以传递一些新的元素，这些元素将自动插入到开始位置索引前边。

数组遍历

for循环遍历数组

for(var i=0;i<arr.length;i++){

console.log(arr[i]);

}

forEach()

语法 arr.forEach(function(value, index, arr), this);

value(必须): 当前遍历时的数组值。

index(可选): 当前遍历时的索引值。

arr(可选): 数组对象本身。

this(可选): 执行回调函数时的。

注意：forEach()方法需要一个函数作为参数。像这种函数由我们创建但是不由我们调用的，我们称之为回调函数。数组中有几个元素函数就会执行几次。

示例：

<script>
        var arr = ["张三","李四","王五"];
        var result = arr.push("赵六","朱七","江八");
        console.log(arr,result);
        var result = arr.unshift("余一","秦二");
        console.log(arr,result);
        arr.shift();
        var result = arr.shift();
        console.log(arr,result);
        arr.pop();
        var result = arr.pop();
        console.log(arr,result);
        console.log(arr.slice(0,2));
        console.log(arr,arr.splice(0,1,"余一","秦二","张三"))
        console.log(arr.join("__"));
        console.log(arr.reverse());
        arr2 = [1,3,11,2,8,12];
        console.log(arr2.sort(function(a,b){return a-b;}))

        // 创建类名为人的对象
        function Person(name,age){
            this.name = name;
            this.age = age;
        }
        // 修改toString方法
        Person.prototype.toString = function(){
            return "Adult:[name = "+this.name+",age = "+this.age+"]";
        };
        var per = new Person("张三",18);
        var per2 = new Person("李四",28);
        var per3 = new Person("王五",8);
        var per4 = new Person("赵六",12);
        var per5 = new Person("朱七",32);
        // 将对象纳入数组
        var perArr = [per,per2,per3,per4,per5];
        // 建立新数组，筛选年龄大于等于18的成年人信息
        function arrAdult()
        {
            var adult_per =[];
            for(i=0;i<perArr.length;i++)
            {
                if(perArr[i].age>=18) {
                    adult_per.unshift(perArr[i]);
                }             
            }
            return adult_per;
        }
        // 将成人信息返回给变量adult
        var adult = arrAdult();
        console.log(adult);
        console.log(adult.toString());
        adult.forEach(function(a){console.log(a);});
    </script>