全面总结Javascript对数组对象的各种操作

数组

数组定义：简而言之就是一组有序的数据集合，其索引为从0开始且自然增长的整数，其元素值可以是任何js数据！并且包含一个名为length的属性，该属性表示数组元素的个数！

一、定义数组，有三种定义方式：

方式一：

var arr=new Array();
arr[0]=“11”;
arr[1]=“22”;
arr[2]=“33”;

方式二：

var arr=new Array(“11”,“22”,“33”);

方式三：

var arr=[“11”,“22”,“33”];

二、数组的length属性，可以获取数组的长度，也可以截取，清空数组，如果设置的值比其当前值小，数组将被截断，其尾部的元素将丢失。

如果设置的值比它的当前值大，数组的长度将增大，新的元素被添加到数组的尾部，它们的值为 undefined：

var arr=[“11″,”22″,”33″];
arr.length //3，返回数组的长度
arr.length = 2 //['11','22']，截取数组前2个
arr.length = 5 //['11','22',undefined,undefined,undefined]，自动添加undefined
arr.length = 0 //[]，清空数组

三、遍历数组：

var arr=[“11”,“22”,“33”];
//for循环
for(var i=0;i<arr.length;i++){
 console.log(i)
}
//for in循环
for( i in arr ){
 console.log(arr[i])
}
//forEach循环
arr.forEach(function(i){
 console.log(i)
})

四、数组的添加和删除：

push() 向数组末尾增加一个或多个元素，其返回值为增加元素后数组的长度。

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

unshift() 向数组开头增加一个或多个元素，其返回值为增加元素后数组的长度。

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

pop() 从数组的末尾开始删除，返回值为被删除元素的值。

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

shift() 从数组的开头开始删除，返回值为被删除元素的值。

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

五、join() 将数组通过指定的分隔符进行分隔，返回值为string类型，不改变原数组：

var arr=[1,2,3,4];
arr.join(‘-‘) //”1-2-3-4″
arr.join(”) //”1234″
arr.join(‘ ‘) //”1 2 3 4″

六、sort() 数组排序：

var arr=[2,8,3,4,12,56];
//从小到大排序
arr.sort(function(a,b){
 return a-b;
});
//从大到小排序
arr.sort(function(a,b){
 return b-a;
});
//随机排序
arr.sort(function(a,b){
 return Math.random() – 0.5
})

七、reverse() 将数组逆序：

var arr=[2,8,3,4,12,56];
arr.reverse() //[56, 12, 4, 3, 8, 2]

八、获取数组中最大和最小的数字：

var arr = [5, 458 , 120 , -215 , 228 , 400];
var max = Math.max.apply(Math, arr);
var min = Math.min.apply(Math, arr);

九、slice() 可从已有的数组中返回选定的元素，不改变原数组

一个参数，从start下标处开始直到结尾处。

有两个参数，从 start下标到end下标（不包括该元素）处的数组元素：

var arr=[2,8,3,4,12,56];
arr.slice(1) //[8, 3, 4, 12, 56]
arr.slice(1,5) //[8, 3, 4, 12]

十、splice()

一个参数，删除从start下标处开始直到结尾处。返回删除的数，这个直接修改原数组。

有两个参数，删除从start下标到end下标处的数组元素，返回删除的数，这个直接修改原数组。

有三个参数，从start下标到end下标的元素替换成第三个参数，如果前两个数相同，则是替换，这个直接修改原数组：

var arr=[2,8,3,4,12,56];
//从下标2的位置开始截取
console.log(arr.splice(2)) // [3, 4, 12, 56]
console.log(arr)  // [2, 8] 

var arr=[2,8,3,4,12,56];
//删除下标1到5的位置
console.log(arr.splice(1,5)) //[8, 3, 4, 12, 56]
console.log(arr)  // [2] 

var arr=[2,8,3,4,12,56];
//替换下标1的位置
console.log(arr.splice(1,1,'qqq')) //[8]
console.log(arr) //[2, “qqq”, 3, 4, 12, 56] 

var arr=[2,8,3,4,12,56];
//把下标1到3的位置删除，并插入qqq
console.log(arr.splice(1,3,'qqq')) //[8, 3, 4]
console.log(arr) // [2, “qqq”, 12, 56]

十一、concat() 可以将两个数组合并成一个新数组返回：

var arr1=[1,2,3,4,5];
var arr2=[6,7];
var arr3=arr1.concat(arr2);
alert(arr1);// [1,2,3,4,5]
alert(arr2);// [6,7]
alert(arr3);// [1,2,3,4,5,6,7]

十二、数组去重：

方法一：

function removeRepeat(arr){
 return arr.filter(function(elem, pos) {
  return arr.indexOf(elem) == pos;
 });
}

