Javascript的内置对象——Array类型二

上一篇我们讲了数组的创建、索引和检测数组,今天我们来看看ECMAScript给我们提供的数组方法。根据数组方法的特性和它们各自的作用,可以将他们分为栈方法、队列方法、排序方法、操作方法、位置方法、迭代方法、归并方法。 下面我们针对每种类型的方法来逐一看看。

栈方法

栈是什么?栈的定义是限定仅在表头进行插入和删除操作的线性表,栈作为一种数据结构,是一种只能在一端进行插入和删除操作的特殊线性表,它按照先进后出的原则存储数据。ECMAScript为数组专门提供了push()和pop()方法,来实现类似栈的行为。

arr.push(ele1,ele2,...eleN):可以将一个或多个元素添加至数组的末尾,返回新数组的长度。

var names = ['lucy','Bob','wannianqing'];
console.log(names.push('nacy','moby'));		//返回push之后的数组长度	
console.log(names)			//["lucy", "Bob", "wannianqing", "nacy", "moby"]

通常我们使用push是将一个元素或多个元素追加到一个数组的末尾,除此之外我们可以将push和apply组合起来使用,这样做的结果可以将两个数组合并成一个数组,当然这种合并方式跟concat()方法还是有区别的(concat方法合并会得到一个全新的数组)。下面我们用代码来看下

var arr1 = [1,2,3];
var arr2 = [4,5,6];

//使用concat合并的结果
var arr3 = arr1.concat(arr2);
console.log(arr1);		//[1,2,3]	
console.log(arr2);		//[4,5,6]
console.log(arr3);		//[1,2,3,4,5,6]
//使用push加apply合并的结果  没有新的数组
Array.prototype.push.apply(arr1,arr2);
console.log(arr1)		//[1,2,3,4,5,6]
console.log(arr2)		//[4,5,6]

arr.pop():从指定数组中删除最后一个元素并返回删除的元素,该方法会改变原数组

var names = ['wan','nian','qing'];

console.log(names.pop())	//qing
console.log(names)		//['wan','nian']

下面我们来试试自己写个函数实现pop的功能,我们利用数组的length属性,通过将数组的length减1,可以删掉数组的最后一个元素。代码如下:

var names = ['wan','nian','qing'];

function mPop(arr){
	var popVal = arr[arr.length-1]
	if(arr.length != 0){
		arr.length = arr.length-1;
	}
	return popVal;
}
console.log(mPop(names))
console.log(names)

队列方法

上面我们看了栈方法,栈方法遵循先进后出的原则。那么自然有与其对用的先进先出的队列方法。ECMAScript给我们提供了shift()方法。

shift():从指定数组中移除第一个元素,并返回该元素。该方法会改变原数组

var names = ['wan','nian','qing'];

console.log(names.shift());		//wan
console.log(names)			//['nian','qing']

unshift(ele1,ele2,..elen):从指定数组头部开始添加元素,返回改变后的数组长度

var names = ['wan','nian','qing'];

console.log(names.unshift('wo','shi'))	//数组长度 5
console.log(names)	//["wo", "shi", "wan", "nian", "qing"]

排序方法

数组中存在两个重排序的方法:reverse() 和sort()。

arr.reverse():将数组的元素的位置颠倒,第一个元素变为最后一个元素,最后一个元素变为第一个元素。

var names = ['wan','nian','qing'];
names.reverse();
console.log(names)  //['qing','nian','wan'];

arr.sort(compareFun):对数组元素进行排序,compareFun为可选参数,不传参则以默认的字符串Unicode排序。传入排序规则则按照规则排序。

var age = [1,3,5,2,6,8,9,11]


age.sort(function(a,b){
	return a-b;
});
console.log(age)    //由小到大排列

操作方法

在实际开发中,有时候需要我们先对数组进行一些操作后再去使用它。ECMAScript中给我们提供了很多用于操作数组的方法:concat()、slice()、splice()  

slice(begin,end):从原数组中begin开始到end位置结束(包含begin,不包含end)拷贝,返回一个新数组。该方法不会改变原数组。

var str = ['wo','shi','wan','nian','qing'];
var sliceStr = str.slice(2,5);
console.log(str);		//原数组不变
console.log(sliceStr);	//['wan','nian','qing']

slice还可以将一个类数组对象或者集合转换成一个新数组,使用Array.prototype.slice转换宿主对象

function demo(){
	var similarArr = Array.prototype.slice.call(arguments);
	console.log(similarArr);	// ["wan", "nian", "qing"]
}

demo('wan','nian','qing')

splice(start,deleCount,itemN):该方法可以删除数组中现有元素或添加新元素至数组中。

参数start代表 要从原数组哪个位置开始

参数deleCount代表 要修改原数组元素的个数

参数itemN代表 新添加元素,可以有是多个元素

var arr =['wan','nian','qing','wo','shi'];
//只给定一个参数 下面表示将从下标为1的位置开始到数组最后一位的元素都删除
console.log(arr.splice(1))    //输出["nian", "qing", "wo", "shi"]
console.log(arr)    //输出["wan"]

var arr =['wan','nian','qing','wo','shi'];
//给定两个参数 下面表示将从下标为1的位置开始到下标为2的位置结束的元素删除
console.log(arr.splice(1,2))		//["nian", "qing"]
console.log(arr)    //["wan", "wo", "shi"]

var arr =['wan','nian','qing','wo','shi'];
//给定多个参数 下面表示将下位为1到下标为2的元素替换成后面添加的元素
console.log(arr.splice(1,2,'qian','duan','kai','fa'))		//返回被修改的元素
console.log(arr)

 

位置方法

indexOf(searchElement,fromIndex):返回给定元素在数组中第一次出现的位置,如果不存在则返回-1。fromIndex是一个数字类型,为可选参数,代表要从哪个下标开始查找。

lastIndexOf(searchElement,fromIndex):返回给定元素在数组中最后一次出现的位置,不存在返回-1

迭代方法

every():该方法返回布尔值,只有当数组中素有元素都通过了指定函数的测试才返回true,数组中有一项元素不符合测试函数则立即返回false。IE9以前浏览器不支持该方法

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

console.log(arr.every(function(item){
	return item>0
}))

filter():遍历数组,数组中每一项运行给定函数,返回符合给定函数的项组成的数组。不改变原数组。IE9以前浏览器不支持该方法

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

console.log(arr.filter(function(item){
	return item>7
}))		//返回大于7的项组成的数组

console.log(arr)	//原数组不变

forEach():遍历数组,对数组的每个元素执行一次提供的函数。IE9以前浏览器不支持该方法

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

arr.forEach(function(item,index,array){
	console.log(item,index)
})
//item代表每一项元素  index是每一项的下标位置

some():对数组中每一项执行给定函数,数组中任意一项返回true,则返回true    

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

console.log(arr.some(function(item){
	return item>2
}))
//只要有一项大于2 就立即返回true

数组有关的方法暂时列举到这里,下一篇我们详细看下ES6 数组的扩展

参考资料 MDN web技术文档

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 5
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 5
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值