Array类型应该是 ECMAScript 中最常用的类型之一了,并且它定义的数组与其他语言有着相当大的区别。数组是数据的有序集合,我们可以通过下标对指定位置的数据进行读写;特别的是,在 ECMAScript 中,数组的每一项可以保存任何类型的数据,数组的大小可以动态调整,它可以随着数据的添加自动增长来容纳新增的数据,从而变得更加灵活。下面总结了Array类型常见的一些方法。

一、栈方法

  push() , pop() 这两个方法可以使数组的行为类似于“栈”这种数据结构,“栈”是一种 LIFO (Last-In-First-Out)后进先出的数据结构。

1.1 push()

  • 参数:任意数量的元素;
  • 作用:逐个添加到数组末尾;
  • 返回值:修改后的数组的长度;

1.2 pop()

  • 参数:无;
  • 作用:移除数组的最后一项,减少数组的length值;
  • 返回值:被移除的项;
 let arr = ["hello", "world", "Jingan"];

 let length = arr.push("!", 1, "China");
console.log(length); //
console.log(length === arr.length); // true let deleteItem = arr.pop();
console.log(length === arr.length); //false
console.log(deleteItem); // "China"
console.log(arr.length); //

push(),pop()

二、队列方法

  队列”这种数据结构的访问规则是 FIFO (First-In-First-Out先进先出),队列列表的末端添加元素,从列表的从头部开始删除。

  我们已经知道 push() 可以向数组的末端添加元素,结合方法 shift() 便可以将一个数组的操作模拟成队列。

2.1 shift()

  • 参数:无;
  • 作用:移除数组的第一项并返回该值;
  • 返回值:被移除的项;

  除此之外,还有一个 unshift() 方法,使用该方法和 pop() 方法组合可以将数组从相反的方向来模拟队列,即在数组顶端(index=0)添加元素,从数组末端移除元素。

2.2 unshift()

  • 参数:任意数量的元素;
  • 作用:逐个添加到数组头部;
  • 返回值:修改后的数组的长度;
 let fruits = ["apple", "orange", "banana"];
console.log(fruits.length); // // 正向队列
let count = fruits.push("grape", "watermelon"); // 推入两项
console.log(count); // let item = fruits.shift(); // 移除第一项
console.log(item); // "apple"
console.log(fruits.length); // // 反向队列
let colors = new Array();
let count_2 = colors.unshift("blue", "red", "black"); // 推入三项
console.log(count_2); // count_2 = colors.unshift("white");
console.log(count_2); // let item_2 = colors.pop();
console.log(item_2); // "balck"
console.log(colors.lenght);

shift(), unshift()

三、重排序方法

3.1 reverse()

  • 参数:无;
  • 作用:将数组反转,原数组发生改变;
  • 返回值:返回反转后的数组;
 var arr = [1, 3, 5, "apple", 34];
arr.reverse();
console.log(arr); // [34, "apple", 5, 3, 1]

reverse()

3.2 sort()

  默认情况:sort() 方法按升序排列数组项,sort() 方法会调用每个数组项的 toString() 方法,然后比较依次字符串的 unicode 编码值。

 var arr = [1, 3, 5, "apple", 34];
arr.sort();
console.log(arr); // [1, 3, 34, 5, "apple"]

sort()

  这样比较会产生问题,所以通常情况下,我们常常将一个比较函数传递给 sort() 方法,以便我们自定义比较的方式。

比较函数传递两个参数:first, second;

  1. 如果 first 应该在 second 之前则返回负数;
  2. first 与 second 相等返回 0;
  3. first 应该在 second 后面则返回正数;
 function compare(first, second) {
// return first - second; // 升序
return second- first; // 降序
} var arr = [11, 3, 53, 1, 34];
console.log(arr.sort(compare)); // [53, 34, 11, 3, 1]

sort()

四、操作方法

4.1 concat()

  该方法首先会创建一个当前数组的复本,然后将接受到的参数添加到这个复本的末尾。最后返回新构建的数组;注意原来那个数组是没有改变的,我们所做的改变都是在原数组的复本上进行操作的

 let arr =  [1, 2, 3];
let arr_2 = arr.concat(4, [2, 4, 5]);
console.log(arr); // [1, 2, 3]
console.log(arr_2); // [1, 2, 3, 4, 2, 4, 5]

concat()

4.2 slice()

  基于当前数组来创建指定的新数组。起始和结束位置作为参数,注意该方法也不会影响原数组。  

  • 一个参数: 返回参数指定的开始位置到数组末尾的所有项;
  • 两个参数: 返回起始位置到结束位置(不包括结束位置)范围内的所有项;
 let arr = ["apple", "orange", "banana", "srawberry", "watermelon"];
let arr_01 = arr.slice(2);
let arr_02 = arr.slice(1, 3);
console.log(arr_01); // ["banana", "srawberry", "watermelon"]
console.log(arr_02); // ["orange", "banana"]

slice()

