网站地图    收藏   

主页 > 前端 > javascript >

JavaScript常用数组操作实例详解

来源:自学PHP网    时间:2014-09-19 14:47 作者: 阅读:

[导读] 今天小编来给大家介绍一些常用的数组操作实例,这里包括删除原数组,增加数组,数组反序,数组排序等等各种js数组操作方法,希望对各位同学有所帮助。...


1、数组的创建

 new Array();
 new Array(size);
 new Array(element0, element1, ..., elementn);


 参数


参数 size 是期望的数组元素个数。返回的数组,length 字段将被设为 size 的值。
 

参数 element ..., elementn 是参数列表。当使用这些参数来调用构造函数 Array() 时,新创建的数组的元素就会被初始化为这些值。它的 length 字段也会被设置为参数的个数。
 
返回值


返回新创建并被初始化了的数组。
 
如果调用构造函数 Array() 时没有使用参数,那么返回的数组为空,length 字段为 0。
 
当调用构造函数时只传递给它一个数字参数,该构造函数将返回具有指定个数、元素为 undefined 的数组。
 
当其他参数调用 Array() 时,该构造函数将用参数指定的值初始化数组。
 
当把构造函数作为函数调用,不使用 new 运算符时,它的行为与使用 new 运算符调用它时的行为完全一样。

 

2、数组的元素的访问

 

var testGetArrValue=arrayObj[1]; //获取数组的元素值

arrayObj[1]= "这是新值"; //给数组元素赋予新的值
 

 

3、数组元素的添加

 

代码
arrayObj. push([item1 [item2 [. . . [itemN ]]]]);// 将一个或多个新元素添加到数组结尾,并返回数组新长度

arrayObj.unshift([item1 [item2 [. . . [itemN ]]]]);// 将一个或多个新元素添加到数组开始,数组中的元素自动后移,返回数组新长度

arrayObj.splice(insertPos,0,[item1[, item2[, . . . [,itemN]]]]);//将一个或多个新元素插入到数组的指定位置,插入位置的元素自动后移,返回""。
 

 

4、数组元素的删除

 

arrayObj.pop(); //移除最后一个元素并返回该元素值

arrayObj.shift(); //移除最前一个元素并返回该元素值,数组中元素自动前移

arrayObj.splice(deletePos,deleteCount); //删除从指定位置deletePos开始的指定数量deleteCount的元素,数组形式返回所移除的元素
 

 

5、数组的截取和合并

 

arrayObj.slice(start, [end]); //以数组的形式返回数组的一部分,注意不包括 end 对应的元素,如果省略 end 将复制 start 之后的所有元素

arrayObj.concat([item1[, item2[, . . . [,itemN]]]]); //将多个数组(也可以是字符串,或者是数组和字符串的混合)连接为一个数组,返回连接好的新的数组
 

 

6、数组的拷贝

 

arrayObj.slice(0); //返回数组的拷贝数组,注意是一个新的数组,不是指向

arrayObj.concat(); //返回数组的拷贝数组,注意是一个新的数组,不是指向
 

 

7、数组元素的排序

 

arrayObj.reverse(); //反转元素(最前的排到最后、最后的排到最前),返回数组地址

arrayObj.sort(); //对数组元素排序,返回数组地址
 

 

8、数组元素的字符串化

 

arrayObj.join(separator); //返回字符串,这个字符串将数组的每一个元素值连接在一起,中间用 separator 隔开。

toLocaleString 、toString 、valueOf:可以看作是join的特殊用法,不常用
 
 
9、length 属性

Length属性表示数组的长度,即其中元素的个数。因为数组的索引总是由0开始,所以一个数组的上下限分别是:0和length-1。和其他大多数语言不同的是,JavaScript数组的length属性是可变的,这一点需要特别注意。当length属性被设置得更大时,整个数组的状态事实上不会发生变化,仅仅是length属性变大;当length属性被设置得比原来小时,则原先数组中索引大于或等于length的元素的值全部被丢失。下面是演示改变length属性的例子:

 
JScript 代码   复制


var arr=[12,23,5,3,25,98,76,54,56,76];

//定义了一个包含10个数字的数组

alert(arr.length); //显示数组的长度10

arr.length=12; //增大数组的长度

