JS常用数组方法汇总(数组元素添加与删除)

PHPABC JavaScript 1,307 次浏览 , 没有评论

数组对象的作用是:使用单独的变量名来存储一系列的值。下面是一些数组操作中会用到的方法的总结:

定义数组

我们使用关键词 new 来创建数组对象。
创建 Array 对象的语法:

/*sort() 方法用于对数组的元素进行排序。
如果调用该方法时没有使用参数,将按字母顺序对数组中的元素进行排序。
如果想按照其他标准进行排序,就需要提供比较函数,该函数要比较两个值,然后返回一个用于说明这两个值的相对顺序的数字。比较函数应该具有两个参数 a 和 b,其返回值如下:
若 a 小于 b,在排序后的数组中 a 应该出现在 b 之前,则返回一个小于 0 的值。
若 a 等于 b,则返回 0。
若 a 大于 b,则返回一个大于 0 的值。*/
arrayObject.sort(sortby)
 
//reverse() 方法用于颠倒数组中元素的顺序。
arrayObject.reverse()

返回值为新创建并被初始化了的数组。

如果调用构造函数 Array() 时没有使用参数,那么返回的数组为空,length 字段为 0。

当调用构造函数时只传递给它一个数字参数,该构造函数将返回具有指定个数、元素为 undefined 的数组。

当其他参数调用 Array() 时,该构造函数将用参数指定的值初始化数组。

当把构造函数作为函数调用,不使用 new 运算符时,它的行为与使用 new 运算符调用它时的行为完全一样。

有两种向数组赋值的方法(你可以添加任意多的值,就像你可以定义你需要的任意多的变量一样)。

1.

var lang = new Array('php', 'java', 'c++', 'asp', 'vb', 'jsp');
console.log(lang); //输出:["php", "java", "c++", "asp", "vb", "jsp"]
var res = lang.sort();
console.log(lang); //输出:["asp", "c++", "java", "jsp", "php", "vb"]
console.log(res); //输出:["asp", "c++", "java", "jsp", "php", "vb"]
 
var nums = new Array('3', '20', '1000', '43', '123');
console.log(nums); //输出:["3", "20", "1000", "43", "123"]
var res = nums.sort();
console.log(nums); //输出:["1000", "123", "20", "3", "43"]
console.log(res); //输出:["1000", "123", "20", "3", "43"]
 
function sortBy(a, b){
    return a-b;
}
var nums = new Array('3', '20', '1000', '43', '123');
console.log(nums); //输出:["3", "20", "1000", "43", "123"]
var res = nums.sort(sortBy);
console.log(nums); //输出:["3", "20", "43", "123", "1000"]
console.log(res); //输出:["3", "20", "43", "123", "1000"]
 
var lang = new Array('php', 'java', 'c', 'vb');
console.log(lang); //输出:["php", "java", "c", "vb"]
var res = lang.reverse();
console.log(lang); //输出:["vb", "c", "java", "php"]
console.log(res); //输出:["vb", "c", "java", "php"]

2.

//toString() 方法可把数组转换为字符串,并返回结果。返回值与没有参数的 join() 方法返回的字符串相同。
arrayObject.toString()
 
//toLocaleString()把数组转换为本地字符串。首先调用每个数组元素的 toLocaleString() 方法,然后使用地区特定的分隔符把生成的字符串连接起来,形成一个字符串。
arrayObject.toLocaleString()
 
//toSource() 方法表示对象的源代码。只有 Gecko 核心的浏览器(比如 Firefox)支持该方法,也就是说 IE、Safari、Chrome、Opera 等浏览器均不支持该方法。
object.toSource()

注意:如果你需要在数组内指定数值或者逻辑值,那么变量类型应该是数值变量或者布尔变量,而不是字符变量。

访问数组

通过指定数组名以及索引号码,你可以访问某个特定的元素。

var lang = new Array('php', 'java', 'c');
console.log(lang); //输出:["php", "java", "c"]
var res = lang.toString();
console.log(lang); //输出:["php", "java", "c"]
console.log(res); //输出:php,java,c
 
