JS数组整理

1. 检测数组的方法:

  1. instanceof【操作符】:

var arr = [];
console.log(arr instanceof Array);//true

    1. instanceof操作符的问题在于,它假定单一的全局执行环境。假如网页中包含多个框架,那就会存在两个以上的全局执行环境,也就意味着存在两个以上的Array构造函数。使用本方法就失灵了

  2. ec5新增了isArray();方法用来确定某个值到底是不是数组,忽略全局执行环境的问题

2. 栈方法(push和pop)。栈是一种LIFO(last in first out)的数据结构,最新添加的最早删除

  1. push(),接受任意数量的参数,逐个添加到数组末尾

  2. pop(),从数组末尾弹出最后一项

3. 队列方法(shift和unshift)。队列的访问规则是FIFO(first in first out)

  1. shift(),取得数组第一项

  2. unshift(),向数组头部添加

4. 数组排序

  1. sort():

    1. 默认情况下sort()按照升序排列数组各项,底层方法是调用每个数组项的toString()方法,然后比较得到的字符串,即使数组中的每一项都是数字,sort()方法比较的也是字符串:

var arr1 = [1,5, 8, 11 , 15];
arr1.sort();
console.log(arr1);    //[1, 11, 15, 5, 8]

    所以这个方法可以接受一个比较函数作为参数,以便指定哪个值位于哪个值的前面:

var arr1 = [1,5, 8, 11 , 15];
arr1.sort(function(a,b){return b-a;});
console.log(arr1);    //[15, 11, 8, 5, 1]//比较函数中两参数相减,返回正值就交换位置,返回负值就不换

  2. reverse():鸡肋

5. 数组操作方法:

  1. concat(),拼接串联数组。具体来说,该方法先创建当前数组的一个副本,然后将接受的参数添加到这个副本的的尾部,最后返回新创建的数组,原数组不变。

var colors = [‘red‘ , ‘blue‘  , ‘black‘];
var newColors = colors.concat(‘yellow‘ , ‘silver‘ , [‘gloden‘  ,‘white‘ , ‘purple‘]);

console.log(colors);            //["red", "blue", "black"]
console.log(newColors);      //["red", "blue", "black", "yellow", "silver", "gloden", "white", "purple"]

  2. slice():切出子数组。slice()方法接受一个或两个参数,即起始位置和结束位置(含头不含尾)。只有一个参数的情况下,返回从起始位置到最后的所有数组元素,不会影响原始数组。

var bar = [‘h‘ , ‘e‘ ,  ‘l‘ , ‘l‘ ,  ‘o‘ , ‘w‘  ,  ‘o‘  , ‘r‘  , ‘l‘  , ‘d‘];
var bar1 = bar.slice(5);
console.log(bar1);    //["w", "o", "r", "l", "d"]
var bar2 = bar.slice(0,5);
console.log(bar2);    //["h", "e", "l", "l", "o"]

  3. splice():接合数组,全能的操作数组方法,改变原数组。最主要的的用途是向数组的中部插入元素,用法有3种:

    1. 删除指定位置的任意项:

var bar = [‘h‘ , ‘e‘ ,  ‘l‘ , ‘l‘ ,  ‘o‘ , ‘w‘  ,  ‘o‘  , ‘r‘  , ‘l‘  , ‘d‘];
var bar1 = bar.splice(5 ,5);    //从第5项开始删除,删5个
console.log(bar1);    //["w", "o", "r", "l", "d"]
console.log(bar);    // [‘h‘ , ‘e‘ ,  ‘l‘ , ‘l‘ ,  ‘o‘]

    2. 插入:传3个以上的参数,第二个参数为0

var bar = [‘h‘ , ‘e‘ ,  ‘l‘ , ‘l‘ ,  ‘o‘ , ‘w‘  ,  ‘o‘  , ‘r‘  , ‘l‘  , ‘d‘];
var bar1 = bar.splice(5 ,  0  , ‘xx‘ , ‘oo‘);    //从第5项开始,删0个,然后插入内容
console.log(bar1);    //[],删除0个,所以为空
console.log(bar);    //["h", "e", "l", "l", "o", "xx", "oo", "w", "o", "r", "l", "d"]

    3. 替换:第二个参数不为0

