数组对象的作用是:使用单独的变量名来存储一系列的值。下面是一些数组操作中会用到的方法的总结:
定义数组
我们使用关键词 new 来创建数组对象。
创建 Array 对象的语法:
new Array(); new Array(size); new Array(element0, element1, ..., elementn);
返回值为新创建并被初始化了的数组。
如果调用构造函数 Array() 时没有使用参数,那么返回的数组为空,length 字段为 0。
当调用构造函数时只传递给它一个数字参数,该构造函数将返回具有指定个数、元素为 undefined 的数组。
当其他参数调用 Array() 时,该构造函数将用参数指定的值初始化数组。
当把构造函数作为函数调用,不使用 new 运算符时,它的行为与使用 new 运算符调用它时的行为完全一样。
有两种向数组赋值的方法(你可以添加任意多的值,就像你可以定义你需要的任意多的变量一样)。
1.
var mycars=new Array() mycars[0]="Saab" mycars[1]="Volvo" mycars[2]="BMW" //也可以使用一个整数自变量来控制数组的容量: var mycars=new Array(3) mycars[0]="Saab" mycars[1]="Volvo" mycars[2]="BMW"
2.
var mycars=new Array("Saab","Volvo","BMW")
注意:如果你需要在数组内指定数值或者逻辑值,那么变量类型应该是数值变量或者布尔变量,而不是字符变量。
访问数组
通过指定数组名以及索引号码,你可以访问某个特定的元素。
document.write(mycars[0]) //输出:Saab
修改已有数组中的值
如需修改已有数组中的值,只要向指定下标号添加一个新值即可:
mycars[0]="Opel"; //再输出一下数组的值 document.write(mycars[0]); //将输出:Opel
上面列出了简单的数组定义、访问及修改,下面进入正题:JS常用数组方法汇总。
常用方法汇总
push() 与 pop() 方法
语法:
//push() 方法可向数组的末尾添加一个或多个元素,并返回新的长度。 arrayObject.push(newelement1,newelement2,....,newelementX) //pop() 方法用于删除并返回数组的最后一个元素。如果数组已经为空,则 pop() 不改变数组,并返回 undefined 值。 arrayObject.pop()
实例:
//声明一个编程语言数组 var lang = new Array('php','java','c'); console.log(lang); //输出:["php", "java", "c"] var res = lang.push('python'); console.log(lang); //输出: ["php", "java", "c", "python"] console.log(res); //输出:4 var res = lang.push('c#', 'css'); console.log(lang); //输出: ["php", "java", "c", "python", "c#", "css"] console.log(res); //输出: 6 var res = lang.pop(); console.log(lang); //输出: ["php", "java", "c", "python", "c#"] console.log(res); //输出: css
shift() 与 unsfhit() 方法
语法:
//shift() 方法用于把数组的第一个元素从其中删除,并返回第一个元素的值。如果数组是空的,那么 shift() 方法将不进行任何操作,返回 undefined 值。 arrayObject.shift() //unshift() 方法可向数组的开头添加一个或更多元素,并返回新的长度。 arrayObject.unshift(newelement1,newelement2,....,newelementX)
实例:
//声明数组 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
sort() 和 reverse() 方法
语法:
/*sort() 方法用于对数组的元素进行排序。 如果调用该方法时没有使用参数,将按字母顺序对数组中的元素进行排序。 如果想按照其他标准进行排序,就需要提供比较函数,该函数要比较两个值,然后返回一个用于说明这两个值的相对顺序的数字。比较函数应该具有两个参数 a 和 b,其返回值如下: 若 a 小于 b,在排序后的数组中 a 应该出现在 b 之前,则返回一个小于 0 的值。 若 a 等于 b,则返回 0。 若 a 大于 b,则返回一个大于 0 的值。*/ arrayObject.sort(sortby) //reverse() 方法用于颠倒数组中元素的顺序。 arrayObject.reverse()
实例:
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"]
注:这两种方法都是直接改变原数组,而不创建新数组。
toString()、toLocaleString() 和 toSource()
语法:
//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() 方法
语法:
//slice() 方法可从已有的数组中返回包含从 start 到 end (不包括该元素)的 arrayObject 中的元素。如果没有指定 end 参数,那么切分的数组包含从 start 到数组结束的所有元素。如果 end 参数是负数,那么它规定的是从数组尾部开始算起的元素。 arrayObject.slice(start,end)
实例:
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"]
注:1. 可使用负值从数组的尾部选取元素; 2. 如果 end 未被规定,那么 slice() 方法会选取从 start 到数组结尾的所有元素。
splice()方法
最后重点记录下比上面各个方法都要强大的splice()
方法,它可以用于插入、删除或替换数组的元素。
splice() 方法可删除从 index 处开始的零个或多个元素,并且用参数列表中声明的一个或多个值来替换那些被删除的元素。
如果从 arrayObject 中删除了元素,则返回的是含有被删除的元素的数组。
语法:
//splice() 方法向/从数组中添加/删除项目,然后返回被删除的项目。 arrayObject.splice(index,howmany,item1,.....,itemX)
下面仔细说明下如何用 splice()
方法对数组进行插入、删除和替换操作:
- 删除:两个参数,第一个参数(要删除第一项的位置),第二个参数(要删除的项数)
- 插入:向数组指定位置插入任意项元素。三个参数,第一个参数(其实位置),第二个参数(0),第三个参数(插入的项)
- 替换:向数组指定位置插入任意项元素,同时删除任意数量的项,三个参数。第一个参数(起始位置),第二个参数(删除的项数),第三个参数(插入任意数量的项)
实例:
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#"]
IT疯狂女 2015/02/09 09:57
博主对js很懂吧
Specs 2015/02/09 11:45
@ 懂一点儿、、离很懂还差得远~
hanbing17 2015/03/19 12:39
很懂吧
爱的表白 2015/03/22 21:04
没想到这里藏有这么好的东西,收藏先~!!!!!