js数组操作方法
数组的操作方法在js中可谓是诸子百家,各种某乱的方法让人眼花缭乱,有时候就会分不清什么是自带的什么是曾今写的api了
数组的增删
1 . push() , pop() 和 shift() unshift() ;
效果:
push是最常用的了,屁股上追加 , pop()相反在屁股上扣掉一个
shift和unshift就相反是在头部开刀了 , 他们除了push()都用的不多,主要因为只能一个一个操作,而且只能在头尾
返回值
push和unshift是头尾增加后返回长度,
pop和shift返回他们删除的值
2 . splice() slice() concat()
这个方法是删除用的,但是不是删除头尾固定的一个,而是想删除哪一个就哪一个。
效果:
var arr = [ 29 , 100 , 104 , 55] ;
console.log(arr.splice(1,2))
console.log(arr)
删除俩个参数,从arr[1]开始,就是100,104被删掉了
splice接受第更多参数,就变成是插入的数组元素,就像下边的concat一样插入多个
slice接受两个参数,表示从哪到哪的被截取下来
concat() 里边可以继续写数组 如concat(6,1,2,4);
就会把数组拼起来,但依然只是放在屁股上的,只不过放连续好几个而已
返回值
splice()为删掉的值
concat()为拼合后的新数组
注意:数组有的方法不会改变原来数组,如slice concat会返回新数组,但是不会改变原来的数组
数组的变形
join() split()
join可以把数组变成字符串,接受参数返回字符串,数组本身不变
split接受参数,返回字符串以参数分割的数组
数组的排序
sort() reverse()
sort()接受参数为排序方法,例如sort(function(){
return a-b
}) 返回新数组
reverse()不接受参数,数组被反转。返回新数组
注意:他们都会改变数组原来的形式
ES5新方法
es5新加了一些厉害了的东西,例如find,findIndex,reduce,forEach,every,map, filter,说起来比较多,但是都不复杂,官方文档讲的十分清楚啦。
forEach(callback[,thisArg]),
map(callback[,thisArg])
forEach接收一个回调来操作每一个元素callback又接收三个参数,元素value,index,调用forEach的array [,thisArg]意思是选填的参数,代表callback中的this
没错,他就是和jquery的each一样,注意:参数顺序不同
map和forEach一样,只不过每次操作一个元素可以有个返回值,然后构成新数组
var arr = [ , , , ] ;
console.log(arr.map(function(){
return
}))
find(callback[,thisArg]),
findIndex(callback[,thisArg])
方法返回数组中满足提供的测试函数的第一个元素的值。它和forEach接收的参数一样一样的。
例如:
function isBigEnough(element) {
return element >= ;
} [, , , , ].find(isBigEnough); //
function isBigEnough(element) {
return element >= ;
} [, , , , ].findIndex(isBigEnough); //
两个区别就是一个返回第一个满足要求的元素索引,一个返回元素值
every(callback[,thisArg]),
filter(callback[,thisArg]),
some(callback[,thisArg])
这三个玩意是用来过滤的,every()some()返回true,false,前者返回是否全部通过,后者返回是否有人通过
var arr = [ , , , ] ;
console.log(arr.some(function(element){
return element >
}))
//true,表示有东西通过
var arr = [ , , , ] ;
console.log(arr.every(function(element){
return element >
}))
//false,并非全部通过
var arr = [ , , , ] ;
console.log(arr.filter(function(element){
return element >
}))
//[100, 104, 55] //通过元素构成的新数组
reduce(callback,init)和reduceRight(callback,init)
var arr = [ , , , ] ;
console.log(arr.reduce(function(a,b){
console.log(a,b)
return a-b
},))
以init为初始值,进行init , 元素1 ,然后 元素1 ,元素2这样的方法进行遍历迭代回掉运算,
init也可没有,就直接元素1,元素2然后元素2,元素3这样遍历
reduceRight就不解释了
include(value[,fromIndex])
数组是否包含value,是返回0,不是返回-1
这些的兼容还不错,include不兼容ie,find不兼容opera其他的都差不多
js数组操作方法的更多相关文章
- js数组学习整理
原文地址:js数组学习整理 常用的js数组操作方法及原理 1.声明数组的方式 var colors = new Array();//空的数组 var colors = new Array(3); // ...
- JavaScript常用数组操作方法,包含ES6方法
一.concat() concat() 方法用于连接两个或多个数组.该方法不会改变现有的数组,仅会返回被连接数组的一个副本. var arr1 = [1,2,3]; var arr2 = [4,5]; ...
- js数组常用操作方法小结(增加,删除,合并,分割等)
本文实例总结了js数组常用操作方法.分享给大家供大家参考,具体如下: var arr = [1, 2, 3, 4, 5]; //删除并返回数组中第一个元素 var theFirst = arr.shi ...
- 11、js 数组详细操作方法及解析合集
js 数组详细操作方法及解析合集 前言 在开发中,数组的使用场景非常多,平日中也涉及到很多数组的api/相关操作,一直也没有对这块内容进行一块整理总结,很多时候就算用过几次这个api,在开发中也很容易 ...
- post/get in console of JSarray/js 数组详细操作方法及解析合集
https://juejin.im/post/5b0903b26fb9a07a9d70c7e0[ js 数组详细操作方法及解析合集 js array and for each https://blog ...
- 再探JS数组原生方法—没想到你是这样的数组
最近作死又去做了一遍javascript-puzzlers上的44道变态题,这些题号称"JS语言专业八级"的水准,建议可以去试试,这里我不去解析这44道题了, ...
- JS数组学习笔记
原文:JS数组学习笔记 最近在备课数组,发现很多ES5的方法平时很少用到.细节比较多,自己做了大量例子和整理,希望对大家了解JavaScript中的Array有所帮助. 概念 数组是值的有序集合.每个 ...
- Js 数组(一):基础应用
(一) Js 数据类型 分为基本数据类型以及引用类型 基本数据类型有 null,undefined,Boolen,Number,String,还有一种复杂数据类型 Object. var var1 = ...
- js数组方法解析
js 数组有很多方法,其中有的常用,有的不常用,归纳几个常用的方法,做个总结: 1. 转换方法: 1.1 valueOf():调用这个方法会返回数组本身 <script> var arr ...
随机推荐
- jvisualvm图解【转】
jvisualvm图解[转] http://blog.csdn.net/a19881029/article/details/8432368 jvisualvm能干什么:监控内存泄露,跟踪垃圾回收, ...
- 简单搭建 @vue-cli3.0 及常用sass使用
1,在安装了Node.js后使用其中自带的包管理工具npm.或者使用淘宝镜像cnpm(这里不做说明) 1-1,下载vue3.0脚手架(如果之前装vue-cli3x之前的版本,先卸载 npm unins ...
- springBoot_JPA和lombok
一.JPA 特点:JPA可以根据方法名自动匹配sql语句. JPA是一个标准 Hibernate是JPA的一个实现,宗旨是尽量少写sql语句. 使用JPA 1.application.properti ...
- 新一代云WAF:防御能力智能化,用户享有规则“自主权”
近日,在国际权威分析机构Frost & Sullivan发布的<2017年亚太区Web应用防火墙市场报告>中,阿里云以市场占有率45.8%的绝对优势连续两年领跑大中华区云WAF市场 ...
- 2-sat——暴力染色输出方案hdu1814
因为要求输出字典序最小的解,所以用暴力染色 具体有点像二分图染色 遍历0-2*n-1个点,尝试将每个点染成1,该点所能到达的所有点都要染成1 如果不行,则把上该点的影响消除,再把对立点染成1,如果还不 ...
- 安装 adb centos 7
打开 https://centos.pkgs.org/7/epel-x86_64/android-tools-20130123git98d0789-5.el7.x86_64.rpm.html 下载 r ...
- 接口Interface解耦的理解
定义一个接口 磁盘 interface Disk(){ void save(File file); } U盘和硬盘都是磁盘,都实现这个接口 class UDisk implement Disk ...
- 转:linux中select()函数分析
源地址:http://blog.csdn.net/zi_jin/article/details/4214359 Select在Socket编程中还是比较重要的,可是对于初学Socket的人来说都不太爱 ...
- <每日一题>题目6:二分查找
#二分查找 ''' 1.end问题 2.44对应的end<start 找不到情况 3.返回值递归的情况 4,611,aim太大的情况 ''' l = [2,3,5,10,15,16,18,22, ...
- Markdown 格式标记符号说明
Markdown 格式标记符号说明 1. 标题 在行首插入 1 到 6个#,分别表示标题 1 到标题 6 # 这是标题1 ## 这是标题1 ###### 这是标题6 点击保存后的效果: 标题1 标题2 ...