var bar = [‘h‘ , ‘e‘ ,  ‘l‘ , ‘l‘ ,  ‘o‘ , ‘w‘  ,  ‘o‘  , ‘r‘  , ‘l‘  , ‘d‘];
var bar1 = bar.splice(5 ,  2  , ‘xx‘ , ‘oo‘);    //从第5项开始,删2个,然后插入内容
console.log(bar1);    //[‘w‘,  ‘o‘],删除的2个
console.log(bar);    //["h", "e", "l", "l", "o", "xx", "oo",  "r", "l", "d"]

6. 数组位置方法(两个),都接收两个参数:要查找的元素,和查找起点位置的下标。都返回查找的元素在数组中的位置下标,如果没找到,就返回-1

  1. indexof()

  2. lastIndexof()

7. 数组迭代方法:ES5为数组定义了5个迭代方法,每个方法都接收两个参数:在每个元素上运行的函数、运行该函数的作用域对象[,可选]。函数接收三个参数:(value ,index , array)

  1. every():数组中的每一项运行函数,如果函数对每一项全都返回true,才返回true

  2. some():数组中的每一项运行函数,如果函数有任何一项返回true,就返回true

//every()和some()方法类似
var num = [1,2,5,6,7,5];
num.every(
  function(value, index  , array){
    return value>=5;
    }
);    //false,不是每一个元素都大于等于5

var num = [1,2,5,6,7,5];
num.some(
  function(value, index  , array){
    return value>=5;
    }
);    //true,有一些元素大于等于5

  3. filter():数组中的每一项运行函数,返回的是函数过滤后返回true的元素组成的数组

var num = [1,2,5,6,7,5];
num.filter(
  function(value, index  , array){
    return value>=5;
    }
);    //[5, 6, 7, 5],把大于等于5的值过滤了出来//这个方法对查询符合某些条件的数组元素非常有用

  4. forEach():数组中的每一项运行函数,无返回值

//forEach()只对数组的每个元素运行传入的函数,本质上与使用for循环迭代数组一个样
var num = [1,2,5,6,7,5];
num.forEach(
  function(value, index  , array){
    num[index] = value*5
    }
);
console.log(num);//[5, 10, 25, 30, 35, 25]

  5. map():数组中的每一项运行函数,返回每次函数调用的结果组成的数组

//map()方法返回一个数组,这个数组的每个元素都是原数组中的元素执行函数之后产生的
var num = [1,2,5,6,7,5];
num.map(
  function(value, index  , array){
    return value*5
    }
);       //[5, 10, 25, 30, 35, 25]
//注意与forEach()的区别

8. 数组缩小方法reduce()和reduceRight(),都接收两个参数:在每个元素上运行的函数和运行该函数的作用域对象[,可选]。函数接收4个参数:(前一个值(prev) ,当前值 (cur),下标(index) , 数组对象(array)),第一次迭代发生在数组的第二个元素上,也就是说,第二元素的值为当前值,第一元素的值为前一个值,这个函数返回的任何值都会作为第一个参数自动传给下一项,第三个元素自动把值传给当前值(cur)……

var num = [1,3,5,7,9];
num.reduce(
  function(prev , cur , index , array){
        return prev*cur;
    }
);    //945//reduceRight()方法与此类似,只不过方向相反从最后一个元素开始

至此,除了通用的.length和toString()等,数组的相关属性和方法基本就这些了,活学活用才是王道。

时间: 2025-01-07 21:40:45

JS数组整理的相关文章

JS—数组整理