4.3 splice()

  这个方法应该是最强大的数组方法了吧,并且还没有之一。主要有三种用途:

  • 删除:可以删除任意数量的项,两个参数:要删除的第一项的位置和要删除的个数。
  • 插入:可以向数组中插入任意数量的项,至少三个参数:起始位置、0(要删除的项数)、要插入的项。如果要插入多个项,可以在继续传入参数。
  • 替换:可以向指定位置删除任意数量的项,并且同时插入任意数量的项。

  注意splice()方法始终都会返回一个数组,该数组中包含从原数组中删除的项(若没有删除,则返回空数组)。

 let arr = ["apple", "orange", "banana", "srawberry", "watermelon"];

 let item = arr.splice(0, 1);
console.log(item); // ["apple"]
console.log(arr); // ["orange", "banana", "srawberry", "watermelon"] item = arr.splice(1, 0, "1", "2", "3");
console.log(item); // [];
console.log(arr); // ["orange", "1", "2", "3", "banana", "srawberry", "watermelon"] item = arr.splice(1, 3, "苹果", "香蕉");
console.log(item); // ["1", "2", "3"]
console.log(arr); // ["orange", "苹果", "香蕉", "banana", "srawberry", "watermelon"]

splice()

五、位置方法

  indexOf() 和 lastIndexOf(),这两个方法都接受两个参数:要查找的项和(可选的)查找其实位置的索引。

  这两个方法的返回值是查找的项在数组中的位置,若没有则返回-1。注意在第一个参数比较数组的每一项时,是采用的全等操作符。

 let arr = ["apple", "orange", "100", 2, 3];

 let index = arr.indexOf(100);
console.log(index); // -1
index = arr.indexOf("orange");
console.log(index); //

indexOf

六、迭代方法

  以下这5个迭代方法都可以传入两个参数:要在每一项上运行的函数和(可选的)运行该函数的作用域对象——影响this的值。在每一项上运行的函数中会接受三个参数:数组项的值、位置、数组对象本身。以下方法都不会改变原来的数组。

6.1 every()

  对数组中的每一项都运行指定的函数,如果该函数对每一项都返回 true,则返回 true。

6.2 some()

  如果该函数对任意一项返回 true,则返回 true。

6.3 filter()

   filter 译为“过滤”,也就是说该方法可以利用指定的函数来确定返回的数组中是否包含某一项,它返回一个数组。

6.4 map()

  该方法也是返回一个数组,而这个数组的每一项都是原始数组的每一项经过函数运行后的结果。

6.5 forEach()

  将数组的每一项传入函数中,没有返回值,类似于使用 for 循环遍历数组。

 let numbers = [1, 2, 3, 4, 15, 16];

 let everyResult = numbers.every(function (item, index, array) {
return (item > 3);
});
console.log(everyResult); // false let someResult = numbers.some(function (item, index, array) {
return (item > 3);
});
console.log(someResult); // true function biggerThan_10(item, index, array) {
if (item > 10) {
return item;
}
}
let filterResult = numbers.filter(biggerThan_10);
console.log(filterResult); // [15, 16] function doubleItems(item, index, array) {
return item * 2;
}
let mapResult = numbers.map(doubleItems);
console.log(mapResult); // [2, 4, 6, 8, 30, 32]

迭代方法

七、归并方法

  两个归并数组的方式:reduce()、reduceRight(),这两个方法都会迭代数组的所有项,然后返回一个最终值。reduce() 从数组的第一项开始,逐个遍历到最后。reduceRight()相反。

  两个方法的都接受两个参数:每一项上调用的函数和(可选的)作为归并的初始值。 每一项上调用的函数有四个参数:前一个值、当前值、索引、数组对象。

 let numbers = [1, 2, 3, 4];

 let result = numbers.reduce(function(pre, cur, index, array){
console.log("pre: " + pre + ", cur: " + cur + ", index: " + index);
return pre + cur;
})
console.log(result); // // 每次归并的输出:
// pre: 1, cur2, index:1
// pre: 3, cur3, index:2
// pre: 6, cur4, index:3 // 传入归并的初始值
let result_2 = numbers.reduce(function(pre, cur, index, array){
console.log("pre: " + pre + ", cur: " + cur + ", index: " + index);
return pre + cur;
}, 1000)
console.log(result_2); // // 每次归并的输出:
// pre: 1000, cur: 1, index: 0
// pre: 1001, cur: 2, index: 1
// pre: 1003, cur: 3, index: 2
// pre: 1006, cur: 4, index: 3

reduce()

  以上JavaScript中Array类型的常见方法,通过这些方法能够使我们在实际中更加方便的操作数组。

  最近在学习《JavaScript高级程序设计》这本书,以上内容整理自该书第五章,与Array的更多方法可以参考MDN

