转载

js数组学习整理

常用的js数组操作方法及原理

1、声明数组的方式

var colors = new Array();//空的数组  var colors = new Array(3); //长度为3  var colors = new Array('red','blue');//初始化

其中,在声明数组的时候,去掉new操作符,也可以。

还有一种初始化数组的方式,使用 数组字面量表示法 。

数组字面量由一对包含数组项的方括号表示,多个数组项之间用逗号隔开。

var colors = [ 'red', 'blue'];  var colors = [];

2、数组的length , 不是只读的,可以用它来增删数组。

var color = ['red', 'blue', 'green'];  color.length = 2;  alert(color[2]); // undefined,说明这个值已经不存在了

增加数组项

var colors = ['red','blue'];  colors[colors.length] = 'green';

3、检测数组

如果只有一个全局的环境,可以用

if( value instanceof Array ){  }

但如果一个网页中有框架,就会有多个全局环境,那么Array构造函数就会有多个,此时用

Array.isArray(value);//IE9+

4、转换方法(将数组转化为字符串)

所有对象都有toLocalString()、toString()、这2个方法返回以逗号分隔的字符串,它们的原理分别是循环数组,将数组的每一项分别使用toLocalString()、toString()方法后,拼接成字符串。

jion()方法是可以指定分隔的符号来返回字符串。如果在jion()中不指定分隔符,默认为逗号。

如果数组中的一项值是null,或者undefined,使用jion(),toLocalString()、toString()方法返回的是以空字符串表示该项。

valueOf()返回的还是数组

5、向数组中添加或取出值(栈方法,队列方法)

var colors = [];  colors.push('red'); // 返回数组长度 1  colors.pop(); //返回数组最后一项red

这2个方法都是像栈一样的形式,直接操作最后的元素,也就是后来的元素。

还有2种方法像队列一样的形式操作数组,shift,unshift

var colors = ['red', 'blue'];  colors.shift(); // 返回的是数组第一项red  colors.unshift('green'); // 返回数组长度3

取值操作pop(),shift(),会返回一个值

push(),unshift(),会返回添加以后的数组长度。

6、排序方法

var color = [1,2,3,4];  color.reverse(); // 反转数组 4,3,2,1  color.sort(); //默认是升序排列 1,2,3,4  //但如果colors = [1, 2, 3, 15];使用sort时会返回 1, 15, 2 ,3

sort();方法会对数组的每一项进行toString()。所以最后得到的数组每一项字符串。所以会出现那样的结果。

但sort()接收一个比较方法的函数作为参数,那我们可以自定义一个compare函数

//自定义升序  function compare(v1, v2){  if(v1 < v2)  return -1;  else if(v1 > v2)  return 1;  else  return 0;  }  var values = [0, 1, 3, 15]  values.sort(compare); //返回1,2,3,15

7、操作方法(concat,slice,splice)

这里concat和slice方法都不会直接操作原数组,而是返回一个新的数组,原数组不会改变。

var colors = ['red', 'blue'];  var a = ['green']; alert(colors.concat(a));//['red', 'blue', 'green'] alert(colors); //['red', 'blue']

slice很像python切割字符串。

var colors = ['red', 'blue', 'green'];  colors.slice(1);//返回[blue,green]  colors.slice(1,3);//返回['blue']

slice()如果传入一个负值,则用数组长度加上这个值,对应的就是等价的值

//如果数组长度为5  slice(-2, -1); 与 slice(3, 4);相等

splice(‘起始位置’, ‘删除数量'[, ‘代替值’]);它是直接操作原数组,以数组形式返回被操作的元素

var colors = ['red', 'green', 'blue'];  colors.splice(1, 1); // 返回[‘green’] ,而原数组为[red, blue]  colors.splice(1, 0, 'yellow'); //返回一个空数组 ,而原数组为[red,yellow,green,blue]

8、位置方法(indexOf, lastIndexOf)

indexOf(‘要查找的项'[, ‘查找起点的索引’])返回数组值的索引,从第一个值开始查找、 lastIndexOf则相反。

var num = [1,2,3,4,5,6];  num.indexOf(3); //返回2  num.indexOf(3, 3); //返回-1,表示该值不存在

【全文完】

正文到此结束
Loading...