本文主要介绍JS对数组(列表)的基本操做。习惯了用数据库的操做顺序来讲明:增、删、改、查;合并,裁剪,排序,格式化。数据库
增长数组元素有三种方法:unshift() push() splice()数组
一、arrayObj.
unshift
([item1 [item2 [. . . [itemN ]]]]);
//
将一个或多个新元素添加到数组开始位置(即头部),数组中的原元素自动后移;并返回数组新长度。
函数
二、arrayObj.
push
([item1 [item2 [. . . [itemN ]]]]);
//
将一个或多个新元素添加到数组结尾;并返回数组新长度。
编码
3
、
arrayObj.
splice
(insertPos,0,[item1[, item2[, . . . [,itemN]]]]);
//
将一个或多个新元素插入到数组的
指定位置
,插入位置的元素自动后移,返回""。
spa
举例说明:code
unshift()
var a = [1,2.5,"a","yes"];
var temp = a.unshift(-1,-2.2);
console.log(a); //[-1, -2.2, 1, 2.5, "a", "yes"] console.log(temp); //6 数组的长度 push()
var a = [1,2.5,"a","yes"];
var temp = a.push(-1,-2.2);
console.log(a); //[1, 2.5, "a", "yes", -1, -2.2] console.log(temp); //6 数组的长度
splice() 将数据添加到原数组结尾
var a = [1,2.5,"a","yes"];
var temp = a.splice(a.length,0, -1,-2.2); //此将数据添加到原数组结尾,同push()
console.log(a); //a: [1, 2.5, "a", "yes", -1, -2.2] console.log(temp); //[] 空数组
splice() 将数据添加到原数组开头
var a = [1,2.5,"a","yes"];
var temp = a.splice(0,0, -1,-2.2); //此将数据添加到原数组开头,同unshift()
console.log(a); //a: [-1, -2.2, 1, 2.5, "a", "yes"] console.log(temp); //[] 空数组 splice() 将数据添加到具体位置
var a = [1,2.5,"a","yes"];
var temp = a.splice(2,0, -1,-2.2); //此将数据添加到第三个位置
console.log(a); //a: [1, 2.5, -1, -2.2, "a", "yes"] console.log(temp); //[] 空数组
删除数组元素有三种方法:shift() pop() splice()对象
一、
arayObj.shift();//
删除原数组第一项,并返回删除元素的值;若是数组为空则返回undefined blog
二、
arrayObj.pop();//
删除原数组最后一项,并返回删除元素的值;若是数组为空则返回undefined排序
3
、 arrayObj.splice(deletePos,deleteCount);
//
删除从指定位置deletePos开始的指定数量deleteCount的元素,以
数组形式
返回所移除的元素
索引
举例说明:
shift()
var a = [1,2.5,"a","yes"];
var temp = a.shift();
console.log(a); //[2.5, "a", "yes"] console.log(temp); // 1 原数组第一项
pop()
var a = [1,2.5,"a","yes"];
var temp = a.pop();
console.log(a); // [1, 2.5, "a"] console.log(temp); // yes 原数组最后一项 splice() 删除指定位置开始的数据。第一个参数是指定位置,第二个参数是删除从指定位置开始的数据个数
var a = [1,2.5,"a","yes"];
var temp = a.splice(1,1); //删除第2个位置开始的1个数据,
console.log(a); // [1, "a", "yes"] console.log(temp); // [2.5] 以数组形式返回移除的元素 var temp = a.splice(1,2); //删除第2个位置开始的2个数据,
console.log(a); // [1, "yes"] console.log(temp); // [2.5, "a"] 以数组形式返回移除的元素
数组元素值的修改:先按元素的索引查找到须要修改的元素;
而后进行元素值的修改。
举例说明:
var a = [1,2.5,"a","yes"];
a[2] = "IT";
console.log(a); // [1, 2.5, "IT", "yes"]
还能够经过
splice()函数进行修改。splice(start,delCount,val1,val2,...):从start位置开始删除delCount项后,并从该开始位置起插入val1,val2,... 固然删除的元素个数和添加的元素个数必须相等。
var a = [1,2.5,10,"No","a","yes"]; 经过指定位置先删除再插入,达到修改数组的目的
var temp = a.splice(2,2,"You",0.1);
console.log(a); // [1, 2.5, "You", 0.1, "a", "yes"] console.log(temp); // [10, "No"] 其实就是删除项,用数组形式返回
获取数组元素值通用的一个方法:按元素的索引获取元素值;
返回改索引下的元素值
注:一次只能返回一个元素值,不能切片分块返回,也不能从数组末尾以负数形式返回
举例说明:
var a = [1,2.5,"a","yes"];
var temp = a[1];
console.log(temp); // 2.5 返回数组索引为1的元素值 var temp = a[1,2]; var temp = a[-1]; //这两种都是错误的,没法获取想要的数据
将两个以上数组合并为一个数组,经常使用的方法是
concat(),此方法
返回一个新的数组
,而参与合并的
原数组不变
。
举例说明:
var a = [1,5,2,15,6];
var b = ["You","No","a","yes"];
var temp = a.concat(b); //将b合并到a后面 var tempdata = b.concat(a); //将a合并到b后面 console.log(temp); // [1, 5, 2, 15, 6, "You", "No", "a", "yes"] console.log(tempdata); //["You", "No", "a", "yes", 1, 5, 2, 15, 6]
经过concat()函数实现两个以上数组的合并,其实经过
循环使用unshift()和push()
也能够作到。
好比将b加在a后面/前面,能够循环使用push()/unshift()函数。
var a = [1,5,2,15,6]; var b = ["You","No","a","yes"]; for(var i=0; i< b.length; i++){ a.push(b[i]) //将b加在a后面;若是但愿将b加在a前面,则改用unshift() } console.log(a); // [1, 5, 2, 15, 6, "You", "No", "a", "yes"] console.log(b); // ["You", "No", "a", "yes"]
这样作将会改变宿主数组,若是不但愿改变原数组的话,则新建一个新的空数组,将宿主数组(载体数组)
拷贝
给新数组,这样原数组就能够不改变。
注:这里的拷贝是深拷贝,而不是直接将a赋值给新数组,那样的话新数组其实只是保存了原数组的一个地址,新数组被修改,则原数组同样会被修改。
数组的裁剪:是在原数组基础上截取出一个小的数组,以便于使用和存放。截取的元素组成一个新的数组副本,而原数组不发生改变。
数组的裁剪通常使用
slice()函数,slice(start,end):返回从原数组中指定开始下标到结束下标之间的元素组成新的数组 ,若结束下标超出原数组总长,则以原数组结尾处下标为结束下标。
举例说明:
var a = [1,2.5,"a","yes",12,23];
var temp = a.slice(2,5); //裁剪下标为2到下标为5的元素;结束下标未超出数组总长
console.log(temp); // ["a", "yes", 12] console.log(a); // [1, 2.5, "a", "yes", 12, 23] 原数组不发生改变 var temp = a.slice(2,15); //裁剪下标为2到下标为15的元素;结束下标超出数组总长
console.log(temp); // ["a", "yes", 12, 23] 结束下标自动以原数组结尾下标为结束下标 console.log(a); // [1, 2.5, "a", "yes", 12, 23]
数组的排序:是在
原数组的基础上
对数组元素进行整理,使得元素按照必定顺序排列,
不会生成副本
。
数组排序通常使用数组对象内置方法
sort()。sort()方法用于对数组的元素进行排序。
若是调用该方法时没有传入参数,将按字母顺序对数组中的元素进行默认排序,是按照字符编码的顺序进行排序。若是想按其余标准进行排序,则须要提供比较函数,该函数比较两个值,而后返回一个数字来讲明这两个值的大小。比较函数具备两个参数 a 和 b,其返回值以下:
若 a 小于 b,在排序后的数组中 a 应该出如今 b 以前,则返回一个小于 0 的值(-1)。
若 a 等于 b,则返回 0。
若 a 大于 b,则返回一个大于 0 的值。
举例说明:
一、纯字符串排序
var a = ["zhao","qian","sun","li","zhou","wu","zheng"];
var temp = a.sort();
console.log(a); // ["li", "qian", "sun", "wu", "zhao", "zheng", "zhou"] console.log(temp); // ["li", "qian", "sun", "wu", "zhao", "zheng", "zhou"] 返回排好序的原数组 先按第一个字母排序,第一个相同则按第二个排序,以此类推。 二、字符串和数字混杂
var a = ["zhao","qian",1,"li","zhou","wu",2];
var temp = a.sort();
console.log(a); //[1, 2, "li", "qian", "wu", "zhao", "zhou"] 先排数字,后排字符串,其实这的1,2排序看似正确,其实不是按照他们的大小排的,而是按照1和2的编码顺序排的。从下面这个例子能够看出。
三、 纯数字排序(但不提供比较函数)
var a = [11,5,1,13,20,-1,2];
var temp = a.sort();
console.log(a); // [-1, 1, 11, 13, 2, 20, 5] 从这就能够看出默认排序是按照字符编码顺序排的,而不是大小 四、 纯数字正确排序(须要提供排序函数) var a = [11,5,1,13,20,-1,2];
var temp = a.sort(sortNumber);
console.log(a); // [-1, 1, 2, 5, 11, 13, 20] 这才是正确的从小到大排序
function sortNumber(a,b) 这是从小到大排序
{
return a - b
}
function sortNumber(a,b) 这是从大到小排序
{
return b – a
}
console.log(a); // [20, 13, 11, 5, 2, 1, -1] 这是从大到小排序结果
数组也有尴尬的时候,有时候咱们须要将数组转化为字符串进行传参,或者进行数据存储等,那么这时候就须要将数组转化成字符串。
join() 方法用于把数组中的全部元素放入一个字符串,元素经过指定的分隔符进行分隔。Join方法返回一个新的字符串副本,不会对原数组进行修改。
语法格式:arrayObject.join(separator) 返回一个字符串,该字符串是经过把 arrayObject 的每一个元素转换为字符串,而后将这些字符串链接起来,在两个元素之间插入separator 字符而生成。
举例说明:
var a = [1,2.5,"a","yes",12,23];
var temp = a.join(); //默认格式化,不提供链接字符
console.log(temp); //1,2.5,a,yes,12,23 console.log(a); // [1, 2.5, "a", "yes", 12, 23] var a = [1,2.5,"a","yes",12,23];
var temp = a.join(“|”); //提供链接字符,但链接字符必须是字符(“x”)形式 console.log(temp); // 1|2.5|a|yes|12|23 console.log(a); // [1, 2.5, "a", "yes", 12, 23]
var
arrayObj = new
Array();
//建立一个数组
经过内置对象Array()进行建立
var
arrayObj = new
Array([size]);
//建立一个数组并指定长度,注意不是上限,是长度
var
arrayObj = new
Array([element0[, element1[, ...[, elementN]]]]);
//建立一个数组并初始化赋值
var
arrayObj = []; //
也能够建立一个数组,并已完成初始化,只不过是个空的,没有实际元素
注:须要说明的是,虽然第二种方法建立数组指定了长度,但实际上全部状况下数组都是变长的,也就是说即便指定了长度为5,仍然能够将元素存储在规定长度之外的,注意:这时长度会随之改变。
数组是JavaScript提供的一个内部对象,它是一个标准的集合,咱们能够添加(push)、删除(shift)里面元素,还能够经过for循环遍历里面的元素。
方法 |
描述 |
链接两个或更多的数组,并返回结果。 |
|
把数组的全部元素放入一个字符串。元素经过指定的分隔符进行分隔。 |
|
删除并返回数组的最后一个元素 |
|
向数组的末尾添加一个或更多元素,并返回新的长度。 |
|
颠倒数组中元素的顺序。 |
|
删除并返回数组的第一个元素 |
|
从某个已有的数组返回选定的元素 |
|
对数组的元素进行排序 |
|
删除元素,并向数组添加新元素。 |
|
返回该对象的源代码。 |
|
把数组转换为字符串,并返回结果。 |
|
把数组转换为本地数组,并返回结果。 |
|
向数组的开头添加一个或更多元素,并返回新的长度。 |
|
返回数组对象的原始值 |