Array(数组)是JavaScript中最为常用的类型了。ECMAScript中的数组都是数据的有序列表。数组中可以保存任何类型的数据。数组的大小是可以动态调整的,既可以随着数据的添加自动增长以容纳新增数据。

ECMAScript为数组提供了几种操作和处理数组的方法,以下为自己整理的数组的操作方法。

1.push():往数组的末尾添加元素,并返回修改后的数组长度。(可以接受任何的参数)

var arr = [1,2,3]
var arrpush = arr.push(4,5)
console.log(arrpush) //
console.log(arr) //[1,2,3,4,5]

push()方法所接受的参数可以是任意类型,可以是数组也可以对象等。

var arr = [1,2,3,4,5]
var arr1 = [4,5]
console.log(arr.push(arr1)) //
console.log(arr) //[1, 2, 3, 4, 5, Array(2)]
// push的参数为数组时需要展开作为参数的数组
console.log(arr.push(...arr1)) //
console.log(arr) //[1, 2, 3, 4, 5, Array(2), 4, 5]

以上有两次使用了push()方法,如果push()方法接受的参数是个Array类型,那么原来操作的最后一项就是一个数组,如上图所示,如果想将一个数组的每个元素添加到所操作的数组当中,那么需要展开要被添加的数组,

2.pop:移除数组末尾的项,并返回所移除的项。

var arr = [1,2,3,4,5]
console.log(arr.pop()) //
console.log(arr) //[1,2,3,4]

图中可以看出,pop()方法会返回操作原来的数组后返回所移除的内容,pop()方法不接受任何的参数。

3.shift():移除数组前端的第一项并返回该项,同时数组的长度-1,并且不会接受任何参数。

var arr = [1,2,3,4]
console.log(arr.shift()) //
console.log(arr) //[2,3,4]

4.unshift():在数组的前端添加任何的项并返回数组的长度。接受的参数是给所操作的数组需要添加的内容,可接受任何类型的参数。

var arr = [1,2,3,4]
console.log(arr.unshift(0,1)) //
console.log(arr) //[0,1,1,2,3,4]

5.Reverse():会反转数组原来的顺序。

var arr =[1,2,3,4,5]
console.log(arr.reverse()) //[5,4,3,2,1]

6.sort():在默认情况下sort方法按升序排列数组,即最小一项在最前面,最大的排在最后面。

var arr =[5,4,3,2,1]
console.log(arr.sort()) //[1,2,3,4,5] //sort方法是在进行字符串的比较
var arr =[1,2,11,33,55,66,8,9]
console.log(arr.sort()) //[1,11,2,33,55,66,8,9]

因为sort方法是比较字符串,所以它可以接受一个比较函数作为参数,以便指定哪个位置位于哪个位置前面。
比较函数接受两个参数,如果第一个参数应该位于第二个之前则返回一个负数,如果两个参数相等则返回0,如果第一个参数应该位于第二个之后则返回一个整数。

按照规则可以写出以下的比较函数:

