JavaScript中数组Array方法详解

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

1、Array.join()方法

Array.join()方法将数组中所有元素都转化为字符串并连接在一起,返回最后生成的字符串。可以指定一个可选的符号或字符串在生成的字符串中来分隔数组的各个元素。如果不指定分隔符,默认使用逗号。注意:此方法不会改变原始数组

var arr = [‘a‘, ‘b‘, ‘c‘];

console.log(arr.join()); // a,b,c

console.log(arr.join(" ")); // a b c

console.log(arr.join("")); // abc

console.log(arr.join("slf")); // aslfbslfc

var arr2 = new Array(10);

console.log(arr2.join("-")); // ---------

  扩展:Array.join()方法是String.split()方法的逆向操作,后者是将字符串分割成若干块来创建一个数组。

2、Array.reverse()方法

Array.reverse()方法将数组中的元素颠倒顺序,返回逆序的数组。它采取了替换;换句话说,它不通过重新排列的元素创建新的数组,而是在原先的数组中重新排列它们。注意:此方法会改变原始数组。

var arr = [‘a‘, ‘b‘, ‘c‘];

console.log(arr.reverse()); // [‘c‘, ‘b‘, ‘a‘]

console.log(arr); // [‘c‘, ‘b‘, ‘a‘]

3、Array.sort()方法

Array.sort()方法将数组中的元素排序并返回排序后的数组。当不带参数调用sort()方法时,数组元素以字母表顺序排序。注意:此方法会改变原始数组。

var arr = [‘ba‘, ‘b‘, ‘ac‘];

console.log(arr.sort()); // [‘ac‘, ‘b‘, ‘ba‘]

console.log(arr); // [‘ac‘, ‘b‘, ‘ba‘]

如果数组包含undefined元素,它们会被排到数组的尾部。

var arr = new Array(4);

arr[0] = ‘ba‘;
arr[1] = ‘b‘;
arr[2] = ‘zc‘;
arr[3] = undefined;

console.log(arr.sort()); // [‘ac‘, ‘b‘, ‘ba‘, undefined]

console.log(arr); // [‘ac‘, ‘b‘, ‘ba‘, undefined]

如果想按照其他方式而非字母表顺序进行数组排序,则必须给sort()方法传递一个比较函数。该函数决定了它的两个参数在排好序的数组中的先后顺序。假设第一个参数在前,比较函数应该返回一个小于0的数值。反之,假设第一个参数在后,函数应该返回一个大于0的数值。并且,假设两个值相等(它们的顺序无关紧要),函数应该返回0。例如,用数值大小而非字母表顺序进行数组排序,代码如下:

var arr = new Array(4);

arr[0] = 45;
arr[1] = 12;
arr[2] = 103;
arr[3] = 24;

console.log(arr.sort()); // [103, 12, 24 45]

console.log(arr.sort(function(a, b){return b-a;})); // [103, 45, 24, 12]

有时候需要对一个字符串数组执行不区分大小写的字母表排序,这时可以使用比较函数,首先将参数都转化为小写字符串(使用toLowerCase()方法),再开始比较。

var arr = [‘abc‘, ‘Def‘, ‘BoC‘, ‘FED‘];

console.log(arr.sort()); // ["BoC", "Def", "FED", "abc"]

console.log(arr.sort(function(s, t){

	var a = s.toLowerCase();
	var b = t.toLowerCase();
	if (a < b) return -1;
	if (a > b) return 1;
	return 0;

})); // ["abc", "BoC", "Def", "FED"]

4、Array.concat()方法

Array.concat()方法创建并返回一个新数组,它的元素包括调用concat()的原始数组的元素和concat()的每个参数。如果这些参数中的任何一个自身是数组,则连接的是数组的元素,而非数组本身。但要注意,concat()不会递归扁平化数组的数组。注意:此方法
不会修改原始数组。

var arr = [‘abc‘, ‘Def‘, ‘BoC‘, ‘FED‘];

console.log(arr.concat(1, 2)); // ["abc", "Def", "BoC", "FED", 1, 2]

console.log(arr.concat(1, 2, [4, 5])); // ["abc", "Def", "BoC", "FED", 1, 2, 4, 5]

console.log(arr.concat(1, 2, [4, [‘slf‘, 5]])); // ["abc", "Def", "BoC", "FED", 1, 2, 4, Array[2]]

console.log(arr); // ["abc", "Def", "BoC", "FED"]

5、Array.slice()方法

Array.slice()方法返回指定数组的一个片段或子数组。它的两个参数分别指定了片段的开始和结束的位置。返回的数组包含第一个参数指定的位置和所有到第二个参数指定的位置(但不含第二个参数指定的位置)之间的所有数组元素。如果只指定一个参数,返回的数组将包含从开始位置到数组结尾的所有元素。如参数中出现负数,它表示相对于数组中最后一个元素的位置。例如,参数-1指定了最后一个元素,而-3指定了倒数第三个元素。注意,此方法不会修改原始数组。

var arr = [‘abc‘, ‘Def‘, ‘BoC‘, ‘FED‘, ‘slf‘];

console.log(arr.slice(1, 2)); // ["Def"]

