javascript中Array类型常用方法

方法总览:

  • instanceOf
  • Array.isArray()
  • toString()
  • join()
  • push()
  • pop()
  • shift()
  • unshift()
  • splice()
  • concat()
  • slice()
  • indexOf
  • lastIndexOf
  • reverse()
  • sort()
  • forEach()
  • filter()
  • map()
  • every()
  • some()
  • reduce()
  • reduceRight()

一、检测方法

  1. instanceof
  2. Array.isArray()   (ES5 新增)
    var arr = [1,2,3,4,5,6];
    
    arr instanceof Array;	// true
    
    Array.isArray(arr);		// true

二、转换为字符串的方法

转换方法不改变原数组,只返回转换后的字符串

  1. toString()

    var arr1 = [1,2,3,4,6];
    var arr2 = [‘a‘,‘b‘,‘c‘,‘d‘];
    
    arr1.toString();	// ‘1,2,3,4,5,6‘
    arr2.toString();	// ‘a,b,c,d‘
  2. join()
    /*
     *	join方法只接受一个参数,即用作分隔符的字符串,
     *	然后返回包含所有数组项的字符串
     */
    var arr = [1,2,3,4,5];
    
    arr.join(‘‘);	// ‘12345‘
    arr.join(‘-‘);	// ‘1-2-3-4-5‘

三、操作方法

1. 会改变原数组的操作方法

  • push()

    /*
     *	arr.push(arg1,arg2,arg3...)
     *	push方法接收任意数量的参数,并逐个添加到目标数组末尾,
     *	返回值为目标数组修改后的长度
     */
     var arr = [1,2,3];
     alert(arr.push(4,5));		// 5
     alert(arr);				// [1,2,3,4,5]
  • pop()
    /*
     *	arr.pop()
     *	pop方法为从目标数组末尾移除一项,并返回该移除项
     */
     var arr = [1,2,3,4,5];
     alert(arr.pop());		// 5
     alert(arr);			// [1,2,3,4]
  • shift()
     /*
      *  arr.shift()
      *	 shift方法为从目标数组开头移除一项,并返回该移除项
      */
     var arr = [1,2,3,4,5];
     alert(arr.shift());	// 1
     alert(arr);			// [2,3,4,5]
  • unshift
     /*
      *	 arr.unshift(arg1,arg2,arg3...)
      *	 unshift方法接收任意数量的参数,并逐个添加到目标数组开头,
      *  返回值为目标数组修改后的长度
      */
     var arr4 = [1,2,3];
     alert(arr4.unshift(4,5));	// 5
     alert(arr4);				// [4,5,1,2,3]
  • splice()
    /*
     *	Array.splice(index,howmany,arg1,arg2...);
     *	splice主要用途为向数组中插入项,方法主要为两种:
     *	删除:  splice(要删除的第一项的位置,要删除的项数)
     *  插入或替换: splice(起始位置,要删除的项数,要插入的项数)
     *
     *	返回值为一个包含删除项的数组
     */
    
     // 删除
     var arr1 = [‘one‘,‘two‘,‘three‘];
     var remove = arr1.splice(1,1);
     alert(remove);		// [‘two‘]
     alert(arr1);		// [‘one‘,‘three‘]
    
     // 插入
     var arr2 = [‘one‘,‘two‘,‘three‘];
     var remove = arr2.splice(1,2,‘four‘,‘five‘);
     alert(remove);		// [‘two‘,‘three‘]
     alert(arr2);		// [‘one‘,‘four‘,‘five‘]
    
     // 替换
     var arr3 = [‘one‘,‘two‘,‘three‘];
     var remove = arr3.splice(1,1,‘four‘);
     alert(remove);		// [‘two‘]
     alert(arr3);		// [‘one‘,‘four‘,‘three‘]

