javascript数组方法学习汇总

zebrayoung 发布于2019-08-22 17:05 / 1244人阅读

摘要：将输出新数组判断数组中的每一项是否都满足条件，都满足返回，此方法相较于之前的几个方法，返回值有差异，是一个布尔值。输出数组用于将一组值转化为数组输出数组返回一个布尔值，表示某个数组中是否包含给定的值。

1、join("sep")：将数组元素组合成字符串。以sep为分隔符，省略的话则默认使用逗号为分隔符。

var arr = ["a","b","c"];
console.log(arr.join("-"))// 将输出字符串"a-b-c"。

2、reverse(): 反转数组元素。

var arr = ["a","b","c"]
console.log(arr.reverse())// 将输出数组["c","b","a"], 原数组也将被改变，与输出的值相同。

3、concat(): 数组的合并，将参数添加到原数组的末尾，返回添加过后的新数组，不改变原数组。

var arr = ["a","b"]
console.log(arr.concat(["c"]))// 输出新数组["a","b","c"]。

4、push(): 向数组末尾添加元素,返回添加元素以后的数组的长度,原数组被改变。

5、pop()：移除数组最后一项，返回移除的值，原数组被改变。该方法的返回值与push方法的有差异。

6、shift()：移除数组第一项，返回移除的元素，原数组被改变。

7、unshift()：在数组的开头添加元素，返回数组的长度，原数组被改变。

8、slice(n, m): 该方法可从已有的数组或字符串中返回选定的元素。返回从原数组中指定开始下标n到结束下标m(不包括m)之间的项组成的新数组,如果只传入一个参数，则截取该下标到数组结尾，不改变原数组。

var arr = [1,2,3,4,5]
console.log(arr.slice(1,3)) // 输出新数组[2,3]。

9、splice(n,length) 删除：两个参数，要删除的第一项的位置和要删除的个数，返回被删除的元素组成的新数组,原数组被改变。

var arr = ["a", "b", "c"]
console.log(arr.splice(1, 2)) // 输出新数组["b","c"]。

splice(n,length,x) 删除后添加，从下表为n的位置删除length个元素，然后在删除的位置添加元素x,length可以为0，则只添加不删除

arr.splice(1,2,"d")  // 原数组变为["a","d"]。

10、indexOf(item, [m]): 查找目标元素item在数组当中的下标,m代表从什么位置开始查找，可省略。返回被查找元素的下标,如不存在，则返回-1。lastIndexOf(n,[m]) 从数组的末尾开始向前查找

var arr = ["a","b","c"]
console.log(arr.indexOf("b")) // 输出1
console.log(arr.indexOf("f")) // 输出-1

11、forEach(function(value,index,arr){}): 对数组进行遍历循环，对数组中的每一项运行给定的函数。这个方法没有返回值。参数分别为遍历的数组内容(value)，对应内容的下标(index)，原数组(arr)。

var arr = ["a","b","c"]
arr.forEach(function(value, index){
   console.log(value +"===>"+ index)
})
// 输出 a===>0, b===>1, c===>2

12、map(function(value,index,arr){}): 对数组中的每一项运行给定的函数，返回每次函数调用的结果组成的新数组。

var arr = [1, 2, 3];
var resultArr = arr.map(function (value, index, arr) {
   return value * value;
})
console.log(resultArr) // 输出新数组[1,4,9]

13、filter(function(value,index,arr){}): 过滤功能,数组中的每一项运行给定的函数，返回满足过滤条件的元素组成的新数组。

var arr = [1,2,3,4,5,6]
var resultArr = arr.filter(function(value,index,arr){
   return value % 2 === 0            
})
console.log(resultArr) // 将输出新数组[2,4,6]

14、every(function(value,index,arr){})：判断数组中的每一项是否都满足条件，都满足返回true，此方法相较于之前的几个方法，返回值有差异，是一个布尔值。

var arr = [1, 2, 3, 4, 5, 6];
var flag = arr.every(function (value, index, arr) {
   return value < 10;
})
console.log(flag) // 输出 true。数组中的所有元素都小于10