console.log(arr.slice(3)); // ["FED", ‘slf‘]

console.log(arr.slice(0, -1)); // [‘abc‘, ‘Def‘, ‘BoC‘, ‘FED‘]

console.log(arr.slice(-3, -1)); // [‘BoC‘, ‘FED‘]

console.log(arr); // [‘abc‘, ‘Def‘, ‘BoC‘, ‘FED‘, ‘slf‘]

6、Array.splice()方法

Array.splice()方法是在数组中插入或删除元素的通用方法。注意,splice()和slice()拥有非常相似的名字,但它们的功能却有本质的区别。splice()能够从数组中删除元素、插入元素到数组中或者同时完成这两种操作。在插入或删除点之后的数组元素会根据需要增加或减小它们的索引值,因此数组的其他部分仍然保持连续的。splice()的第一个参数指定了插入和(或)删除的起始位置。第二个参数指定了应该从数组中删除的元素的个数。如果省略第二个参数,从起始点开始到数组结尾的所有元素都将被删除。splice()返回一个由删除元素组成的数组,或者如果没有删除元素就返回一个空数组。注意:此方法会改变原始数组。(区别于concat(), splice()会插入数组本身而非数组的元素。)

var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];

console.log(arr.splice(7)); // [8, 9]

console.log(arr); // [1, 2, 3, 4, 5, 6, 7]

console.log(arr.splice(2, 4)); // [3, 4, 5, 6]

console.log(arr); // [1, 2, 7]

console.log(arr.splice(2, 1, 3, 4, 5, 6)); // [7]

console.log(arr); // [1, 2, 3, 4, 5, 6]

console.log(arr.splice(3, 2, 3, [1, 2, 3])); // [4, 5]

console.log(arr); // [1, 2, 3, [1, 2, 3], 6]

7、Array.push()和Array.pop()方法

push()和pop()方法允许将数组当做栈来使用。push()方法在数组的尾部添加一个或多个元素,并返回数组新的长度。pop()方法则相反:它删除数组的最后一个元素,减小数组长度并返回它删除的值。注意:这两个方法都会修改原始数组。

var arr = [1, 2, 3];

console.log(arr.push(7)); // 4

console.log(arr); // [1, 2, 3, 7]

console.log(arr.push([2, 4])); // 5

console.log(arr); // [1, 2, 3, 7, [2, 4]]

console.log(arr.pop()); // [2, 4]

console.log(arr); // [1, 2, 3, 7]

8、Array.unshift()和Array.shift()方法

unshift()和shift()方法的行为非常类似于push()和pop()方法,不一样的是:前者是在数组的头部进行元素的插入和删除操作。unshift()在数组的头部添加一个或多个元素,并将已存在的元素移动到更高索引的位置来获得足够的空间,最后返回数组新的长度。shift()删除数组的第一个元素并返回所删除的元素,然后把所有随后的元素向前移动一个位置来填补数组头部的空缺。注意:这两个方法都会修改原始数组。

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

console.log(arr.shift()); // 6

console.log(arr); // [2, 3, 4, 5, 6]

console.log(arr.unshift([‘a‘, ‘b‘])); // 6

console.log(arr); // [[‘a‘, ‘b‘], 2, 3, 4, 5, 6]

console.log(arr.unshift(‘a‘, ‘b‘)); // 8

console.log(arr); // [‘a‘, ‘b‘, [‘a‘, ‘b‘] 2, 3, 4, 5, 6]

注意,当使用多个参数调用unshift()时,如果参数是一次性插入的而非一次一个地插入,这意味着最终的数组中插入的元素的顺序和它们在参数列表中的顺序一致。而假如元素是一次一个地插入,它们的顺序应该是反过来的。

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

console.log(arr.unshift(‘a‘, ‘b‘, ‘c‘)); // 9

console.log(arr); // [‘a‘, ‘b‘, ‘c‘, 6, 2, 3, 4, 5, 6]

console.log(arr.unshift(1)); // 10

console.log(arr); // [1, ‘a‘, ‘b‘, ‘c‘, 6, 2, 3, 4, 5, 6]

console.log(arr.unshift(2)); // 11

console.log(arr); // [2, 1, ‘a‘, ‘b‘, ‘c‘, 6, 2, 3, 4, 5, 6]

9、Array.toString()和Array.toLocaleString()方法

数组和其他JavaScript对象一样拥有toString()方法。针对数组,该方法将数组的每个元素都转化为字符串并且输出用逗号分隔的字符串列表。注意:此方法不会修改原始数组(这与不使用任何参数调用join()方法返回的字符串是一样的)

var arr = [1, 2, 3];

console.log(arr.toString()); // 1,2,3

console.log(typeof(arr.toString())) // string

console.log(arr); // [1, 2, 3]

扩展:toLocaleString()是toString()方法的本地化版本。它调用元素的toLocaleString()方法将每个数组元素转化为字符串,并且使用本地化分隔符将这些字符串连接起来生成最终的字符串。

