javascript权威指南学习笔记-数组1(八)

时间:2022-08-27 08:14:13

数组是js里面最常用的对象了,日常开发许多时候都是面向一个数组在编程:
常用方法:数组元素添加和删除
提到添加删除,最先想到的是push、pop、unshift、shift

//push在数组尾部添加元素
var userName=["wangwu"];
//在数组的尾部追加了2个元素
userName.push("zhangsan","lisi");
//从数组尾部删除了一个元素
userName.pop();
console.log(userName);//输出["wangwu", "zhangsan"]

其实在开发过程中push用的比较多,而pop用的比较少,因为实际编程中,大部分应该是传入一个值,根据值进行删除操作,而直接从尾部删除一个元素的情况是比较少的:

    //写个根据数组值进行删除操作 采用数组的delete方法来实现
function getAryIndex(array,val){
//如果是ECMAScript5直接调用
if(typeof array.indexOf=="function"){
return array.indexOf(val);
}else{
//如果不支持ECMAScript5 则循环比较获取
for(var num=0;num<array.length;num++){
if(array[num]==val){
return num;
}
}
return -1;
}
}
function deleteEl(array,val){
//查找元素在数组中的位置, 当然ECMAScript5里面已经存在了获取元素序号的方法,但ECMAScript3 是没有的
var index=getAryIndex(array,val);
if(index>0){
delete(array[index]);
}
}
var userName=["wangwu","zhangsan","lisi"];
deleteEl(userName,"zhangsan");
console.log(userName);
//输出["wangwu", 2: "lisi"]
console.log(userName[1]);//输出为undefined

其实这种删除在程序里也比较少,一般希望删除了该元素,就不希望该元素在数组中还占有位置,而delete删除是不会改变数组的length,为了修改length属性,可以采用splice来实现数组的删除

  function deleteEl(array,val){
//查找元素在数组中的位置, 当然ECMAScript5里面已经存在了获取元素序号的方法,但ECMAScript3 是没有的
var index=getAryIndex(array,val);
if(index>0){
array.splice(index,1);
}
}
console.log(userName);//输出["wangwu", "lisi"]
//这就是想要的删除操作咯

但又会感觉代码写的有点别扭,为啥要把数组作为参数传递进去呢,不简洁也麻烦,可以将deleteEl改造成数组的原型方法,通过原型继承扩展的方式来实现



function getAryIndex(array,val){
if(typeof array.indexOf=="function"){
return array.indexOf(val);
}else{
for(var num=0;num<array.length;num++){
if(array[num]==val){
return num;
}
}
return -1;
}
}
//通过原型继承对数组对象进行方法扩展
Array.prototype.deleteEl=function(val){
var index=getAryIndex(this,val);
if(index>0){
this.splice(index,1);
}
}
var userName=["wangwu","zhangsan","lisi"];
userName.deleteEl("zhangsan");//这样写更加直观了
console.log(userName);//输出["wangwu", "lisi"]

当然我们还可以将getAryIndex方法也通过原型继承方式将方法扩展了。

//unshift在数组头部插入一个元素、shift方法在数组头部删除元素

//push在数组尾部添加元素
var userName=["wangwu"];
//在数组的尾部追加了2个元素
userName.unshift("zhangsan","lisi");
console.log(userName);//输出var userName=["wangwu"];
//在数组的尾部追加了2个元素
userName.unshift("zhangsan","lisi");
console.log(userName);//输出["zhangsan", "lisi", "wangwu"]