js数组操作记录
一 .splice()
方法向/从数组中添加/删除项目,然后返回被删除的项目。
arrayObject.splice(index,howmany,item1,.....,itemX)
| 参数 | 描述 |
| index | 必需。整数,规定添加/删除项目的位置,使用负数可从数组结尾处规定位置。 |
| howmany | 必需。要删除的项目数量。如果设置为 0,则不会删除项目。 |
| item1, ..., itemX | 可选。向数组添加的新项目。 |
事例:
let a=[1,2,3];
a.splice(1,1,666);
console.log(a);//[1,666,3]
二 .slice()
slice() 方法可从已有的数组中返回选定的元素。
arrayObject.slice(start1,end2)
| 参数 | 描述 |
| start1 | 必需。规定从何处开始选取。如果是负数,那么它规定从数组尾部开始算起的位置。也就是说,-1 指最后一个元素,-2 指倒数第二个元素,以此类推。 |
| end2 | 可选。规定从何处结束选取。该参数是数组片断结束处的数组下标。如果没有指定该参数,那么切分的数组包含从 start 到数组结束的所有元素。如果这个参数是负数,那么它规定的是从数组尾部开始算起的元素。 |
事例:
let a=[1,2,3,4,5];
console.log(a.slice(1,4)); //[2,3,4]
三 .concat()
方法用于连接两个或多个数组。
该方法不会改变现有的数组,而仅仅会返回被连接数组的一个副本。
返回一个新的数组。该数组是通过把所有 arrayX 参数添加到 arrayObject 中生成的。如果要进行 concat() 操作的参数是数组,那么添加的是数组中的元素,而不是数组。
arrayObject.concat(X,X,......,X)
| 参数 | 描述 |
| X | 必需。该参数可以是具体的值,也可以是数组对象。可以是任意多个。 |
事例:
let a=[1,2,3];
let b=[4,5,6];
console.log(a.concat(b));//[1,2,3,4,5,6]
console.log(a.concat(4,5,6));//[1,2,3,4,5,6]
四 .sort()
方法用于对数组的元素进行排序。
arrayObject.sort(sortby)
| 参数 | 描述 |
| sortby | 可选。规定排序顺序。必须是函数。 |
sortby函数应该具有两个参数 a 和 b,其返回值如下:
- 若 a 小于 b,在排序后的数组中 a 应该出现在 b 之前,则返回一个小于 0 的值。
- 若 a 等于 b,则返回 0。
- 若 a 大于 b,则返回一个大于 0 的值。
事例:
let a = [2, 4, 1, 3];
console.log(a.sort(function(a, b) {
return a-b;
})); //[1,2,3,4]
五 . for of
1 .es6里的新功能 用来遍历数组 参考 :Iterator和for...of循环
2 .for in 与 for of的区别:
简单说,for in是遍历键名,for of是遍历键值。
let arr = ["a","b"];
for (a in arr) {
console.log(a);//1,2
} for (a of arr) {
console.log(a);//a,b
}
由于for of的这个特性,他还可以实现对iterator对象的遍历,而for in就是简单的遍历了。
六 . reverse()
用于颠倒数组中元素的顺序。会改变原来的数组,而不会创建新的数组。
var a = [2, 4, 1, 3];
console.log(a.reverse());//[3,1,4,2]
方法会返回颠倒后的数组。
七 . indexof()
array.indexOf(searchElement[, fromIndex])
返回整数索引值,如果没有匹配(===),返回-1. fromIndex可选,表示从这个位置开始搜索,
若缺省或格式不合要求,使用默认值0。
var a="123";
console.log(a.indexOf(2));//
var ab=['1','2','3'];
console.log(b.indexOf('2'));//-1
八 . filter()
array.filter(function( currentValue , index , arr ) , thisValue)
filter方法创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素。filter不会对空数组进行检测,且不会改变原始数组。
| 参数 | 描述 | ||||||||
| function( currentValue , index , arr ) |
数组中的每个元素都会执行这个函数。
|
||||||||
| thisValue | 可选。对象作为该执行回调时使用,传递给函数,用作 "this" 的值。 如果省略了 thisValue ,"this" 的值为 "undefined" |
var arr2 = [{
"name": "apple",
"count": 2
},
{
"name": "orange",
"count": 5
},
{
"name": "pear",
"count": 3
},
{
"name": "orange",
"count": 16
},
];
var newArr = arr2.filter(function(item, idx, arr) {
console.log(item, idx, arr);
return item.name == 'orange';
});
console.log(newArr);
let spread = [12, 5, 8, 8, 130, 44, 130];
spread = spread.filter(function(item, idx, arr) {
return arr.indexOf(item) === idx;
});
console.log('数组去重结果', spread);
九 .reduce()
array.reduce(function( result, currentValue ,currentIndex, arr ),initObj)
reduce() 方法接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。
| 参数 | 描述 | ||||||||||
| function(result, currentValue, currentIndex,arr) |
|
||||||||||
| initObj | 可选,第一次循环传入的初始值 |
var arr2 = [1,2,3,4,5];
var total = arr2.reduce(function(total, currentValue, currentIndex, arr) {
total[currentIndex]=currentValue;
return total;
},[]);
console.log(total);//1,2,3,4,5
注意:在不传initialObj参数的情况下,reduuce的回调函数是从第二个元素( [ 1 ] )开始执行的,所以第一次执行函数里的result参数是( [ 0 ] ) !
十 .pop()
用于删除并返回数组的最后一个元素。
var arr = [1,2,3]
console.log(arr.pop());//
十一 .最后
今天就了做一下js数组方面的基础知识的收集。用于经常为自己知识的巩固。
js数组操作记录的更多相关文章
- js数组操作-添加,删除
js 数组操作常用方法. push():在数组后面加入元素,并返回数组的长度 unshift():在数组前面加入元素,并返回数组的长度 pop()删除最后一个元素 shift()删除第一个元素 var ...
- 页面循环绑定(变量污染问题),js面向对象编程(对象属性增删改查),js字符串操作,js数组操作
页面循环绑定(变量污染问题) var lis = document.querySelectorAll(".ul li") for ( var i = 0 ; i < lis. ...
- js数组操作-最佳图解
js数组操作-最佳图解
- js数组操作find查找特定值结合es6特性
js数组操作find查找特定值结合es6特性
- JS数组操作:去重,交集,并集,差集
原文:JS数组操作:去重,交集,并集,差集 1. 数组去重 方法一: function unique(arr) { //定义常量 res,值为一个Map对象实例 const res = new Map ...
- js数组操作
用 js有很久了,但都没有深究过js的数组形式.偶尔用用也就是简单的string.split(char).这段时间做的一个项目,用到数组的地方很多, 自以为js高手的自己居然无从下手,一下狠心,我学! ...
- js数组操作【转载】
用 js有很久了,但都没有深究过js的数组形式.偶尔用用也就是简单的string.split(char).这段时间做的一个项目,用到数组的地方很多,自以为js高手的自己居然无从下手,一下狠心,我学!呵 ...
- php数组转换js数组操作及json_encode应用
对于php,个人感觉能够熟练操作数组和字符串,基本上已经是入门了,php本身有很多操作数组和字符串的函数,今天在做一个功能时,需要用Js动态的创建门店信息,这些信息是要从后台添加的,想来想去,通过ph ...
- js 数组操作大集合
js数组的操作 用 js有非常久了,但都没有深究过js的数组形式.偶尔用用也就是简单的string.split(char).这段时间做的一个项目.用到数组的地方非常多.自以为js高手的自己竟然无从下手 ...
随机推荐
- qt中线程的使用方法
QT中使用线程可以提高工作效率. 要使用线程要经过一下四个步骤: (1)先创建一个c++ class文件,记得继承Thread,创建步骤如下: a.第一步 b.第二步 (2)自定义一个run函数,以后 ...
- Spring aop 注解参数说明
在spring AOP中,需要使用AspectJ的切点表达式语言来定义切点. 关于Spring AOP的AspectJ切点,最重要的一点是Spring仅支持AspectJ切点指示器(pointcut ...
- Linux 下Beanstalk安装
1.安装 # wget https://github.com/kr/beanstalkd/archive/v1.10.tar.gz # tar xzvf v1.10 # cd beanstalkd-1 ...
- 鸟哥的linux私房菜学习-(一)优缺点分析以及主机规划与磁盘分区
一.linux的优缺点 那干嘛要使用Linux做为我们的主机系统呢?这是因为Linux有底下这些优点: 稳定的系统:Linux本来就是基于Unix概念而发展出来的操作系统,因此,Linux具有与Uni ...
- LeetCode题目总结(一)
我的代码在github上,https://github.com/WINTERFELLS/LeetCode-Answers 这里只提供个人的解题思路,不一定是最好的. Problems1-20 寻找两个 ...
- 项目实战10.1—企业级自动化运维工具应用实战-ansible
实战环境: 公司计划在年底做一次大型市场促销活动,全面冲刺下交易额,为明年的上市做准备.公司要求各业务组对年底大促做准备,运维部要求所有业务容量进行三倍的扩容,并搭建出多套环境可以共开发和测试人员做测 ...
- angular4.0单个标签不能同时使用ngFor和ngIf
这个问题估计是ng4严格了语法规范的原因. 介于这篇太短,附上图助助兴致 解决办法: <div *ngFor="表达式"> <ng-container *ngIf ...
- QTableView表格自动拉伸
QTableView有四个关于自动拉伸的函数: void resizeColumnToContents(int column); void resizeColumnsToContens(); void ...
- 2017 年的 人生 hard 模式终于结束了,2018年回归初心(二)
今天周末, 深圳的天气简直好的不像话.好了,我们继续之前的话题往下聊. >>>猎头 : 关于猎头这个行业,以笔者的感觉来说 一般你工作年限未超过三年的话,你是很难遇到猎头来推送你的简 ...
- 简易 bokeh 图像散景效果算法实现
bokeh百度百科的解释 摄影镜头光圈大小和拍摄距离决定了拍摄时的景深,相对于焦点位置,焦点前与焦点后的被拍摄物体会显得模糊,这个模糊区域被称为焦外.焦外具体的模糊程度还受到镜头中镜片单体和组合的物理 ...