由于本人最近工作原因,学习时间相对少了一些,今天趁着周末抽空总结了一下这段时间学习的JS数常用的10个函数。
1.push()方法在数组尾部添加一个新的元素,需要注意的是,该方法返回值是得到的新数组的长度。
语法arr.push(element1, element2, element3,...)
console.log(arr.push(1, 2, 3)); // 3console.log(arr); // [1, 2, 3]
2.pop()方法从数组中删除最后一个元素。
语法arr.pop()
console.log(arr.pop()); // 3
3.unshift()方法向数组的头部添加一个或多个元素,并返回新的数组长度。
语法arr.unshift(element1, element2, element3,...)
arr.unshift(1, 2, 3); // 3console.log(arr); // [1, 2, 3]
unshift方法不会创建新的数组,而是改变原来的数组。
4.join()按照指定分隔符将所有数组元素组合成为一个字符串。
语法arr.join(separator)
其中,separator为分隔符,默认是使用逗号作为分隔符的,同时,该方法返回的是一个字符串,通过分隔符把arr中的每个元素连接起来。
arr = ["电脑", "手机", "相册"];let res = arr.join('-');console.log(res); // 电脑-手机-相册
在JS中,字符串也可以当做数组来操作:
let str = "Hello";console.log(str[0], str[1], str[2], str[3], str[4]); // H e l l o
5.concat()通过合并现有数组来创建一个新的数组。
语法arr.concat(array1,array2,...,arrayX)
console.log("hello ".concat("world")); // hello worldconsole.log([1, 2, 3].concat([4, 5], [6, 7])); // [ 1, 2, 3, 4, 5, 6, 7 ]console.log([1, 2, 3].concat(123, ["php", true], { x: 1, y: 2 })); // [ 1, 2, 3, 123, "php", true, {x: 1,y: 2} ]
6.slice()从已有的数组中选定元素并返回一个新数组。
语法arr.slice(start, end)
参数说明:参数说明start必填参数,规定从什么地方开始取。若是负数,将从数组尾部开始计算,-1表示数组的最后一个元素,-2表示数组的倒数第二个元素,以此类推。end这是一个可选参数,规定了从何处结束取值,并且取得位置不包含该值,如果没有指定该参数,则从start一直取到末尾。
arr = [1, 2, 3, 4, 5];console.log(arr.slice(0, 3)); // [ 1, 2, 3 ]console.log(arr.slice(3)); // [4, 5]console.log(arr.slice(-2)); // [4, 5]
7.splice()方法可以从数组添加/删除指定的元素,并且返回的是一个存储了被删除项目的数组。
语法arr.splice(index, num, item1,item2,...,itemX)
参数说明参数说明index必填参数,规定了从何处添加/删除数组,若是负数,将从数组尾部开始计算,-1表示数组的最后一个元素,-2表示数组的倒数第二个元素,以此类推。num必填参数,规定了要删除的项目数量,如果为0,则表示不删除项目。item1,item2,...,itemX向数组中添加的新项目,该参数为可选参数
splice()方法的返回值是一个数组,里面包含了被删除的元素。
arr = [1, 2, 3, 4, 5];res = arr.splice(2); // [ 3, 4, 5 ]
可以利用该方法更新一个数组里面的元素,例如:
arr = [1, 2, 3, 4, 5];res = arr.splice(1, 2, 88, 99);console.log(res); // [2, 3]
从上面代码可以获取res的值为一个数组,就是被删掉的元素2,3,同时原来的数组arr被修改成了[1, 88, 99, 4, 5]
8.sort()可以对数组元素进行排序。
arr.sort(orderby)
参数说明orderby可选参数,规定了排序方式,注意:该参数必须是一个函数。
解释:sort()方法在参数留空的时候,默认是按照字母表的顺序排序的,如果要说得更准确的话,应该说它是按照元素的字符编码的顺序进行排序的。
如果是按照其他方法排序的话,就需要传一个函数进行比较了,该函数有两个参数a和b,然后我们比较这两个参数的差值即可得到排序:
当a - b < 0时,则a应该出现在b的前面,返回一个小于0的值;当a - b = 0时,则返回0;当a - b > 0时,则返回一个大于0的值arr = ["p", "b", "a"];// 默认按照字符表顺序排序console.log(arr.sort()); // [ "a", "b", "p" ]
现在我们新创建一个数组并对其进行排序:
arr = [10, 9, 22, 4];console.log(arr.sort);
通过测试,可以发现,数组内部的元素并没有按照数值大小从小到大的顺序排列,结果如图:
要实现这个功能,就必须在sort()方法内部传一个函数:
function sortArray(a, b) { return a - b;}console.log(arr.sort(sortArray));
以上方法可以使用箭头函数直接写在sort()方法内部:
console.log(arr.sort((a, b) => a - b));
这样就实现了排序,结果如图:
9.forEach()方法可以遍历数组。
语法arr.forEach(function (item, index, array), this)
参数说明function (item, index, array)必填参数,每个元素调用的函数。item 当前遍历的元素;index 当前元素的索引;array 当前遍历的数组。thisValue可选参数,传递给函数的值使用this的值。
10.filter()方法可以过滤出符合指定条件的元素,并返回一个新的数组,该方法不会改变原始数组,而是创建一个新的数组。
arr.filter(function (item, index, array), thisValue)
参数说明function (item, index, array)必填参数,每个元素调用的函数。item 当前遍历的元素;index 当前元素的索引;array 当前遍历的数组。thisValue可选参数,传递给函数的值使用this的值。
案例:获取数组里面的所有偶数值:arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13];res = arr.filter(item => !(item % 2));console.log(res); // [ 2, 4, 6, 8, 10, 12 ]
以上肯定不是所有Javascript的数组操作方法,我也是总结的我所学习到的常用方法,如果还有其他的方法,欢迎大家在评论区补充,有写的不对的地方,烦请各位大佬批评指正。
本站所有软件信息均由用户上传发布,版权归原著所有。如有侵权/违规内容,敬请来信告知邮箱:764327034@qq.com,我们将及时撤销! 转载请注明出处:https://www.ssyg068.com/kuaixun/2683.html
发表回复
评论列表(0条)