总结Array类型中常用的方法的更多相关文章

  1. Js基本类型中常用的方法总结

    1.数组 push() -----> 向数组末尾添加新的数组项,参数为要添加的项,返回值是新数组的长度,原数组改变: pop() -----> 删除数组末尾的最后一项,参数无,返回值是删除 ...

  2. JavaScript中判断对象是否属于Array类型的4种方法及其背后的原理与局限性

    前言 毫无疑问,Array.isArray是现如今JavaScript中判断对象是否属于Array类型的首选,但是我认为了解本文其余的方法及其背后的原理与局限性也是很有必要的,因为在JavaScrip ...

  3. 项目中常用js方法整理common.js

    抽空把项目中常用js方法整理成了common.js,都是网上搜集而来的,大家一起分享吧. var h = {}; h.get = function (url, data, ok, error) { $ ...

  4. C语言中常用计时方法总结

    转自:http://blog.csdn.net/fz_ywj/article/details/8109368 C语言中常用计时方法总结 1. time() 头文件:time.h 函数原型:time_t ...

  5. 大数据学习day13------第三阶段----scala01-----函数式编程。scala以及IDEA的安装,变量的定义,条件表达式,for循环(守卫模式,推导式,可变参数以及三种遍历方式),方法定义,数组以及集合(可变和非可变),数组中常用的方法

    具体见第三阶段scala-day01中的文档(scala编程基础---基础语法)  1. 函数式编程(https://www.cnblogs.com/wchukai/p/5651185.html): ...

  6. org.apache.commons.lang.StringUtils中常用的方法

    org.apache.commons.lang.StringUtils中常用的方法,这里主要列举String中没有,且比较有用的方法: 1. 检查字符串是否为空: static boolean isB ...

  7. String对象中常用的方法

    String对象中常用的方法   1.charCodeAt方法返回一个整数,代表指定位置字符的Unicode编码.strObj.charCodeAt(index)说明:index将被处理字符的从零开始 ...

  8. String:(字符串)中常用的方法

    package stringyiwen; //字符串中常用的方法public class StringTest03 { public static void main(String[] args) { ...

  9. 【java】开发中常用字符串方法

    java字符串的功能可以说非常强大, 它的每一种方法也都很有用. java字符串中常用的有两种字符串类, 分别是String类和StringBuffer类. Sting类 String类的对象是不可变 ...

随机推荐

  1. Volley请求

    1. Volley简介 我们平时在开发Android应用的时候不可避免地都需要用到网络技术,而多数情况下应用程序都会使用HTTP协议来发送和接收网络数据.Android系统中主要提供了两种方式来进行H ...

  2. Android热插拔事件处理详解

    一.Android热插拔事件处理流程图 Android热插拔事件处理流程如下图所示: 二.组成 1. NetlinkManager:        全称是NetlinkManager.cpp位于And ...

  3. Android群英传笔记——第九章:Android系统信息和安全机制

    Android群英传笔记--第九章:Android系统信息和安全机制 本书也正式的进入尾声了,在android的世界了,不同的软件,硬件信息就像一个国家的经济水平,军事水平,不同的配置参数,代表着一个 ...

  4. 寻找春天 九宫格日记-2014.04.26

    写九宫格日记 总会在听到某一首歌的时候泪流满面:总会在看到某个似曾相识的背影的时候惆怅莫名,总会在嗅到某种香味的时候默默发呆,总会在经过某个地方的时候频频回首.生命有限,不要把它浪费在重复别人的生活上 ...

  5. saiku中文维度,补充说明

    saiku在筛选中文维度 会出现浏览器白屏 停止响应的现象,经过跟踪源代码,分析原来在linux 操作系统中 数据库读取的中文和界面选取的编码是不一致的 解决方法, classes\saiku-dat ...

  6. 物理引擎中velocity的单位是个什么鬼?

    现在, 你可能对于什么是velocity的单位感到奇怪.他是单位秒中经过点的一个可测量的量(pt/s).如果你想要在iphone横屏从左往右的移动物体,并且你想在1秒内移动1024个点,那么物体的x速 ...

  7. Media Player Classic - HC 源代码分析 2:核心类 (CMainFrame)(1)

    ===================================================== Media Player Classic - HC 源代码分析系列文章列表: Media P ...

  8. PS 滤镜——极坐标变换到平面坐标

    %%% 极坐标到平面坐标 clc; clear all; close all; addpath('E:\PhotoShop Algortihm\Image Processing\PS Algorith ...

  9. 【46】java对象的三个特征(oop)

    对象的三个特征: 对象的行为: 对象有哪些行为和方法 同一个类的实例,由于支持相同的行为具有家族式的特征,对象的行为是由方法定义的. 对象的状态: 施加方法时.对象的响应 每个对象都保存着描述当前特征 ...

  10. 实战项目开发细节:C语言分离一个16进制数取出相应的位1或0

    最近在公司开发一个关于钢琴的PCBA项目,项目大概是这样的,完成各种功能的测试,准备去工厂量产的时候可以通过软件快速甄别硬件是否短路,断路等问题. 其中,甄别好坏的方法是通过比如按键,或者其它的操作然 ...