2. 不会改变原数组的方法

  • concat()

    /*
     *	Array.concat(arg1,arg2,arg3...)
     *  concat方法为先创建当前数组一个副本,然后将接收的参数添加到副本末尾,
     *	最后返回该新数组
     */
     var arr = [1,2,3];
     var a = [‘one‘,‘two‘];
     var b = ‘three‘;
     var c = { name: ‘four‘};
    
     var newArr = arr.concat(a,b,c);
     alert(newArr);	// [1,2,3,‘one‘,‘three‘,{name:‘four‘}]
  • slice()
    /*
     *	Array.slice(start,end)
     *	slice方法为截取数组,返回截取项组成的新数组
     *	slice 为一个参数时,截取该参数指定的开始项到数组的末尾
     *	slice 为两个参数时,截取参数指定的起始和结束项,但不包括结束项(包左不包右)
     */
     var arr = [1,2,3,4,5,6,7,8,9];
    
     var sliceArr1 = arr.slice(3);		// [4,5,6,7,8,9]
     var sliceArr2 = arr.slice(3,5);	// [4,5]
     var sliceArr3 = arr.slice(3,-1);	// [4,5,6,7,8]
     var sliceArr4 = arr.slice(-3,-1);	// [7,8]
     var sliceArr5 = arr.slice(-1,-3);	// []
  • indexOf() 与 lastIndexOf()
    /*
     *	indexOf(value,start),lastIndexOf(value,start)
     *	两方法都为数组查找方法,查找目标项成功则返回数组该值的索引,
     *	查找失败则返回-1
     *  第一个参数为要查找的目标值,第二个参数查找的起始位置
     *	indexOf 为正序查找
     *  lastIndexOf 为逆序查找
     */
     var arr = [‘one‘,‘two‘,‘two‘,‘three‘,‘four‘,‘four‘,‘five‘];
    
     var index1 = arr.indexOf(‘two‘);		  // 1
     var index2 = arr.indexOf(‘two‘,2);		  // 2
     var index3 = arr.lastIndexOf(‘four‘);	  // 5
     var index4 = arr.lastIndexOf(‘four‘,4);  // 4

四、排序方法

排序方法会改变原数组

  1. reverse()

    /*
     *  Array.reverse()
     *	翻转数组项的顺序
     *
     */
     var arr = [1,2,3,4,5];
    
     arr.reverse();
     alert(arr);	// [5,4,3,2,1]
  2. sort()
    /*
     *	Array.sort(callback)
     *	sort为数组的排序方法,默认按数组每一项进行toString()后的结果进行
     *  升序排序
     *  sort接收一个回调函数为参数,回调函数有两个参数,代表数组的前一项和
     *  后一项,如果第一个参数应该位于第二个之前则返回一个负数,如果两个参数相等
     *  则返回 0,如果第一个参数应该位于第二个之后则返回一个正数
     */
     var arr1 = [2,1,4,3,5];
     var arr2 = [1,50,10,500,100,1000];
    
     arr1.sort();
     arr2.sort();
     alert(arr1);	// [1,2,3,4,5]
     alert(arr2);	// [1,10,100,1000,50,500]
    
     arr2.sort(function(pre,next) {
     	if(pre < next) {
     		return -1;
     	}else if(pre === next) {
     		return 0;
     	}else {
     		return 1;
     	}
     });
     alert(arr2);	// [1,10,50,100,500,1000]

五、迭代方法(ES5)

数组的迭代方法都接收一个回调函数,这个回调函数会在数组的每一项上运行,回调函数接收三个参数:数组项的值,数组项的索引,数组对象本身。

  1. forEach():对数组中的每一项运行给定函数。没有返回值。

    var arr = [‘one‘,‘two‘,‘three‘];
    arr.forEach(function(item,index,thisArr) {
    	// 迭代的item 为arr 每一项的值
    	// 迭代的index 为arr 每一项的索引
    	// thisArr 为 数组arr
    });
  2. filter():对数组的每一项运行给定函数, 返回该函数会返回 true 的项组成的数组。
    var arr = [1,2,3,4,5,6,7];
    var filterArr = arr.filter(function(item,index,thisArr) {
    	return item > 4;
    });
    alert(filterArr);	// [5,6,7]
  3. map(): 对数组中的每一项运行给定函数,返回每次函数调用的结果组成的数组。
    var arr = [1,2,3,4,5,6,7];
    var mapArr = arr.map(function(item,index,thisArr) {
    	return item + 10;
    });
    alert(mapArr);	// [11,12,13,14,15,16,17]
  4. every(): 对数组中的每一项运行给定函数,如果该函数对每一项都返回 true,则返回 true。
    var arr = [1,2,3,4,5,6,7];
    
    var every1 = arr.every(function(item,index,thisArr) {
    	// 对数组每一项与4进行比较
    	return item > 4;
    });
    alert(every1);	// false
    
    var every2 = arr.every(function(item,index,thisArr) {
    	// 对数组每一项与8进行比较
    	return item < 8;
    });
    alert(every2);	// true
  5. some(): 对数组中的每一项运行给定函数,如果该函数对任一项返回 true,则返回 true。
    var arr = [1,2,3,4,5,6,7];
    
    var some = arr.some(function(item,index,thisArr) {
    	// 对数组每一项与4进行比较,只要有一项大于4,就返回true
    	return item > 4;
    });
    alert(some);  	// true
  6. reduce(),reduceRight(): 迭代数组的所有项,然后构建一个最终返回的值, 传给 reduce()和 reduceRight()的函数接收 4 个参数:前一个值、当前值、项的索引和数组对象。这个函数返回的任何值都会作为第一个参数自动传给下一项。
    var arr = [1,2,3,4,5];
    
    // 使用reduce进行数组求和操作
    var sum = arr.reduce(function(pre,current,index,thisArr) {
    	return pre + current;
    });
    
    // reduceRight 则从相反方向,即从右向左迭代,结果一致
    alert(sum);		// 15