alert(arr.length); //显示数组的长度已经变为12

alert(arr[8]); //显示第9个元素的值,为56

arr.length=5; //将数组的长度减少到5,索引等于或超过5的元素被丢弃

alert(arr[8]); //显示第9个元素已经变为"undefined"

arr.length=10; //将数组长度恢复为10

alert(arr[8]); //虽然长度被恢复为10,但第9个元素却无法收回,显示"undefined"

下面再看一些实例

//shift:删除原数组第一项,并返回删除元素的值;如果数组为空则返回undefined 
 
var a = [1,2,3,4,5]; 
 
var b = a.shift(); //a:[2,3,4,5]   b:1 
 
 
 
//unshift:将参数添加到原数组开头,并返回数组的长度 
 
var a = [1,2,3,4,5]; 
 
var b = a.unshift(-2,-1); //a:[-2,-1,1,2,3,4,5]   b:7 
 
//注:在IE6.0下测试返回值总为undefined,FF2.0下测试返回值为7,所以这个方法的返回值不可靠,需要用返回值时可用splice代替本方法来使用。 
 
 
 
//pop:删除原数组最后一项,并返回删除元素的值;如果数组为空则返回undefined 
 
var a = [1,2,3,4,5]; 
 
var b = a.pop(); //a:[1,2,3,4]   b:5 
 
 
 
//push:将参数添加到原数组末尾,并返回数组的长度 
 
var a = [1,2,3,4,5]; 
 
var b = a.push(6,7); //a:[1,2,3,4,5,6,7]   b:7 
 
 
 
//concat:返回一个新数组,是将参数添加到原数组中构成的 
 
var a = [1,2,3,4,5]; 
 
var b = a.concat(6,7); //a:[1,2,3,4,5]   b:[1,2,3,4,5,6,7] 
 
 
 
//splice(start,deleteCount,val1,val2,):从start位置开始删除deleteCount项,并从该位置起插入val1,val2, 
 
var a = [1,2,3,4,5]; 
 
var b = a.splice(2,2,7,8,9); //a:[1,2,7,8,9,5]   b:[3,4] 
 
var b = a.splice(0,1); //同shift 
 
a.splice(0,0,-2,-1); var b = a.length; //同unshift 
 
var b = a.splice(a.length-1,1); //同pop 
 
a.splice(a.length,0,6,7); var b = a.length; //同push 
 
 
 
//reverse:将数组反序 
 
var a = [1,2,3,4,5]; 
 
var b = a.reverse(); //a:[5,4,3,2,1]   b:[5,4,3,2,1] 
 
 
 
//sort(orderfunction):按指定的参数对数组进行排序 
 
var a = [1,2,3,4,5]; 
 
var b = a.sort(); //a:[1,2,3,4,5]   b:[1,2,3,4,5] 
 
 
//slice(start,end):返回从原数组中指定开始下标到结束下标之间的项组成的新数组 
 
var a = [1,2,3,4,5]; 
 
var b = a.slice(2,5); //a:[1,2,3,4,5]   b:[3,4,5] 
 
 
//join(separator):将数组的元素组起一个字符串,以separator为分隔符,省略的话则用默认用逗号为分隔符 
 
var a = [1,2,3,4,5]; 
 
var b = a.join("|"); //a:[1,2,3,4,5]   b:"1|2|3|4|5"


常用的数据操作函数

concat

将参数列表连接到原数组后面形成一个新的数组并返回,原有数组不受影响。

var arr = ["a","b","c"];
var arr1 = arr.concat("d","e");
//arr1 = ["a","b","c","d","e"]

join

以指定的字符作为分割符,将数组转换为字符串,当指定字符为逗号时,其作用和 toString() 相同。

var str1 = arr.join(",");
//str1 = "a,b,c"

pop

通俗的讲,就是弹出数组的最后一个元素。结合下面的 push 方法,使得将数组作为栈来使用成为可能。pop 方法返回数组最后一个元素的值,并将 length 属性减 1,即返回后立即丢失最后一个元素。

var item1 = arr.pop();
//item1 = "c"

push

将参数添加到数组的结尾。

arr.push("d","e");
alert(arr);
//arr = ["a","b","c","d","e"]

reverse