方法二：

function removeRepeat(a){
 var arr=[];
 for(var i=0;i<a.length;i++){
  if(arr.indexOf(a[i]) === -1){
   arr.push(a[i]);
  }
 }
 return arr;
}

方法三：

function removeRepeat(a){
 var arr = [];
 a.forEach(function(i){
   if(arr.indexOf(i) === -1){
   arr.push(i);
  }
 });
 return arr
}

方法四：

function removeRepeat(arrs){
 var newArr = [];
 var hash = {};
 for(var i=0;i<arrs.length;i++){
  var key = typeof(arrs[i])+arrs[i];
  if(hash[key] !==1){
   newArr.push(arrs[i]);
   hash[key] =1;
  };
 };
 return newArr;
}

十二、prototype 属性，直接对数组的原型进行更改或者添加功能：

//比如我们给数组添加一个求和的方法
Array.prototype.sum= function(){
 var n = 0;
 this.forEach(function(i){
  n+=i;
 });
 return n;
} 

var arr = [1,2,3,4]
alert(arr.sum()) //10

总结

以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作能带来一定的帮助，如果有疑问大家可以留言交流。

赞 (0)

相关推荐

  • JS针对Array的各种操作汇总

    Array应该是我们在平时写js代码中,使用频率最高的,在平时的项目中,很多数据都是可以通过Array来存储.操作等任务.除了Object之外,Array类型应该是js中最常用的类型了. 今天总结一下Array的一些简单和基本的操作,也来巩固下自己的基础知识. 一.如何创建Array(下面直接说数组) 创建数组主要有两种方法,第一种是使用数组构造函数,第二种是使用数组字面量表示法. 1.使用数组构造函数 如:var arr = new Array(); 如果预先知道数组的长度,那么也可以直接给构

  • JavaScript中数组的各种操作的总结(必看篇)

    JavaScript中数组的各种操作的总结(必看篇)

    js数组的新建,头插入,尾插入,头删除,尾删除,中间删除,删除多个,多个数组合并,数组倒序,数组截取等等,都有对应的例子. 声明一个数组 原来是如下声明: var s = new Array(); 但是 现在编辑器推荐使用如下声明:简洁 var s = []; concat 方法 返回一个新数组,这个新数组是由两个或更多数组组合而成的.不修改原数组. join 方法 返回字符串值,其中包含了连接到一起的数组的所有元素,元素由指定的分隔符分隔开来.不修改原数组. pop 方法 移除数组中的最后一个

  • js数组操作方法总结(必看篇)

    判断数值数组中各个数字出现的奇偶次数 <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>数组操作</title> </head> <body> <script type="text/javascript"> var arr=[3,1,2,2,1,3,1

  • Javascript数组操作函数总结

    其实平时用的比较多的应该是push和pop,不过还是都记下来,以便后面使用. 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,-

  • Jquery 数组操作大全个人总结

    jQuery的数组处理,便捷,功能齐全. 最近的项目中用到的比较多,深感实用,一步到位的封装了很多原生js数组不能企及的功能. 最近时间紧迫,今天抽了些时间回过头来看 jQuery中文文档 中对数组的介绍,顺便对jQuery数组做个总结.温故,知新. 强烈建议你打开DEMO演示后再看下面的详解: 点此查看DEMO 1. $.each(array, [callback]) 遍历[常用] 解释: 不同于例遍 jQuery 对象的 $().each() 方法,此方法可用于例遍任何对象(不仅仅是数组哦~

  • 向JavaScript的数组中添加元素的方法小结

    在数组的开头添加新元素 - unshift() 源代码: <!DOCTYPE html> <html> <body> <p id="demo">Click the button to add elements to the array.</p> <button onclick="myFunction()">Try it</button> <script> function

  • js常用数组操作方法简明总结

    //javascript 中的数组分割 var colors = ["red","green","blue"]; //alert(colors.toString()); alert(colors.join("|")); //返回结果是red|green|blue var colors = ["red","green","blue",null]; alert(color

  • js数组操作学习总结

    shift:删除原数组第一项,并返回删除元素的值:如果数组为空则返回undefinedvar 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

  • 全面总结Javascript对数组对象的各种操作

    数组 数组定义:简而言之就是一组有序的数据集合,其索引为从0开始且自然增长的整数,其元素值可以是任何js数据!并且包含一个名为length的属性,该属性表示数组元素的个数! 一.定义数组,有三种定义方式: 方式一: var arr=new Array(); arr[0]="11"; arr[1]="22"; arr[2]="33"; 方式二: var arr=new Array("11","22",&quo

  • JavaScript类数组对象转换为数组对象的方法实例分析

    本文实例分析了JavaScript类数组对象转换为数组对象的方法.分享给大家供大家参考,具体如下: 1.类数组对象: 拥有length属性,可以通过下标访问: 不具有数组所具有的方法. 2.为什么要将类数组对象转换为数组对象? 数组对象Array有很多方法:shift.unshift.splice.slice.concat.reverse.sort,ES6又新增了一些方法:forEach.isArray.indexOf.lastIndexOf.every.some.map.filter.redu

  • javascript Array数组对象的扩展函数代码

    今天重点讲下 如何给Array对象扩展 1.直接在Array.prototype 上扩展 2.用自己方法对数组对象进行扩展 直接在Array.prototype上扩展,不能直接对dom对象使用(如:document.getElementsByTagName('div')得到的nodeList); 对有洁癖的同学而言 也破了原始生态环境的 : ) 先来看下 yui操作数组的一些方法,这里我对源码简单剥离并改动了下 复制代码 代码如下: (function(){ var YArray; YArray

  • JavaScript中数组对象的那些自带方法介绍

    /** * 本文纯粹是梳理一下目前W3C标准中Array对象的自带Method. * 全文没啥营养,不过最后性能测试的部分,倒是抛出了一些疑问. */ 赋值方法 (Mutator methods) 这些方法直接修改数组自身 pop 和 push Array.pop(); // 删除数组最后一个元素,返回被删除的元素 Array.push(element1, ..., elementN); // 在数组尾部插入1-N个元素,返回操作后数组的length 通过这 pop 和 push ,就能把数组模

  • JavaScript将数组转换成CSV格式的方法

    本文实例讲述了JavaScript将数组转换成CSV格式的方法.分享给大家供大家参考.具体分析如下: JavaScript中数组对象的valueOf方法可以将数组的值输出为逗号分割的字符串,下面的代码演示了如何将数组抓换成逗号和竖线分割的字符串 var fruits = ['apple', 'peaches', 'oranges', 'mangoes']; var str = fruits.valueOf(); //输出结果: apple,peaches,oranges,mangoes 如果希望

  • javascript中json对象json数组json字符串互转及取值方法

    javascript中json对象json数组json字符串互转及取值方法

    今天用到了json数组和json对象和json类型字符串之间互转及取值,记录一下: 1.json类型的字符串转换为json对象及取值 var jsonString = '{"bar":"property","baz":3}'; var jsObject = JSON.parse(jsonString); //转换为json对象 alert(jsObject.bar); //取json中的值  2.json对象转为json类型的字符串 var js

  • JavaScript 中有关数组对象的方法(详解)

    JS 处理数组多种方法 js 中的数据类型分为两大类:原始类型和对象类型. 原始类型包括:数值.字符串.布尔值.null.undefined 对象类型包括:对象即是属性的集合,当然这里又两个特殊的对象----函数(js中的一等对象).数组(键值的有序集合). 数组元素的添加 arrayObj.push([item1 [item2 [. . . [itemN ]]]]); 将一个或多个新元素添加到数组结尾,并返回数组新长度 arrayObj.unshift([item1 [item2 [. . .

  • javascript数组对象常用api函数小结(连接,插入,删除,反转,排序等)

    本文实例讲述了javascript数组对象常用api函数.分享给大家供大家参考,具体如下: 1. concat() 连接两个或多个数组,并返回结果 var a = [1,2,3]; var b = a.concat(6,7); console.log(a); //[1,2,3] console.log(b); //[1,2,3,6,7] 2. join(str) 把数组的所有元素用str分隔,默认逗号分隔 var a = [1,2,3] var b = a.join('|'); console.

  • 浅析C/C++,Java,PHP,JavaScript,Json数组、对象赋值时最后一个元素后面是否可以带逗号

    1 C,C++,Java,PHP都能容忍末尾的逗号 C,C++,Java中对数组赋值时,最后一个元素末尾的逗号可有可无.下面两行代码对这些语言来说是等效的. int a[] = {1,2,3}; /* 正确 */ int a[] = {1,2,3,}; /* 正确 */ PHP这一点也继承了C的特点,下面的两行代码等效. $a = array(1,2,3); /* 正确 */ $a = array(1,2,3,); /* 正确 */ 2 JavaScript视末尾逗号为语法错误! 然而到了Jav

  • JavaScript数组对象实现增加一个返回随机元素的方法

    本文实例讲述了JavaScript数组对象实现增加一个返回随机元素的方法.分享给大家供大家参考.具体如下: 核心特性: 概率随机.顺序随机.随机冒泡 本方法 来自个人手写 JavaScript 的实践,只涉及 JavaScript 1.5(ECMAscript 3 国际标准)语言本身,在所有 JS 引擎实现中通用~ 为Array对象新增random方法: (function () { function Random_SN(iArray) { return Math.floor(Math.rand

随机推荐