时间: 2024-10-06 01:33:48

javascript中Array类型常用方法的相关文章

JavaScript中Array类型方法总结

Array类型是ECMAScript中最常用的类型之一,ECMAScript中的数组与其他多数语言中的数组有着相当大的区别.ECMAScript数组的每一项可以保存任何类型的数据.这里总结了数组类型的大多数方法,方便以后查找使用. 一.创建数组的基本方式 创建数据的基本方式有两种: 1.使用Array构造函数 var colors=new Array();var colors=new Array(20); //创建length值为20的数组var colors=new Array("red&qu

javascript中array类型队列方法总结

队列方法 数组推入: push()    unshift()   调用方法返回数组新长度 数组移除: pop()     shift()       调用方法返回移除的那个元素 注:ie7及更早的版本中,unshift()方法总是返回undefined Demo

浅谈JavaScript中数组操作常用方法

JavaScript中数组操作常用方法 1.检测数组 1)检测对象是否为数组,使用instanceof 操作符 if(value instanceof Array) { //对数组执行某些操作 } 2)获取对象的类型,比较是否为object类型(此方法只能检测是否为Object,不推荐) if(typeof(value)=="Object") { //对数组执行某些操作 } 3)检测对象是否为数组,使用Array.isArray()方法(只支持ie9+,firefox 4+,safar

Javascript 中 Array的 sort()和 compare()方法

Javascript 中 Array的 sort()方法其实是把要排序的内容转化为string(调用 toString()), 然后按照字符串的第一位 ascii 码先后顺序进行比较,不是数字. 我们看看官方是怎么说的: arrayobj.sort(sortfunction) 参数 arrayObj 必选项.任意 Array 对象. sortFunction 可选项.是用来确定元素顺序的函数的名称.如果这个参数被省略,那么元素将按照 ASCII 字符顺序进行升序排列. 说明 sort 方法将 A

JavaScript中对象类型的转换小结

对象到字符串和对象到数字类型的转换涉及到两个重要的方法,最终的转换结果会受到这两个方法返回结果的影响,这两个方法就是toString和valueOf.所有的对象都会从Object对象中继承到这两个方法.toString方法 用于返回对象的字符串表示(但是其实也可以不返回字符串).对于默认从Object继承而来的toString方法并不会返回太多有意义的内容.而valueOf方法目的是返回一个可以表示对象的原始类型值,但是由于对象的复杂性,大多数情况下根本不可能用一个原始类型值来表示,所以默认的v

JavaScript 中Array数组的几个内置函数

本文章内容均参考<JavaScript高级程序设计第三版> 今天在看JavaScript书籍的时候,看到之前没有了解过的JavaScript中Array的几个内置函数对象,为了之后再开发工作中能方便查询,故编写此随笔.直接贴代码, function arrayEffect(){ var numbers = [1,2,3,4,5,6,7,8,9,10]; //------------------------------------ 支持浏览器版本 IE9+,Firfox 2+ ,Safair 3

对JavaScript中变量类型的重新理解

<JavaScript启示录>这本书中提出:JavaScript中,对象为“王”(JavaScript里的几乎所有东西都是对象或者用起来像对象). 飞燕草对JavaScript最深刻的理解--也是这么久以来最有收获的一个认识:JavaScript的值有两种--原始值和对象(原始值的集合)组成.再直接一点,全部都可以理解为对象,原始值虽然不是对象,但是原始值拥有等效包装器对象,按照这么说的话,在JavaScript中真的可以说是对象为“王”. 一:原始值(或简单值) 1.原始值有5种:5(num

Javascript中Array的使用

JavaScript中的Array对象就是数组,首先是一个动态数组,而且是一个像C#.Java中“数组.List.HashMap/Dictionary”等的超强综合体. Array数组 使用方式: 例1: var citys = new Array();//创建数组对象,无需初始化长度,动态         citys[0] = '上海';         citys[1] ='北京';         citys[2] = '深圳'; for(var i=0; i< citys.length;

JavaScript学习--Array类型

本文是自己的学习总结,供初学者参考使用.大神请忽略....知识总结自JS高级编程^ _ ^ 首先,JS中的Array类型的每一项可以保存任意类型的数据.而且数组的大小是可以动态调整的,它是随着数据的添加自动增长的. * 创建数组的方式 第一种是使用Array构造函数. var names=new Array(); var names=Array(); //可以省略new 操作符 . var names=new Array(20); var names=new Array("Merry"