JavaScript数组Array的基本操作
Array
定义与基本使用
JS中的数组每一项可以是字符串、数值、对象,大小也是可以动态变化
定义相对基础简单,用实例记忆
构造函数 Array()
var a = new Array();
var b = new Array(10); //定义含有10项数据的数组
var c = new Array('one','two','three');//定义了含三个字符串的数组
//可与省略 new 操作符
var great = {
name: 'Oh'
}
var d = Array('yes',great,17);
console.log(d)
// (3) ["yes", {…}, 17]
// 0: "yes"
// 1: {name: "Oh"}\
// 2: 17
字面量方式
var a = [];
var b = [1,2,3]; //定义含有3项数据的数组
var c = ['one','two','three'];//定义了含三个字符串的数组
var d = [1,2,]//不建议这样,有的浏览器会创建为 3 个数组项,有的 2 个
简单使用
以数组索引的方式读取和设置数组
var a = [1,2,3];
var b = new Array('one','two','three');
b[3] = 'four';
console.log(a[1])//2
console.log(b[3])//3
console.log(a.length,'-',b.length);//3-4
通过设置length值可以添加新项,添加的新项会被赋值为undefined
若是减小,则索引大于改变后 length值的数组项都不存在,返回 undefined
var a = [1,2,3];
var b = new Array('one','two','three');
a.length = 2;
b.length = 4;
console.log(a[2])//undefined
console.log(b[3])//undefined
b[50] = 'what';
console.log(b.length);//100, 其中 3 到 49都不存在返回 undefined
常用方法
检测数组
由于在多个全局环境中存在构造函数不一样的问题,而instanceof假定为一个全局环境
使用**Array.isArray()**判断一个对象是否是数组
转换方法
toString() , toLocaleString(), valueOf()
- 数组调用 valueOf() 返回的是数组本身
- 调用 toString() 返回所有数组项组成的字符串,以逗号分隔,实际上是调用了每一项的 toString() 方法后组成最后的结果
- 调用 toLocaleString() 与 toString() 一样,也是调用了每一项的 toLocaleString() 方法构成
可以用join方法指定返回的字串以什么字符串样式分隔
- 若不传入任何值作为分隔符 或者 传入 undefined 则默认用逗号分隔
var a = [1,2,3];
var b = new Array('I','am','Great');
console.log(b.valueOf()); // ["I", "am", "Great"]
console.log(b.toString());// I,am,Great
console.log(b.toLocaleString());// I,am,Great
console.log(b.join(' '));// I am Great
console.log(b.join('%'));// I%am%Great
console.log(b.join(undefined));// I,am,Great
栈方法
模拟栈的操作方式,先进后出,对于数组来说,第一个元素就是栈底,最后一个元素就是栈顶
- **push()**方法向数组末尾添加一个新项并返回增加后数组的 length 值
- **pop()**方法删除数组末尾元素,减少数组 length 值,并返回该值
var a = new Array();
console.log(a.push(1,'great'));//2
console.log(a.length);//2
a[2] = {
name: 'oh'
};
var item = a.pop();
console.log(item);//{name: "oh"}
console.log(a.length);//2
队列方法
先进先出,JS提供了两个方法
- **shift()**移出数组的第一项,长度减一并返回该值
- **unshift()**向数组前端添加任意个项并返回改变后数组的长度
var a = new Array(1,2,3);
a.push(4);//进 4
a.shift();//出 1
a.unshift('r','s');// a: s,r,2,3,4
重排序方法
小插曲,比较字符串时,比较两字符串的第一个字符,相等继续比较两字符串的第二个字符,大于小于直接返回,不会管后面的字符
console.log('3'<'6'); //true
console.log('3'<'10'); //false
console.log('3'<'21'); //false
console.log('3'<'34'); //true
console.log('54'<'55'); //true
console.log('54'<'531'); //false
reverse() 反转数组顺序
sort() 默认升序排序,将值当做字符串来比较,即使数值也是这样,但是数值的排序可能会出现上述那种情况所以 sort() 提供了自定义的比较函数
- 比较函数中接受两个参数,这两个参数一般是要比较数组中的两个值,若是第一个参数应位于第二个参数之前则返回负数,否则返回正数、若是相等返回0
var a = [0,23,10,5,1];
function compare(x1,x2) {
return x1-x2;//降序排序
}
a.sort(compare);
console.log(a);//[0, 1, 5, 10, 23]
操作方法
**concat()**方法,不传入参数则返回数组副本,否则将参数填至副本末尾
var a = [0,1,2];
var b = a.concat();
var c = a.concat(3,4);
console.log(b);//[0, 1, 2]
console.log(c);//[0, 1, 2, 3, 4]
**slice()**方法,可传入两个参数,第一个参数表示起始位置,第二个参数表示结束位置,不包括第二个参数索引的项。若之传入一个参数,则返回从此参数开始至末尾的所有的项,返回剪切下来的数组
var a = [0,1,2,4,5];
var b = a.slice(1,3);
var c = a.slice(2);
console.log(b);//[1, 2]
console.log(c);//[2, 4, 5]
**splice()**方法
- 两个参数,参数1指定起始位置,参数2指定删除项数,返回原数组中删除的项
var a = [0,1,2,4,5];
var b = a.splice(1,3);
console.log(a);//[0, 5]
console.log(b);//[1, 2, 4]
- 三个参数,参数1指定开始位置,参数3指定需要增加的数组项,参数2有 0 和 1 两种情况
- 0表示从当前开始位置向后插入参数3传入的数组项
- 1表示先删除参数1指定位置的数组项,再从当前开始位置向后插入参数3传入的数组项
var a = [0,1,2,4,5];
var b = [0,1,2,4,5];
var c = a.splice(1,0,10,13);
var d = b.splice(1,1,10,13);
console.log(a);//[0, 10, 13, 1, 2, 4, 5]
console.log(b);//[0, 10, 13, 2, 4, 5]
console.log(c);//[]
console.log(d);//[1]
位置方法
查找指定项,并返回相应的数组下标,接受两个参数,参数1为要查找的项,参数2代表从哪个下标开始
indexOf() 从头开始
lastIndexOf() 从尾部往前找
var a = [1,2,3,4,5,3]
console.log(a.indexOf(3,3));//5
console.log(a.lastIndexOf(3,3));//2
迭代方法
传入一个给定的函数作为参数,根据该函数的条件返回相应的值
every() 与 some() 方法
- every() 每一项在给定函数的条件下都返回 true,那么该方法就返回 true,否则为 false
- some() 只要有任意一项在给定函数的条件下返回 true,那么该方法就返回 true,除非都返回 false才返回 false
var a = [1,2,3,4,5,3]
var e = a.every(function(item,index,array) {
return (item > 3);
})
console.log(e);//false
var s = a.some(function(item,index,array) {
return (item > 3);
})
console.log(e);//true
filter() 方法
返回符合给定函数条件的数组项
var a = [1,2,3,4,5,3]
var f = a.filter(function(item,index,array) {
return (item > 2);
})
console.log(f);//[3,4,5,3]
map() 方法 与 forEach() 方法
map() 用来返回原数组每一项在给定函数条件下的新值组成的数组
var a = [1,2,3,4,5,3]
var m = a.map(function(item,index,array) {
return (item + 10);
})
console.log(m);//[11,12,13,14,15,13]
forEach() 没有返回值,跟 for 循环类似,可以对每一项值进行操作
var a = [1,2,3,4,5,3]
a.forEach(function(item,index,array) {
if(item > 2) console.log(item);
})
//3
//4
//5
//3
归并方法
reduce() 方法
逐个遍历从头开始,参数中 prev 与 cur 代表上一个值与当前值,给定函数返回的值都会作为第一个参数作为下一次迭代的参数
reduceRight() 方法与上述一样,只不过从尾部开始,倒过来而已。
var a = [1,2,3,4,5]
var sum1 = a.reduce(function(prev,cur,index,array) {
if(prev > 3) return prev - cur;
else return prev + cur;
})
console.log(sum1);
//7
var sum2 = a.reduceRight(function(prev,cur,index,array) {
if(prev < 3) return prev - cur;
else return prev + cur;
})
console.log(sum2);
//15
本文为原创文章,若文章内容出现抄袭雷同,请联系文章发布人或者网站管理员,我们将认真核实并及时删除。 除非另有说明,否则此博客中的所有文章均根据CC BY-NC-SA 4.0许可。如需转载请标明出处,谢谢配合!