搜索
首页web前端js教程javascript数组中常用的API总结
javascript数组中常用的API总结Jul 20, 2018 am 11:46 AM
javascript

这篇文章给大家介绍的内容是关于javascript数组中常用的API总结,有着一定的参考价值,有需要的朋友可以参考一下。

数组常用 api 介绍

split():拆分字符串变成数组(对字符串操作)
join() :合并数组变成字符串(对数组操作)
concat():连接两数组
splice(begin,deleteCount,insert):拼接
splic(begin,end):截取[begin,end)
sort(callball(value1,value2)):排序
resever():反序
filter(callback(currentValue,index)):筛选
map(callback(currentValue,index)):遍历,有返回值,和forEach类似
forEach(callback(currentValue,index)):遍历,没有返回值
reduce(callback(array,currentValue,index)[,array]):累计处理
arguments:在函数内部使用,将函数的参数变成伪数组(不能用数组的 api)

例子

sort排序:如果value1 < value2返回-1,升序排列;返回1,降序排列

var arr = [1,5,4,3,2,6,7]
arr.sort((value1,value2) => {
    if(value1 < value2){
        return -1    //升序
    }else if(value1 > value2){
        return 1    //降序
    }else{
        return 0
    }
})<h3>
<code>filter</code>筛选数组,接受一个回调函数,回调函数的参数<code>value</code>、<code>index</code>(可选)、<code>array</code>(可选)</h3>
<pre class="brush:php;toolbar:false">let arr = [1,2,3,4,5,6,7,8,9]
arr.filter((value,index) =>{
  console.log(index)
  return value > 5    //筛选条件
})
let fruits = ['apple', 'banana', 'grapes', 'mango', 'orange'];
function find(element){
    return fruits.filter((e)=>{
        return e.indexOf(element) >= -1    //indexOf查到元素,找到返回元素的索引
    })
}
find('ap') //['apple','grapes']

mapforEach之间的区别是:map有返回值,forEach没有返回值;要forEach能返回值出来,在它内部定义一个变量存储遍历的值就可以了。

var a = [1,2,3,4]
a.map(e => e*2)    //[1,4,6,8]
a.forEach(e => e*2)    //undefined, return 也不会出来

reduce接受两个参数,回调函数和回调函数的第一个参数(可选);回调函数接受四个参数:1、回调函数的返回值(处理结果)或者reduce的第二个参数;2、正在处理的元素;3、正在处理元素的索引;4、调用reduce的数组。

如果reduce接收第二个参数,那么回调函数的第一个参数就是它(如去重,运行逻辑是把待处理数组的每一项处理后在一个个push进去,是加的过程);如果没有第二个参数,那么回调函数的第一个参数就是待处理数组的第一项(如摧毁数组,运行逻辑是把待处理数组直接拿过来集中处理,是减的过程)。

//去重:把待处理数组的每一项处理后在一个个`push`进去,是加的过程
var a = [1,2,3,2,4,5,3,1]
a.sort().reduce((arr,currentValue) => {
  if(arr.length === 0 || arr[arr.length-1] !== currentValue){
    arr.push(currentValue)
  }
  return arr
},[])    //[1,2,3,4,5]

//摧毁数组:把待处理数组直接拿过来集中处理,是减的过程
function destroyer(arr) {
    return [].slice.call(arguments).reduce((current,next) =>{
        return current.filter((e) => {
            return e !== next
        })
    })
}
destroyer([1, 2, 3, 1, 2, 3], 2, 3);    //[1,1]

arguments虽然不是数组,但可以将它转变成真正的数组,下面是两种方法

function array(arr){
    console.log(arr)    //[1,2,3,4,5],注意是一个伪数组,不能用数组的方法
}
array(1,2,3,4,5)

var args = Array.prototype.slice.call(arguments);
var args = [].slice.call(arguments);

相关推荐:

js中字符串的全排列的算法解析