将数组中的元素反转排列,这个操作是在原有数组上经行操作,同时也返回数组本身。

arr.reverse();
alert(arr);
//arr = ["c"."b","a"]

shift

移去数组的第一个元素,并返回这个元素的值。这个方法的性质和 pop 方法很类似,pop 方法是移去最后一个元素。

var item1 = arr.shift();
//item1 = "a"

unshift

将参数列表插入到数组的开头。其性质和 push 方法类型,但 push 方法是将元素添加到数组的结尾。

arr.unshift("d","e");
alert(arr);
//arr = ["d","e","a","b","c"]

slice

返回数组对象的一个子集,索引从开始(包括开始位置元素),到结束(不包括结束位置元素),原有数组不受影响。当 开始或者结束为负数时,则使用他们加上数组长度后的值。如果结束小于等于开始,将返回空数组。

var item1 = arr.slice(1,2);
//item1 = "b"
var item2 = arr.slice(-2,-1);
//item2 = "b"

splice

从数组对象中移除指定长度的元素,并替换为新的元素(相当于执行替换操作)。如果没有指定新的元素,则相当于执行删除操作。返回被删除元素组成的数组。

var arr1 = arr.splice(1,2,"d","e");
//arr1 = ["b","c"]
alert(arr);//["a","d","e"]
var arr2 = arr.splice(1,2);
//arr2 = ["d","e"]
alert(arr);
//arr = ["a"]

1.删除数组中指定的元素


/**
 * 参考实例
foreach = function (obj, insp){
  if(obj== null && obj.constructor != Array){
  return [];
}
//obj是要处理的数组,obj==null 表示对象尚未存在;obj.constructor != Array 表示对象obj的属性的构造函数不是数组;
//constructor属性始终指向创建当前对象的构造函数。两个条件均满足,则返回空数组[];

//下面对constructor属性作进一步了解。
var obj= [1, 2, 3, 4]; // 等价于 var obj= new Array(1, 2, 3, 4);
console.log(obj.constructor === Array); // 返回true 表明obj的构造函数为Array;

var foo= function() { }; // 等价于 var foo = new Function();
console.log(foo.constructor === Function); // 返回true 表明foo的构造函数为Function;

var obj = new Foo();  //由构造函数实例化一个obj对象
console.log(obj.constructor === Foo); // 返回true 表明obj的构造函数为Foo;

 */

//删除数组中指定的元素
function del(val, arr)
{
    //检测参数
    if (arr == null && arr.constructor != Array) {
        return [];
    }
   
    var newarr = []; //不存在的保存到新数组中
    for (var i = 0; i < arr.length; i++) {
        if (arr[i] != val)
            newarr.push(arr[i]);
    }
    return newarr;
}
alert(del(2, [1, 2, 3, 4, 5, 2]));2.去除重复的元素

 


/**
 *去除数组中重复的元素
把元素的值存为一个新数组的key,key是不可以重复的,然后变量次数组即可
 */
function unique(data) {
    data = data || [];
    var a = {};
    len = data.length;
    for (var i = 0; i < len; i++) {
        var v = data[i];
        if (typeof(a[v]) == 'undefined') {
            a[v] = 1;
        }
    };
    data.length = 0;
    for (var i in a) {
        data[data.length] = i;
    }
    return data;
}
alert(unique([12,12,12,34])); 3.删除数组指定下标的元素

 


/**
 *删除数组的指定下标元素
 *
 * i 的值是一直在变的,n的值是只有if条件成立的时候才会变(会依次递增)
 */
Array.prototype.remove=function(dx)
  {
    if(isNaN(dx)||dx>this.length){return false;}
    for(var i=0,n=0;i<this.length;i++)
    {
        if(this[i]!=this[dx])
        {
            this[n++]=this[i]
        }
    }
    this.length-=1
  }

var arr = [1,2,3,4,2,5];
alert(arr);
arr.remove(2);

alert(arr);

自学PHP网专注网站建设学习,PHP程序学习,平面设计学习,以及操作系统学习

京ICP备14009008号-1@版权所有www.zixuephp.com

网站声明:本站所有视频,教程都由网友上传,站长收集和分享给大家学习使用,如由牵扯版权问题请联系站长邮箱904561283@qq.com

添加评论