六、数组
1.数组的介绍
ECMAScript数组是有序列表,是存放多个值的集合,属于引用数据类型。它的特性有:
每一项都可以保存任何类型的数据;
数组的大小是可以动态调整的;
可以访问或改变数组的length属性(数组也是一种对象,length是表示数组长度的属性,length表示数组中数组项的个数):通过设置length的值在数组末尾移除数组项,或者向数组中添加新的数组项。
2.数组的创建
使用Array构造函数创建数组,如:
var arr = new Array();
var arr = new Array(20); //预先指定数组的长度
var arr = new Array("terry","larry","boss"); //传入参数作为数组项
Array继承Object,通过Array构造函数构建出来的对象可以调用Array原型中的方法,还可以调用Object原型中的方法(arr ->Array.prototype->Object.prototype)。
使用数组字面量创建数组,由一对包含数组项的方括号表示,多个数组项之间用逗号分隔,如:
var arr = ["terry","larry","boss"]; //数组的初始化
var arr = [] //空数组
3.数组的检测
对于一个网页或者一个全局作用域而言,使用instanceof操作符即可判断某个值是否是数组。如果网页中包含多个框架,这样就存在多个不同的全局执行环境,从而存在多个不同版本的Array构造函数,这样就会判断不准确。为解决这个问题,ECMAScript5新增了Array.isArray()方法进行判断,如:
var arr = [];
typeOf(arr); //object
arr instanceof Array //true,在同一个全局作用域下可以这么判断
Array.isArray(arr); //true,判断arr是否是数组类型
4.数组的访问
通过“数组变量名[索引]”访问数组,如果索引小于数组的长度,返回对应项的值;如果索引大于数组的长度,数组自动增加到该索引值加1的长度(因为数组索引从0开始)(数组中最多可以包含4 294 967 295个数组项),且值为undefined,如:
var arr = ["terry","larry","boss"];
arr[0] ; //访问数组中第一个元素,返回值为terry
arr[3] ="jacky"; //添加元素,数组程度变为4
(["terry","larry","boss","jacky"])
arr[9] ; //访问数组中第十个元素,返回值为undefined
可以使用循环语句遍历数组,如:
for(var i = 0; i<arr.length; i++){
var val = arr[i]
console.log(val);
}
for(var key in arr){
var val = arr[key]
}
5.通过栈和队列操作操作数组项
栈(先进后出)操作:
push()可接受任意类型的参数,将它们逐个添加到数组的末尾,并返回数组的长度,参数为要入栈的元素,返回值为数组长度
pop()从数组的末尾移除最后一项,减少数组的length值,返回移除的项,无参数,返回值为出栈的元素
队列(先进先出)操作:
shift()移除数组中的第一个项并且返回该项,同时将数组的长度减一,无参数,返回值为出队的元素
unshift()在数组的前端添加任意个项,并返回新数组的长度,参数为要插队的元素,返回值为插队后队列的长度
6.数组的截取
concat():数组拼接。先创建当前数组的一个副本,然后将接收到的参数添加到这个副本的末尾,返回副本,不改变原数组。
slice():数组切割。接收的参数为(start,end(可选)),只接收start时,返回从start指定位置开始到当前数组末尾的所有项;当接收start和end时,返回start到end之间的项,但不包含end位置的项,不改变原数组。
splice():数组更改。具体使用如下:
删除:指定两个参数(删除的起始位置,要删除的项数)
插入:指定三个参数(起始位置,0,要插入的任意数量的项)
替换:指定三个参数(起始位置,要替换的项,要插入的任意数量的项)
7.数组的排序
reverse():可以反转数组项的顺序
sort():默认排序会调用每个数组项的toString()方法,然后按照字符序列排序;
自定义排序可以接受一个比较函数作为参数(sort(comparator)),比较函数有两个参数(compare(a,b)),降序排序情况是,如果第一个参数位于第二个参数之后(小于第二个参数),返回正数(调换),如果第一个参数位于第二个参数之前(大于第二个参数),返回负数(保持),如下:
var arr = [3,12,29,8,32,4];
arr.sort(function(a,b){
if(a<b){
return 1;
} else {
return -1;
}
});
console.log(arr); //[ 32, 29, 12, 8, 4, 3 ]
8.数组的迭代
every():对数组中的每一项运行给定的函数,如果该函数对每一项都返回true,则该函数的执行结果返回结果为true,如:
var arr = [11,5,23,7,4,1,9,1];
var result = arr.every(function(item,index,arr){
return item >2;
});
console.log(result); //false,数组中存在小于2的项
some():对数组中的每一项运行给定的函数,如果该函数有任意一项返回true,则该函数执行结果返回true,如:
var arr = [11,5,23,7,4,1,9,1];
var result = arr.some(function(item,index,arr){
return item >2;
});
console.log(result); //true,数组中存在大于2的项
filter():对数组中的每一项运行给定的函数,会返回满足该函数的项组成的数组,如:
var arr = [11,5,23,7,4,1,9,1];
var result = arr.filter(function(item,index,arr){
return item >2;
});
console.log(result); //[11, 5, 23, 7, 4, 9],数组中的这些项大于2
map():对数组中的每一项运行给定的函数,返回每次调用该函数的结果组成的数组,如:
var arr = [11,5,23,7,4,1,9,1];
var result = arr.map(function(item,index,arr){
return item * 2;
});
console.log(result); //[22, 10, 46, 14, 8, 2, 18, 2],数组中所有项*2后的结果组成的数组
forEach():对数组中的每一项运行给定的函数,没有返回值,常用来遍历元素,如:
var result = arr.forEach(function(item,index,arr){
console.log(item);
});
9.数组的序列化
toString():在默认情况下会以逗号分隔字符串的形式返回数组项,如:
var arr = ["terry","larry","boss"];
arr.toString(); //terry,larry,boss
join():使用指定的字符串用来分隔数组字符串,如:
var arr = ["terry","larry","boss"];
arr.join("||"); //terry||larry||boss
10.部分数组方法重构
(1)模拟push(),重构为myPush()代码。
Array.prototype.myPush = function(){
var len = this.length; //2
for(var key in arguments){
var item = arguments[key];
this[len+(+key)] = item; //将字符串形式的key转成number
}
return this.length;
}
var arr = [3,12,29,8,32,4];
var result = arr.myPush("terry","larry","tom")
console.log(result,arr); //9 [3,12,29,8,32,4,"terry","larry","tom"]
var arr2 = [3,12,29,8,32,4];
var result2 = arr2.push("terry","larry","tom");
console.log(result2,arr2); //9 [3,12,29,8,32,4,"terry","larry","tom"]
(2)模拟pop(),重构为myPop()代码。
Array.prototype.myPop = function(){
var del = this[this.length - 1];
this.length -= 1;
return del;
}
var arr = [3,12,29,8,32,4];
var result = arr.myPop();
console.log(result,arr); //4 [3,12,29,8,32]
var arr2 = [3,12,29,8,32,4];
var result2 = arr2.pop();
console.log(result2,arr2); //4 [3,12,29,8,32]
(3)模拟shift(),重构为myShift()代码。
Array.prototype.myShift = function(){
var del = this[0];
this.splice(0,1);
return del;
}
var arr = [3,12,29,8,32,4];
var result = arr.myShift();
console.log(result,arr); //3 [12,29,8,32,4]
var arr2 = [3,12,29,8,32,4];
var result2 = arr2.shift();
console.log(result2,arr2); //3 [12,29,8,32,4]
(4)模拟unshift(),重构为myUnshift()代码。
Array.prototype.myUnshift = function(){
for(var key in arguments){
this.splice(key,0,arguments[key]);
}
return this.length;
}
var arr = [3,12,29,8,32,4];
var result = arr.myUnshift("terry","larry","tom")
console.log(result,arr); //9 ["terry","larry","tom",3,12,29,8,32,4]
var arr2 = [3,12,29,8,32,4];
var result2 = arr2.unshift("terry","larry","tom");
console.log(result2,arr2); //9 ["terry","larry","tom",3,12,29,8,32,4]
原文地址:https://www.cnblogs.com/wodeqiyuan/p/11408578.html