以上是javascript数组中常用的API总结的详细内容。更多信息请关注PHP中文网其他相关文章!

声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
es6数组怎么去掉重复并且重新排序es6数组怎么去掉重复并且重新排序May 05, 2022 pm 07:08 PM

去掉重复并排序的方法:1、使用“Array.from(new Set(arr))”或者“[…new Set(arr)]”语句,去掉数组中的重复元素,返回去重后的新数组;2、利用sort()对去重数组进行排序,语法“去重数组.sort()”。

JavaScript的Symbol类型、隐藏属性及全局注册表详解JavaScript的Symbol类型、隐藏属性及全局注册表详解Jun 02, 2022 am 11:50 AM

本篇文章给大家带来了关于JavaScript的相关知识,其中主要介绍了关于Symbol类型、隐藏属性及全局注册表的相关问题,包括了Symbol类型的描述、Symbol不会隐式转字符串等问题,下面一起来看一下,希望对大家有帮助。

原来利用纯CSS也能实现文字轮播与图片轮播!原来利用纯CSS也能实现文字轮播与图片轮播!Jun 10, 2022 pm 01:00 PM

怎么制作文字轮播与图片轮播?大家第一想到的是不是利用js,其实利用纯CSS也能实现文字轮播与图片轮播,下面来看看实现方法,希望对大家有所帮助!

JavaScript对象的构造函数和new操作符(实例详解)JavaScript对象的构造函数和new操作符(实例详解)May 10, 2022 pm 06:16 PM

本篇文章给大家带来了关于JavaScript的相关知识,其中主要介绍了关于对象的构造函数和new操作符,构造函数是所有对象的成员方法中,最早被调用的那个,下面一起来看一下吧,希望对大家有帮助。

JavaScript面向对象详细解析之属性描述符JavaScript面向对象详细解析之属性描述符May 27, 2022 pm 05:29 PM

本篇文章给大家带来了关于JavaScript的相关知识,其中主要介绍了关于面向对象的相关问题,包括了属性描述符、数据描述符、存取描述符等等内容,下面一起来看一下,希望对大家有帮助。

javascript怎么移除元素点击事件javascript怎么移除元素点击事件Apr 11, 2022 pm 04:51 PM

方法:1、利用“点击元素对象.unbind("click");”方法,该方法可以移除被选元素的事件处理程序;2、利用“点击元素对象.off("click");”方法,该方法可以移除通过on()方法添加的事件处理程序。

整理总结JavaScript常见的BOM操作整理总结JavaScript常见的BOM操作Jun 01, 2022 am 11:43 AM

本篇文章给大家带来了关于JavaScript的相关知识,其中主要介绍了关于BOM操作的相关问题,包括了window对象的常见事件、JavaScript执行机制等等相关内容,下面一起来看一下,希望对大家有帮助。

foreach是es6里的吗foreach是es6里的吗May 05, 2022 pm 05:59 PM

foreach不是es6的方法。foreach是es3中一个遍历数组的方法,可以调用数组的每个元素,并将元素传给回调函数进行处理,语法“array.forEach(function(当前元素,索引,数组){...})”;该方法不处理空数组。

See all articles

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

AI Hentai Generator

AI Hentai Generator

免费生成ai无尽的。

热门文章

R.E.P.O.能量晶体解释及其做什么(黄色晶体)
2 周前By尊渡假赌尊渡假赌尊渡假赌
仓库:如何复兴队友
1 个月前By尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒险:如何获得巨型种子
4 周前By尊渡假赌尊渡假赌尊渡假赌

热工具

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

EditPlus 中文破解版

EditPlus 中文破解版

体积小,语法高亮,不支持代码提示功能

SublimeText3 英文版

SublimeText3 英文版

推荐:为Win版本,支持代码提示!

ZendStudio 13.5.1 Mac

ZendStudio 13.5.1 Mac

功能强大的PHP集成开发环境