var res = lang.toLocaleString();
console.log(res); //输出:php,java,c
 
function employee(name,job,born)
{
this.name=name;
this.job=job;
this.born=born;
}
 
var bill=new employee("Bill Gates","Engineer",1985);
console.log(bill); //输出:employee {name: "Bill Gates", job: "Engineer", born: 1985}

修改已有数组中的值

如需修改已有数组中的值,只要向指定下标号添加一个新值即可:

//slice() 方法可从已有的数组中返回包含从 start 到 end (不包括该元素)的 arrayObject 中的元素。如果没有指定 end 参数,那么切分的数组包含从 start 到数组结束的所有元素。如果 end 参数是负数,那么它规定的是从数组尾部开始算起的元素。
arrayObject.slice(start,end)

上面列出了简单的数组定义、访问及修改,下面进入正题:

JS常用数组方法汇总。

push() 与 pop() 方法

语法:

var lang = new Array("php", "java", "c++", "asp", "vb", "jsp");
console.log(lang); //输出:["php", "java", "c++", "asp", "vb", "jsp"]
var res = lang.slice(2);
console.log(lang); //输出:["php", "java", "c++", "asp", "vb", "jsp"]
console.log(res); //输出:["c++", "asp", "vb", "jsp"]
var res = lang.slice(1,3);
console.log(lang); //输出:["php", "java", "c++", "asp", "vb", "jsp"]
console.log(res); //输出:["java", "c++"]
var res = lang.slice(1, -2);
console.log(lang); //输出:["php", "java", "c++", "asp", "vb", "jsp"]
console.log(res); //输出:["java", "c++", "asp"]

实例:

//splice() 方法向/从数组中添加/删除项目,然后返回被删除的项目。
arrayObject.splice(index,howmany,item1,.....,itemX)

shift() 与 unsfhit() 方法
语法:

var lang = new Array('php', 'java', 'c');
//删除
var removed = lang.splice(1, 1);
console.log(lang); //输出:["php", "c"]
console.log(removed); //输出:["java"]
 
//插入
var insert = lang.splice(0, 0, 'asp', 'c#', 'python');
console.log(lang); //输出:["asp", "c#", "python", "php", "c"]
console.log(insert); //输出:[]
 
//替换
var replace = lang.splice(1, 1, 'ruby', 'js');
console.log(lang); //输出:["asp", "ruby", "js", "python", "php", "c"]
console.log(replace); //输出:["c#"]

实例:

//声明数组
var lang = new Array('php', 'java', 'c');
console.log(lang); //输出:["php", "java", "c"]
 
var res = lang.shift();
console.log(lang); //输出:["java", "c"]
console.log(res); //输出:php
 
var res = lang.unshift('python');
console.log(lang); //输出:["python", "java", "c"]
console.log(res); //输出:3
var res = lang.unshift('c#','css');
console.log(lang); //输出:["c#", "css", "python", "java", "c"]
console.log(res); //输出:5

注:1. 这两种方法都会改变数组的长度;2. 这两种方法都不会创建新数组,而是直接修改原有的数组对象;3. unshift() 方法无法在 Internet Explorer 中正确地工作!

concat() 和 join() 方法
语法:

//concat() 方法用于连接两个或多个数组。该方法不会改变现有的数组,而仅仅会返回被连接数组的一个副本。
arrayObject.concat(arrayX,arrayX,......,arrayX)
 
//join() 方法用于把数组中的所有元素放入一个字符串。元素是通过指定的分隔符进行分隔的。
arrayObject.join(separator)

实例:

var lang1 = new Array('php', 'java', 'c');
var lang2 = new Array('c++', 'javascript');
var lang3 = new Array('c#');
var res = lang1.concat(lang2, lang3);
console.log(res); //输出:["php", "java", "c", "c++", "javascript", "c#"]
 
console.log(lang1); //输出:["php", "java", "c"]
var res = lang1.join(',');
console.log(res); //输出:php,java,c

发表评论

电子邮件地址不会被公开。 必填项已用*标注

此站点使用Akismet来减少垃圾评论。了解我们如何处理您的评论数据

Go