JavaScript经常使用对象Array(2)

  • 数组的join方法
  • 数组拼接concat方法
  • 数组切分slice方法
  • 强大的splice方法
  • indexOf以及lastIndexOf方法
  • 几种经常使用的迭代方法

数组的join方法

我们知道,数组的toString()以及toLocaleString()方法会返回以逗号分隔的数组字符串。可是假设我们希望分隔符不是单一的逗号,我们能够选择使用join()方法。join()方法能够接受一个參数,这个參数就是我们希望的分隔符,比如:

var colors = ["red", "blue", "white"];
alert(colors.join("?"));

会得到:

red?blue?white

假设你没有指定join()方法的參数:

alert(colors.join());

此时会默认使用逗号作为分隔符:

red,blue,white

数组拼接concat方法

我们知道在字符串的操作方法中。实用于字符串拼接的concat()方法,在数组中相同有该方法用于数组的拼接。

JS与Java等语言一个显著的不同在于,Java等语言在调用一个函数的时候,传入函数的參数必须严格与事先创建的函数签名一致。

而在JS中,解析器不仅不会去查验传入參数的数据类型,甚至连传进来參数有几个都无论。在使用concat()方法的时候,我们能够:

传入一个或多个数组作为參数。concat()方法会首先创建一个原数组的副本,然后将作为參数传入的数组依次加入在新数组末尾,最后返回该副本。

传入一个或多个非数组值作为參数,concat()方法相同会首先创建一个原数组的副本,然后对该副本进行操作。依次将传入的值加入在该副本末尾然后返回。

传入一个或多个数组、值的组合,操作方法同上。

实际上,JS并不要求传入參数的数据类型、參数个数,同一时候JS中数组间的元素能够不同。

concat()方法事实上能够接受一个或多个随意类型的參数实现数组的拼接。尽管非常多时候没太大必要这样做。

个人觉得这是JS赋予我们的自由,可是怎样利用好这一点并不easy。

须要注意的是,concat()方法不会改动原始数组,而是创建一个原始数组的副本,对副本进行操作,然后将新的数组作为返回值返回。

举个比較极端的样例:

function test() {
  var arr = [];
  var colors = ["red", "blue", "white"];

  var hello = function() {
    alert("hello world!");
  }

  arr = arr.concat(colors, false, 1, undefined, "yellow", ["gray", "black"], hello);
  alert(arr);

}   