15、some(function(value,index,arr){})：判断数组中是否存在满足条件的项，只要有一项满足条件，就会返回true。

16、find(function(value,index,arr){})：用于找出第一个符合条件的数组成员，并返回该元素。

var arr = [1,2,4,5,3,6,7]
var num = arr.find(function(value,index.arr){
  return value > 2           
})
console.log(num) // 将输出4。4 为数组中满足条件的第一个元素，后面的元素将不会在进行遍历筛选。

17、findIndex(function(value,index,arr){})：返回第一个符合条件的数组成员的位置。也就是满足条件的那个成员的index值

18、Array.from()：该方法用于将类似数组的对象和可遍历的对象转化为真正的数组。

var obj = {
   "0": "a",
   "1": "b",
   "2": "c",
   length: 3             
}
console.log(Array.from(obj)) // 输出数组 ["a","b","c"]

19、Array.of()：用于将一组值转化为数组

console.log(Array.of(1,2,3,4,5)) //输出数组[1,2,3,4,5]

20、includes()：返回一个布尔值，表示某个数组中是否包含给定的值。

var arr = ["a","b","c"]
console.log(arr.includes("a")) //输出 true
console.log(arr.includes("d")) //输出 false

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/94837.html

JS 数组方法学习汇总

摘要：整个数组的大操作转换拼接排序倒置这个方法是将数组转换为字符串，数组元素间用传进去的参数没有参数就用分隔这个方法用于拼接两个数组并返回一个新的数组。看代码吧打印整个数组这个方法是对数组的每一项运行给定函数，返回每一项返回结果组成的数组。前言在 JS 中我们数组用的是比较多的了，它自带了很多方法可以用，省去了我们时间，特别是 ES6 当中对数组的扩展让数组具有了更强大的功能，为了以后使...

PAMPANG 2019-08-23 14:10 评论0 收藏0
2017-07-17 前端日报

摘要：前端日报精选听说你没来总结个人使用过的移动端布局方法新特性简介用写组件坦然面对应对前端疲劳中文深入理解笔记函数前端架构经验分享系列教程之创建页面元素龙云全栈系列教程之定位页面元素龙云全栈第期与表单验证技术周刊期知乎 2017-07-17 前端日报精选听说你没来 JSConf 2017?总结个人使用过的移动端布局方法 - Rni-L - SegmentFaultNode.js v8....

caiyongji 2019-08-20 18:04 评论0 收藏0
从Timer中学习优先队列的实现

摘要：从中学习优先队列的实现是定时器的实现，用来调度定时执行的任务和执行一次的任务，就像的和的意思，它也可以作为后台程序运行。通过和的方法可以保证整个优先队列的关系，保证的是最小的。作用是构建堆，可以从的数组构建堆，来表示优先队列。从Timer中学习优先队列的实现 Timer是Java定时器的实现，用来调度定时执行的任务和执行一次的任务，就像JavaScript的setInterval和s...

anquan 2019-08-16 10:32 评论0 收藏0
Vue + ArcGIS API for JavaScript 构建前端GIS应用（一）

摘要：技术路线的选择技术学习内容汇总技术路线的选择项目的技术路线是使用构建一套前端应用，更加具体的技术路线实际上是，应用到了技术栈加上了最新版的。不管怎么说，以这次项目对的使用体验挺好。本次项目没有使用开源的要求，自然是最好的选择。写这篇总结的意义：总结，回顾，反思项目进行过程和这套Vue + ArcGIS API for JavaScriptGIS前端应用技术路线，从项目与技术两个方面积...

lufficc 2019-08-23 18:30 评论0 收藏0
【underscore 源码解读】JavaScript 中如何判断两个元素是否 "相同&q

摘要：最近开始看源码，并将源码解读放在了我的计划中。后文中均假设比较的两个参数为和。，如果和均是类型或者类型，我们可以用来判断是否。 Why underscore 最近开始看 underscore.js 源码，并将 underscore.js 源码解读放在了我的 2016 计划中。阅读一些著名框架类库的源码，就好像和一个个大师对话，你会学到很多。为什么是 underscore？最主要的原...

yhaolpz 2019-08-19 18:24 评论0 收藏0