function compare (value1,value2){
if((value1<value2){
return -1
}else if((value1>value2){
return 1
}else {
return 0
}
}
// sort()方法可以接受以上的比较函数为参数
var arr = [1,55,15,16,44,9,66,8]
console.log(arr.sort()) //[1,15,16,44,55,66,8,9]
console.log(arr.sort(compare)) //[1,8,9,15,16,44,55,66]

从大的值排序到小的值可以写为:

function compare (value1,value2){
if((value1<value2){
return 1
}else if((value1>value2){
return -1
}else {
return 0
}
}
 var arr = [1,55,15,16,44,9,66,8]
console.log(arr.sort(compare)) //[66,55,44,16,15,9,8,1]

或者可以利用简单的方法写出:

//升序排序
function compare (value1,value2) {
value1- value2
}
//降序排序
function compare (value1,value2) {
value2- value1
}

7.contact():该方法可以基于当前数组中的所有选项创建一个新数组。(可以说是连接两个数组)。

var arr = [1,2,3]
var arr1 = [4,5,6]
console.log(arr.contact(arr1)) //[1,2,3,4,5,6]
console.log(arr1.contact(arr)) //[4,5,6,1,2,3]

8.slice():它能够基于当前数组中的一个或者多个项创建一个新的数组。

Slice()方法可以接受一个或者两个个参数,即返回项的起始位置和结束位置,在只有一个参数的情况下,slice方法返回从该参数指定的位置到当前数组末尾的所有项。如果有两个参数,该方法返回起始和结束位置之间的项—但不包括结束位置的项。Slice方法不会影响原始数组。

var arr = [1,8,9,15,16,44,55,66]
console.log(arr.slice(5)) //[44,55,66]
console.log(arr.slice(5,7)) //[44,55]

9.splice:该方法算是最强大的数组方法了。它有很多种用法,主要用法是向数组中部插入项,但是使用这种方法的方式则有一下3种。

(1)删除: 可以删除任意数量的项,只需要指定两个参数:要删除的第一项的位置和要删除的项数。如splice(0,2)会删除所操作的数组的前两项。并返回所删除的内容。

var arr = [1,2,3,4,5,6]
console.log(arr.splice(0,2)) //[1,2]
console.log(arr) //[3,4,5,6]

(2) 插入:可以向指定位置插入任意数量的项,只需要提供3个参数:起始位置,0(要删除的项数)和要插入的项。

例如:splice(2,0,“nihao”“hello”)会从数组位置2开始插入后面的两个参数。

var arr = [1,2,3,4,5,6]
console.log(arr.splice(0,0,"hello","array") //[]
console.log(arr) // ["hello", 1, 2, 3, 4, 5]

(3)替换:可以向指定位置插入任意数量的项,且同时删除任意数量的项。

只需指定三个参数:起始位置,要删除的项数和要插入任意数量的项例如splice(2,1,“green”“red”)会删除当前数组位置2的项,然后再从位置2开始插入字符串“red”“green”。即先删除后插入。

var arr = [1,2,3,4,5]
console.log(arr.splice(2,1,"hello","arr")) //
console.log(arr) //[1, 2, "hello", "arr", 4, 5]

10. indexOf():该方法从数组的开头开始向后找,lastIndexOf()该方法则从数组的末尾开始向前找。

这两个方法都要返回要查找的项在数组中的位置,或者在没找到的情况下返回-1,该方法在操作时,会使用全等操作符;也就是说,要求查找的项必须严格相等。

var arr = [1,2,3,4,5,6,7,8]
console.log(arr.indexOf(5)) //
console.log(arr.lastIndexOf(5)) //
console.log(arr.indexOf(11)) //-1

11. every() :对数组中的每一项运行给定函数,如果该函数对每一项都返回 true ,则返回 true。

var arr =[1,2,3,9,15,16,44,55,66]
var numbers = arr.every(function(item,index,array){return item>2})
console.log(numbers ) //false var nums = arr.every(function(item,index,array){return item>0})
console.log(num) //true

12.filter() :对数组中的每一项运行给定函数,返回该函数会返回 true 的项组成的数组。

var arr = [1,2,3,9,15,16,44,55,66]

function filterfunction(item,index,array){
return
item>2
} var number = arr.filter(filterfunction) console.log(number) //[3, 9, 15, 16, 44, 55, 66]

13.forEach() :对数组中的每一项运行给定函数。这个方法没有返回值。本质是于for循环一样的

14.map() :对数组中的每一项运行给定函数,返回每次函数调用的结果组成的数组。

var arr = [1,2,3,4,5,6]

function multiplication (item,index,array) {
return item*2
} var numbers =arr.map(multiplication ) console.log(numbers ) //[2,4,6,8,10,12]

JavaScript中数组的操作方法总汇的更多相关文章

  1. JavaScript中数组操作常用方法

    JavaScript中数组操作常用方法 1.检测数组 1)检测对象是否为数组,使用instanceof 操作符 if(value instanceof Array) { //对数组执行某些操作 } 2 ...

  2. javascript中数组Array的方法

    一.常用方法(push,pop,unshift,shift,join)push pop栈方法,后进先出var a =[1,2,3];console.log(a.push(40)); //4 返回数组的 ...

  3. Javascript中数组

    Javascript中数组 1.什么是数组 所谓的数组就是一组数据的集合,在内存中表现为一段连续的内存地址(保存在堆内存) 2.创建数组的含义 创建数组的目的:就是为了保存更多的数据 3.数组的定义 ...

  4. javascript中数组常用方法总结

    原文:javascript中数组常用方法总结 在javascript的基础编程中,数组是我们最常遇到的,那么数组的一些常用方法也是我们必须要掌握的,下面我们总结一下数组中常用的方法. toString ...

  5. JavaScript中数组Array方法详解

    ECMAScript 3在Array.prototype中定义了一些很有用的操作数组的函数,这意味着这些函数作为任何数组的方法都是可用的. 1.Array.join()方法 Array.join()方 ...

  6. javascript中数组的常用算法深入分析

    Array数组是Javascript构成的一个重要的部分,它可以用来存储字符串.对象.函数.Number,它是非常强大的.因此深入了解Array是前端必修的功课.本文将给大家详细介绍了javascri ...

  7. javascript中数组化的一般见解

    javascript中数组化的一般见解,数组化浏览器中存在许多类数组对象,往往对类数组操作比较麻烦,没有数组那些非常方便的方法,在这种情况下,就有了数组化方法. 数组化的一般方法 1.第一种也是我们最 ...

  8. 总结Javascript中数组各种去重的方法

    相信大家都知道网上关于Javascript中数组去重的方法很多,这篇文章给大家总结Javascript中数组各种去重的方法,相信本文对大家学习和使用Javascript具有一定的参考借鉴价值,有需要的 ...

  9. JavaScript中数组常用方法的总结

    JavaScript中数组Array常用的方法总结 标签(空格分隔): JavaScript ECMAScript数组给我们提供了许多常用的方法,便于我们对数组进行操作,下面,就来总结一下这些方法. ...

随机推荐

  1. 阶段1 语言基础+高级_1-3-Java语言高级_04-集合_02 泛型_5_定义和使用含有泛型的接口

    定义泛型接口 Scanner的接口 接口的实现类.实现这个接口,规定数据类型为String类型 ArrayList是List接口的实现类 再看下List接口的源码 泛型实现类也定义为泛型 重写泛型的方 ...

  2. js中parseInt()与parseFloat(),Number(),Boolean(),String()转换

    js将字符串转数值的方法主要有三种 转换函数.强制类型转换.利用js变量弱类型转换. 1. 转换函数: js提供了parseInt()和parseFloat()两个转换函数.前者把值转换成整数,后者把 ...

  3. iBatis框架之配置文件之注意点之总结

    1.配置文件sqlMap.xml中需要注意的点 比如: <?xml version="1.0" encoding="UTF-8" ?> <!D ...

  4. css的继承之width属性(容易忽略)

    众所周知,css的三大特性分别是 继承性,层叠性,和优先级. 那么这里就详细说一下css中width的继承性及其特殊情况. 继承性概念详解:css的继承性指的被包在内部的标签拥有外部标签的样式性,子元 ...

  5. PL/SQL Developer工具

    安装好Oracle以后我们发现在控制台来操作数据库很繁琐,而且也不方便阅读.所以,我们就要用到PL/SQL Developer工具,以达到能更好的操作数据库的目的. PL/SQL Developer简 ...

  6. [BZOJ 2301] [HAOI 2011] Problem b (莫比乌斯反演)(有证明)

    [BZOJ 2301] [HAOI 2011] Problem b (莫比乌斯反演)(有证明) 题面 T组询问,每次给出a,b,c,d,k,求\(\sum _{i=a}^b\sum _{j=c}^d[ ...

  7. 该项目不知道如何运行配置文件 IIS Express。

    项目右键属性-->调试 -->启动改为项目即可

  8. sql基本语法大全

    一.定义变量--简单赋值 declare @a intset @a=5 print @a --使用select语句赋值 declare @user1 nvarchar(50) select @user ...

  9. HTML使用框架跳转到指定的节

    内容区(links.html) <html> <body> <h2>Chapter 1</h2> <p>This chapter expla ...

  10. SwiftUI 实战:从 0 到 1 研发一个 App

    心得感悟 起初看到 WWDC 上的演示 SwiftUI 时,我就觉得 SwiftUI 有种陌生的熟悉感(声明式语法),所以体验下,看看有没有什么启发. 先说下整体项目完成下来的感受: 用 Swift ...