总结:以上介绍的Array数组方法中,共12个方法,这些方法都是在ECMAScript 3中定义的。其中,Array.join()方法、Array.concat()方法、Array.slice()方法、Array.toString方法以及Array.toLocaleString()方法,都不会改变原始数组。其他7中数组方法执行时,都会对原始数进行改变。

时间: 2024-10-15 21:57:07

JavaScript中数组Array方法详解的相关文章

IOS问题汇总:2015-1-9 IOS之NSArray 中调用的方法详解(转)

IOS之NSArray 中调用的方法详解 下面的例子以 NSArray *array = [NSArray arrayWithObjects:@“wendy”,@“andy”,@“tom”,@“jonery”,@“stany”, nil];1.获取数组中总共有多少个对象. -(NSUInteger)count; NSLog(@“%d”,[array count]); 2 2.获取数组中下标对应的元素对象.(下标是从0开始) -(id)objectAtIndex:(NSUInteger)index

php中二维数组排序问题方法详解

合肥开源IT教育分享一篇<php中二维数组排序问题方法详解>的文章希望能够帮助在学习php的新手们,如果还有什么不懂的问题 可以关注我们的官方网站:www.kyitjy.com  豪华的名师团队,多位技术专家授课,多位核心研发工程师研发授课. PHP中二维数组排序,可以使用PHP内置函数uasort() 示例一: 使用用户自定义的比较函数对数组中的值进行排序并保持索引关联 回调函数如下:注意回调函数的返回值是负数或者是false的时候,表示回调函数的第一个参数在前,第二个参数在后排列 $per

Java中的main()方法详解

在Java中,main()方法是Java应用程序的入口方法,也就是说,程序在运行的时候,第一个执行的方法就是main()方法,这个方法和其他的方法有很大的不同,比如方法的名字必须是main,方法必须是public static void 类型的,方法必须接收一个字符串数组的参数等等. 在看Java中的main()方法之前,先看一个最简单的Java应用程序HelloWorld,我将通过这个例子说明Java类中main()方法的奥秘,程序的代码如下: 1 /** 2 * Java中的main()方法

javascript中=、==、===区别详解

javascript中=.==.===区别详解今天在项目开发过中发现在一个小问题.在判断n==""结果当n=0时 n==""结果也返回了true.虽然是个小问题,却有着大影响,所以决定深入分析下.1.= 赋值运算符 //例: var n=1; console.log(n);//1 n=n+1; console.log(n);//2 2.== 值比较运算符 值比较运算符在表达式两边的数据类型不一致时,会隐式转换为相同数据类型,然后对值进行比较. //例: var a=

java中System.getProperty()方法详解

java中System.getProperty()方法详解,如下: System.out.println("java版本号:" + System.getProperty("java.version")); // java版本号 System.out.println("Java提供商名称:" + System.getProperty("java.vendor")); // Java提供商名称 System.out.println

Python中格式化format()方法详解

Python中格式化format()方法详解 Python中格式化输出字符串使用format()函数, 字符串即类, 可以使用方法; Python是完全面向对象的语言, 任何东西都是对象; 字符串的参数使用{NUM}进行表示,0, 表示第一个参数,1, 表示第二个参数, 以后顺次递加; 使用":", 指定代表元素需要的操作, 如":.3"小数点三位, ":8"占8个字符空间等; 还可以添加特定的字母, 如: 'b' - 二进制. 将数字以2为基数

JavaScript中数组Array.sort()排序方法详解

JavaScript中数组的sort()方法主要用于对数组的元素进行排序.其中,sort()方法有一个可选参数.但是,此参数必须是函数. 数组在调用sort()方法时,如果没有传参将按字母顺序(字符编码顺序)对数组中的元素进行排序,如果想按照其他标准进行排序,就需要进行传一个参数且为函数,该函数要比较两个值,并且会返回一个用于说明这两个值的相对顺序的数字. 1.对数字数组进行由小到大的顺序进行排序. 代码: var arr = [22,12,3,43,56,47,4]; arr.sort();

jquery中的ajax方法详解

定义和用法ajax() 方法通过 HTTP 请求加载远程数据.该方法是 jQuery 底层 AJAX 实现.简单易用的高层实现见 $.get, $.post 等.$.ajax() 返回其创建的 XMLHttpRequest 对象.大多数情况下你无需直接操作该函数,除非你需要操作不常用的选项,以获得更多的灵活性.最简单的情况下,$.ajax() 可以不带任何参数直接使用.注意:所有的选项都可以通过 $.ajaxSetup() 函数来全局设置. 语法 jQuery.ajax([settings])

Laravel框架中的make方法详解

为什么网上已经有这么多的介绍Laravel的执行流程了,Laravel的容器详解了,Laravel的特性了,Laravel的启动过程了之类的文章,我还要来再分享呢? 因为,每个人的思维方式和方向是不一样的,所以就会出现这样的一个场景,当你遇到一个问题在网上寻求答案的时候,有很多文章都解释了你的这个问题,但是你只对其中一篇感兴趣,那是因为作者的思维方式和你的很接近而作者的文笔也可能是你喜欢的那种类型.正因如此,我也来分享一些我在研究Laravel框架时的一些观点和看法,希望给那些和我有类似思维方式