<script> //定义一个arr数组 var arr = new Array(); //向数组的末尾添加一个a元素 arr.push('a'); //获取所有数组元素 //alert(arr); //a //获取数组中的第一个元素[默认从0开始] //alert(arr[0]); //a //获取数组的长度 //alert(arr.length); //1 </script> <!-------------我是分隔线------------> <script&

js数组学习整理

原文地址:js数组学习整理 常用的js数组操作方法及原理 1.声明数组的方式 var colors = new Array();//空的数组 var colors = new Array(3); //长度为3 var colors = new Array('red','blue');//初始化 其中,在声明数组的时候,去掉new操作符,也可以. 还有一种初始化数组的方式,使用数组字面量表示法 . 数组字面量由一对包含数组项的方括号表示,多个数组项之间用逗号隔开. var colors = [ '

php数组以及js数组方法整理

在js中数组非常经常用到,熟练掌握数组的方法能够大大的提高对自己的变成效率,最近解除php,学得非常皮毛,遇到一个问题,自己一直陷入foreach循环如何解决的死循环中.结果一直没能很好的解决,回来讨教了一下同学,更加觉得数组的一些方法很好用,所以有必要整理一下数组的一些方法,希望自己能牢记它们. 一,js数组的操作方法: 参照w3c内容:http://www.jb51.net/w3school/js/jsref_obj_array.htm 以及<javascript权威指南>和<jQu

常用js方法整理common.js

项目中常用js方法整理成了common.js var h = {}; h.get = function (url, data, ok, error) { $.ajax({ url: url, data: data, dataType: 'json', success: ok, error: error }); } h.post = function (url, data, ok, error) { $.ajax({ url: url, data: data, type: 'post', data

JS数组定义【收藏】

最近在学习JS,刚好学到数组,发现章节还蛮多了而且发现了数组的以前好多不知道的东西,顺便整理下: 数组一共有有四种定义的方式 使用构造函数: var a = new Array(); var b = new Array(8); var c = new Array("first", "second", "third"); 或者数组直接量: var d = ["first", "second", "t

JS知识整理之 Call&amp;Apply方法

JavaScript中的函数也是对象,和其他JS对象一样也可以包含方法,其中Call和Apply就是其中比较重要的方法,可以用来间接的调用函数.这两个方法允许显式制定调用所需的this值,也就是说所有函数可以作为任何对象的方法来使用,哪怕这个函数不是那个对象的方法. Call方法: 语法:call([thisObj[,arg1[, arg2[,   [,.argN]]]]]) Apply方法: 语法:apply([thisObj[,argArray]]) Call和Apply方法作用相同,但从以

几个常见js问题整理

1.关于"+"和"-"中出现number类型时的转换 var a = '' + 3; //尝试将3转化为字符串 var b = 4; console.log(typeof a); console.log(a+b); console.log(a-b); //尝试将字符串转化为number var foo = "11"+2+"1"; //体会加一个字符串'1' 和 减去一个字符串'1'的不同 console.log(foo); c

常用js代码整理、收集

个人整理了一下个人常用到的一些js代码,以方便学习以及日后使用,或许有一些是个人之前从网上摘下来的,但是不记得是具体从哪里来的了,如果你看到有一段代码跟你的文章很相似甚至一样,请不要气愤,请告诉我,我必定加上版权链接. 清除输入框默然提示文字 1 <input type="text" name="word" value='请输入关键字' style="color:#ccc;" /> 2 <script> 3 /* 4 *清

关于js数组的一道小考题

网上看到的一道关于js数组的小考题,借此学习练习一下,也是拿来作为博客开篇之作吧! 题目如下: 给定一个随机数组,数组可能包含数组(也就是说数组元素可能为数组).要求用js实现一个函数,返回该数组中所有元素,重复的要求去掉.例如:数组[2,3,[4,6,[3,8]],12,10],返回结果为:[2,3,4,6,8,12,10]. 我的答案如下:(额外增加了排序) 1 var arr = [2,3,[4,6,[3,8,[15,16,[17,18,[1,2,3,[19,20]]]]],[13,14]