以上代码我们使用数组的concat()方法。在空数组arr后面依次拼接了数组colorsBoolean型false数值型1Undefined型,String型yellow数组["gray, "black"]以及一个函数。

以上代码输出例如以下:

数组切分slice方法

slice()方法用于切分出数组指定区间。它能够接受1个或2个參数。这两个參数指定切分的起止位置。

当仅仅传入一个參数时。返回该位置到数组结尾的数组。

当传入两个參数时,放回第一个到第二个參数区间的子数组。(不包括第二个參数位置的元素)

比方说:

function test() {
  var colors = ["red", "blue", "white", "gray", "green", "gold", "orange"];
  var col1 = colors.slice(2);
  var col2 = colors.slice(1, 4);
  alert(colors + "\n" + col1 + "\n" + col2);
}   

输出:

我们能够看到,slice()方法并没有改变原colors数组的值,同一时候切分出来的数组不包括第二个參数相应的项。

slice()方法传入的參数能够为负数,负数的含义是从末尾開始的偏移量。位置确定的方法是用数组长度和该參数相加。比方当数组长度length为10的情况下。slice(-3。-1)和slice(7, 9)是等价的。

另外须要说明的是,当第二个參数小于第一个參数的时候。该方法将返回一个空数组。

强大的splice方法

splice()方法能够删除数组中指定项,在数组指定位置插入指定项。

或者结合删除和插入操作演变为在指定位置替换指定项。

删除指定项

此时splice()方法接受两个參数。第一个參数制定删除的起始位置,第二个參数指定须要删除的项数。该方法返回被删除项组成的数组。假设没有被删除项则返回空数组。

function test() {
  var colors = ["red", "blue", "white", "gray", "green", "gold", "orange"];
  var col1 = colors.splice(1, 3);
  alert(colors + "\n" + col1);
}

输出:

插入指定项

要在数组中插入指定项。splice()方法须要接受3个參数,第一个參数指定插入的起始位置。第二个为要删除的个数(我们在这里设为0。即不删除不论什么项),第三个參数为要插入的项。

比如:

function test() {
  var colors = ["red", "blue", "white", "gray", "green"];
  var col1 = colors.splice(1, 0, "brown", "orange");
  alert(colors + "\n" + col1);
}

输出:

此时col1为一个空数组。

替换指定项

实际上。在插入指定项的操作中,第二个參数设为非零值就可以删除某些项再在该处插入指定项,由此完毕替换的功能。

indexOf以及lastIndexOf方法

这两个方法的功能均为在数组中查找指定项的位置。

它们都接受1~2个參数。第二个參数是可选的。

当中第一个參数指定须要查找的项,第二个參数指定查找的起始位置。仅仅只是indexOf方法从数组的头向后查找,lastIndexOf方法从数组的尾向前查找。

当查找成功时。返回匹配的位置,否则返回-1。

须要强调的是,这里查找成功须要和指定项全等(===)而不是”==”。

举一个简单的样例:

  var colors = ["red", "blue", "gray", "white", "gray", "blue", "red"];
  var ind1 = colors.indexOf("gray");
  var ind2 = colors.indexOf("gray", 3);
  var ind3 = colors.lastIndexOf("gray");
  var ind4 = colors.lastIndexOf("gray", 3);

以上代码,ind1等于2,ind2等于4,ind3等于4。ind4等于2。

几种经常使用的迭代方法

JS中,有比較方便地实现数组迭代的方法。下面介绍的5种迭代方法均接收1~2个參数。第一个參数指定要在数组每一项上执行的函数,第二个參数非必需,指定执行该函数的作用域对象。

当中要作用于数组每一项的函数须要接收3个參数:数组项的值。该项在数组中的位置以及数组本身。说起来非常抽象,看下里的样例:

  • 最主要的对数组每一项遍历进行某种操作,我们能够用forEach()方法(相似于非常多其它语言中的for循环)。该方法没有返回值。如将数组每一项都加1:
var num = [1, 2, 3, 4, 5, 6, 7];
var forfun = function(item, ind, array) {
  array[ind] += 1;
}
var rst = num.forEach(forfun);
alert(num);

得到下面输出:

  • 假设我们要检測是否数组的每一项都满足某种条件能够使用every()方法,仅仅有当数组中全部项都满足条件时才会返回ture,否则返回false。
var num = [1, 2, 3, 4, 5, 6, 7];
var everfun = function(item, ind, array) {
  return (item > 3)。
}
var rst = num.every(everfun);

以上代码会检測是否数组中每一项都大于3。仅仅有当数组每一项都满足条件时,every()方法才会返回true。

显然上例返回false。

  • 假设我们要检測数组中是否存在某些项满足某种条件能够使用some()方法。与every()不同,当数组中存在某些项满足条件时,就会返回true。
var num = [1, 2, 3, 4, 5, 6, 7];
var somefun = function(item, ind, array) {
  return (item > 3);
}
var rst = num.some(somefun);

数组中存在大于3的项,rst值返回true。

  • 假设我们希望过滤出数组中满足某种条件的项,能够使用filter()方法。该方法会返回数组中满足条件的项(返回true的项)组成的新数组。
var num = [1, 2, 3, 4, 5, 6, 7];
var filterfun = function(item, ind, array) {
  return (item > 3);
}
var rst = num.filter(filterfun);
alert(num + "\n" + rst);

会得到下面输出:

1,2,3,4,5,6,7
4,5,6,7
  • 假设我们希望对数组进行某种映射操作,即对数组每一项进行某总操作并返回操作结果,能够使用map()方法。比方我们能够将一个数组映射到是否大于3的真值表中:
var num = [1, 2, 3, 4, 5, 6, 7];
var mapfun = function(item, ind, array) {
  return (item > 3);
}
var rst = num.map(mapfun);
alert(num + "\n" + rst);

得到下面输出:

时间: 2025-01-06 12:54:43

JavaScript经常使用对象Array(2)的相关文章

ExtJS学习-----------Ext.Array,ExtJS对javascript中的Array的扩展

关于ExtJS对javascript中的Array的扩展.能够參考其帮助文档,文档下载地址:http://download.csdn.net/detail/z1137730824/7748893 因为Array中的方法过多.将当中的部分方法设计实例进行学习.实例地址:http://blog.csdn.net/z1137730824/article/details/38797257 (1)Ext.Array中的方法 clean( Array array ) : Array 过滤掉数组里的空值,空值

JavaScript NodeList和Array

原文:JavaScript NodeList和Array 原文引用脚本之家作者:Jeff Wong,谢谢大神提供资源 在Web前端编程中,我们通常会通过document.getElementsByTagName或者document.getElementsByClassName的方法取出一组相同标签的dom元素.如下 var anchors = document.getElementsByTagName("a"); for (i = 0; i < anchors.length; i

JavaScript - reduce方法 (Array)

JavaScript - reduce方法 (Array) 解释:reduce() 方法接收一个函数作为累加器(accumulator),数组 中的每个值(从左到右)开始合并,最终为一个值. 语法:arr.reduce(callback,[initialValue]) 参数: callback:执行数组中每个值的函数,包含四个参数 previousValue:上一次调用回调返回的值,或者是提供的初始值(initialValue) currentValue:数组中当前被处理的元素 index:当前

javascript中的Array对象的slice()、call()、apply()详解

来51cto已经很多年,就是没怎么写文字,今天来一篇介绍JS的,文章篇幅不是很大,大部分内容是我参考了别人的博客后经过自己理解,自己整理的.方便自己以后回顾知识.文中涉及到javascript中的Array对象的slice().call().apply(); slice()方法,在我之前做的项目中,有两种数据类型下用到过.第一种是string类型的,还有一种是Array对象: string对象的slice(): 定义和用法 slice() 方法可提取字符串的某个部分,并以新的字符串返回被提取的部

Javascript中的Array(数组) 、{}(映射) 与JSON解析

做网页总会使用javascript,使用javascript总会使用JSON.最近用到一下,就写写. 下面是总结: 1.将javascript中的Array和{}转化为json字符串可以使用json2.js,源码地址https://github.com/douglascrockford/JSON-js. 2.将json字符串转为javascript对象,可以使用javascript自带的eval函数. 3.javascript中可以使用typeof查看变量的类型. 4.要访问json字段,必须是

[JavaScript]JavaScript中的Array

JavaScript中的Array 今天较全面地学习到了JS中的Array,也就是数组.写博文一篇来总结一下学习和使用过程中关于Array中的一些误区和常用API,加深一下印象. 关于Array最全面的API在此,MDN 阮一峰阮老师的Array教程 Array的定义 来自MDN的定义: JavaScript的Array对象是用于构造数组的全局对象,数组是类似于列表的高阶对象 来自阮一峰老师教程的定义: 数组(array)是按次序排列的一组值.每个值的位置都有编号(从0开始),整个数组用方括号表

JavaScript中的Array.prototype.slice.call()方法学习

JavaScript中的Array.prototype.slice.call(arguments)能将有length属性的对象转换为数组(特别注意: 这个对象一定要有length属性). 但有一个例外,IE下的节点集合它不能转换(因为IE下的dom对象是以com对象的形式实现,js对象和com对象不能进行转换) 首先,我们来看看JavaScript中的slice用法, 在JavaScript中Array是一个类,slice是此类中的一个方法,slice的中文意思是 '截取' 一个是String.

JavaScript中的Array和Map集合对象

JavaScript中的Array和Map集合对象 1.Array 用于在单个变量中存储多个值 创建 new Array(); new Array(size); new Array(element0, element1, ..., elementn); 长度 arr.length;设置或返回数组中元素的数目. 赋值 var arr = new Array(); arr[0] = '555'; arr[1] = '666'; 遍历 arr.forEach( function(a){ documen

javascript类型系统之Array

目录 [1]数组创建 [2]数组操作 [3]继承的方法 [4]实例方法 数组转换 数组检测 栈和队列 排序方法 操作方法 位置方法 前面的话 数组是一组按序排列的值,相对地,对象的属性名称是无序的.从本质上讲,数组使用数字作为查找键,而对象拥有用户自定义的属性名.javascript没有真正的关联数组,但对象可用于实现关联的功能 Array()仅仅是一种特殊类型的Object(),也就是说,Array()实例基本上是拥有一些额外功能的Object()实例.数组可以保存任何类型的值,这些值可以随时