栈方法
JavaScript数组也提供了一种 让 数组的行为 像其它数据结构的方法,数组也可以像栈一样,栈是一种 限制插入和删除的数据结构,
栈是一种后进先出的数据结构,最新添加的内容最早移除。
栈中的操作分别是插入和移除,只发生在栈的顶部,push()方法(插入)和pop()方法(移除)。
push()方法可以接收任意多的参数,从末尾插入数据,把它们逐个添加个数组的末尾,并返回修改后数组的 长度。
pop()方法从数组末尾移除最后一项,减少length值,返回移除的项。
var colors = new Array();
var count = colors.push("red", "blue"); //为数组依次插入两个值red,blue
alert(count); //返回count的长度为2
count = colors.push("black"); //再在数组末尾插入一个项black
alert(count); //返回count的长度为3
var item = colors.pop(); //从数组末尾移除一个项
alert(item); //移除的项是black,返回black
alert(colors.length); // 此时数组的长度为2
也可以将栈与其它数组一起使用:
var colosrs = ["red", "blue"];
colors.push("yellow");
alert(colors); //red,blue,yellow
colors[3] = "orange";
alert(colors.length); //返回4
alert(colors); //red,blue,yellow,orange
var item = colors.pop(); //移除数组末尾的项
alert(item); //返回orange
alert(colors); //red,blue,yellow
队列方法
栈方法是 后进先出 的数据结构,而 队列方法则是 先进先出 的数据结构, 队列在列表的末端添加项,在列表的前端移除项。push()方法是从末端添加项并返回数组长度,而shift()则是移除列表的第一项并返回该项。
var colors = new Array();
var count = colors.push("red", "blue"); //向数组末端依次添加两个项。
alert(count); //返回red,blue
alert(colors); //返回 red,blue
alert(colors.length); //返回2
colors[2] = "yellow"; //向数组添加一项yellow
alert(colors.length); //返回3
alert(colors); //返回 red,blue,yellow
var item = colors.shift(); //移除数组前端的第一项
alert(item); //返回移除的项red
alert(colors.length); //返回2
alert(colors); //blue yellow
从前端第一项移除数据用shift()方法,那么从前端插入数据则用unshift()方法,pop()方法从末尾移除数据。
push()和shift()是正向队列方法,unshift()和pop()是反向队列方法。
栈方法与队列方法的区别:
栈只有一个进口或出口,后进先出的数据结构,最后一个进去,第一个出来。有push()方法(插入数据)和pop()方法(移除数据)。
队列各有一个进口和出口,先进先出的数据结构,第一个进去,第一个出来,
push()和shift()正向队列方法,unshift()和pop()反向队列方法。
重新排序方法
数组中已经存在两个可以用来排序的方法:reverse()和sort()
reverse()方法反向显示数组的排列顺序:
var values = [1, 2, 3, 4]; //数组元素的原顺序但这个方法不灵活。
values.reverse(); //数组反向排序
alert(values); //返回4,3,2,1
sort()方法默认是升序排序的,即最小值在最前端,最大值在最后端。
为了实现真正意义上的排序,sort()可以接收一个比较函数作为参数,以便我们指定哪个值位于哪个值的前面。
比较函数接收两个参数,如果第一个参数应位于第二个参数前面,则返回负值,如果第一个参数与第二个参数相等,则返回0,如果第一个参数位于第二个参数后面,则返回1,这是升序排序。如果是降序,则相反。
比较函数为:升序排序
function bjhs(value1,value2) {
if(value1 < value2) {
return -1; //返回负数,value1在value2前面
} else if(value1 > value2) {
return 1; //返回1,value1在value2后面
} else {
return 0; //返回0,value1与value2相等
}
}
完整sort()y方法排序代码:
function bjhs(value1,value2) {
if(value1 < value2) {
return -1; //返回负数,value1在value2前面
} else if(value1 > value2) {
return 1; //返回1,value1在value2后面
} else {
return 0; //返回0,value1与value2相等
}
}
var values = [0, 1, 3, 4, 2, 5]; //这个随机的顺序
values.sort(bjhs); //将比较函数作为参数传入sort()方法。
alert(values);//返回 0,1,2,3,4,5 升序排列
降序比较函数:
function bjhs(value1,value2) {
if(value1 < value2) {
return 1; //返回1,value1在value2后面,为降序
} else if(value1 > value2) {
return -1; //返回-1,value1在value2前面
} else {
return 0; //返回0,value1与value2相等
}
}
如果只是想反向显示数组元素,用reverse()方法即可,如果想将数组元素按升序或者降序排序的话,用sort()并将比较函数作为参数传入sort()方法。
操作方法
concat()方法
concat()方法可以基于当前数组的 所有项 创建一个副本,也就是说这个方法会先创建当前数组的一个副本,然后将接收到的内容添加到这个副本的末尾。
concat()的参数可以是一个值,或是一个数组,也可以没有参数,在没有参数的情况下,只是将当前的数组创建一个副本。
注:concat()不会影响到原数组
var colors = ["red", "blue", "yellow"]; //定义一个数组
var colors1 = colors.concat("orange", ["black", "white"]); //创建一个colors的副本,并把参数添加到colors的末尾
alert(colors); //red,blue,yellow 这是原数组,concat()方法不会改变原数组。
alert(colors1); //red,blue,yellow,orange,black,white 将concat()接收到的参数添加到副本末尾。
var colors2 = colors.concat(); //concat()不接收任何参数,表示只是创建一个colors的副本。
alert(colors2); //red,blue,yellow 只是一个副本
创建一个数组副本,根据所传入到concat()方法的参数添加到副本的末尾,参数可以是一个值,也可以是一个数组,甚至可以没有参数,没有参数的情况下,就只是一个副本。
slice()方法
slice()方法能够基于当前数组中的 一个或多个项 创建一个新数组,slice()可以接收两个参数,分别表示起始位置的索引和结束位置的索引。
当接收一个参数时,slice()方法返回从该参数指定的位置(索引)到当前数组末尾的所有项。
当接收两个参数时,slice()方法返回起始位置和结束位置之间的项--但不包含结束位置的项。
注:slice()方法不会影响原数组。
var colors = ["red", "blue", "green", "yellow", "purple"];
var colors1 = colors.slice(2); //一个参数,返回从索引为2的位置到当前数组末尾的所有项
var colors2 = colors.slice(1,4); //两个参数,返回从索引1和索引4之间的项,但不包含索引4位置的项
alert(colors1); //green,yellow,purple
alert(colors2); //blue,green,yellow
alert(colors); //red,blue,green,yellow,purple 不会影响原数组
注:如果结束位置索引小于起始位置索引,则返回 空数组。
splice()方法
数组可以通过splice()方法来进行插入、删除、替换操作。
- 删除:可以删除任意数量的项。接收两个参数:要删除的第一项的位置(索引)和要删除的项数。如果只有一个参数,则表示 删除从该索引位置到数组末尾之间的所有项。
- 插入:可以插入任意数量的项。接收三个参数:起始位置(索引)、0(要删除的项数)、插入的项。可以插入多个项。从起始位置插入。
- 替换:可以替换任意数量的项。接收三个参数:起始位置(索引)、要删除的项数、要插入的任意数量的项。替换就是删除与插入的组合。
删除数组项:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>JavaScript</title>
</head>
<body>
<script>
var arr = [1, 2, 3, 4, 5];
var a = arr.splice(1, 3); //从索引1开始,删除3项
console.log(arr); //1,5
//此时数组中还有[1, 5]
var b = arr.splice(0); //从索引0开始,删除所有项
console.log(arr); //[] 空数组
</script>
</body>
</html>
插入数组项和替换数组项:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>JavaScript</title>
</head>
<body>
<script>
var arr = [1, 2, 3, 4, 5];
var a = arr.splice(1, 0, 6, 7); //插入数组项
console.log(arr); //1,6,7,2,3,4,5
var b = arr.splice(2, 0);
console.log(arr); //1,6,7,2,3,4,5
var c = arr.splice(2, 6, 7); //替换
console.log(arr); //1,6,7
</script>
</body>
</html>
位置方法(查找方法)
位置方法: indexOf()和 lastIndexOf()。这两个方法都接收两个参数: 要查找的项和(可选的) 表示查找起点的索引。查找到第一个为止。第二个参数只是作为一个起点。
indexOf()表示从数组开头开始查找,返回 指定字符 第一次出现的索引。
lastIndexOf()表示从数组末尾开始查找,返回 指定字符 最后一次出现的位置索引。
当只有一个参数时,表示要查找的项,且从数组开头(索引0)开始查找或数组末尾查找。
返回查找项的位置,没有查找则返回-1,在查找过程中,是第一个参数与数组中的项逐一比较,使用的是全等操作符,也就是说,比较的过程中,是要求类型和值都是相等的。
var arr = [1, 2, 3, 4, 5, 2];
console.log(arr.indexOf(3)); //返回2
console.log(arr.indexOf(3, 1)); //返回2
console.log(arr.indexOf(2)); //返回1
console.log(arr.indexOf(2, 0)); //返回1
console.log(arr.indexOf(2, 2)); //返回5 查找起点变成了索引为2的位置,往后查找2的位置为索引5
第二个参数只是作为查找的起点。
迭代方法
迭代方法可以接收两个参数: 要在第一项上运行的函数和 运行函数的作用域对象-影响this值。
传入方法的函数有三个参数: 数组项的值、 该项在数组中的位置和 数组对象本身。
常见的4个迭代方法: 检查数组的每个元素是否符合条件
1、every(): 对数组中每一项运行 给定函数,如果该函数对 每一项 都返回true,则该方法返回true。
2、some():对数组中的每一项运行 给定函数,如果该函数对 任一项 都返回true,则该方法返回true。
3、filter():对数组中的每一项运行 给定函数,返回 该函数 返回true的项 组成的数组。
4、map():对数组中的每一项运行 给定函数,返回 每次函数调用结果 组成的数组。
5、forEach():没有返回值,主要用于遍历数组、迭代数组。
var arr = [1, 2, 3, 4, 5, 4, 3, 2];
//对每一项运行 给定函数 ,判断是否每一项都大于2,若每一项都大于2,返回true。
var everyResult = arr.every(function(item, index, array) {return (item > 2);});
console.log(everyResult); //返回false 显然不是每一项都大于2
//对每一项运行 给定函数,判断是否任一项有大于2的,若有至少一项大于2,返回true
var someResult = arr.some(function(item, index, array) {return (itme > 2);});
console.log(someResult); //返回true 显然有大于2的项
//对每一项运行 给定函数, 返回 由大于2的项 组成的数组
var filterResult = arr.filter(funcntion(item, idnex, arry) {return (item > 2)});
console.log(filterResult); //返回3,4,5,4,3 这些都大于2的项
//返回 每次 函数调用结果组成的数组
var mapResult = arr.map(function(item, index, array) {return (item + 2)});
console.log(mapResult); //返回3,2,5,6,7,6,5,4 这些都是每次函数调用的结果组成的数组
用forEach()方法遍历数组:
var arr = [1, 2, 3, 4, 5];
arr.forEach(function (item, index, array) {
console.log(item); //1,2,3,4,5
});
并归方法
reduce()和 reduceRight()这个两个方法会 迭代数组的所有项,然后构建一个最终返回的值。reduce()是从数组的第一项开始,逐个遍历到最后,reduceRight()是数组的最后一项开始,向前遍历到第一项。
reduce()和reducyRight()接收两个参数: 参数每一项上调用的函数和(可选)缩小基础的初始值。
每一项调用的 函数接收四个参数: 前一个值,当前值,当前项的索引,数组对象 。
第一次迭代发生在数组的 第二项上,因 此第一个参数是数组的第一项,第二个参数是数组的第二项。
这个 函数返回的任何值都会 作为第一个参数自动传给下一项。
如:用reduce()方法执行数组中所有值之和的操作:
var values = [1, 2, 3, 4, 5];
//求数组中所有值的和,
var sum = values.reduce(function(prev, cur, index, array){return prev + cur;});
console.log(sum);// 15
第一次执行构造函数,prev是1,cur是2。第一次迭代发生在数组的第二项上即cur是2,
第二次prev是3(1加2的结果,将返回的值作为第一个参数),cur是3(第三项)。
这个过程会把数组中的所有项遍历完,最后返回结果即15。
fill()方法
fill()方法的作用是用一个固定值填充(替换)数组中的每一项。固定值作为fill()参数传入,用双引号括起来。
格式:arr.fill("abc");
var arr = ["red", "blue", "yellow", "black"];
console.log(arr); //red,blue,yellow,black
console.log(arr.fill("orange")); //orange,orange,orange,orange
以上用‘orange’全部替换了arr数组中所有的元素。
注:使用fill()方法时,原数组必须有元素,或者空元素也行,但不能为空数组。
当数组为空数组时:
var arr = [];
console.log(arr.fill("good")); //输出为空,什么也没有
var arr = [""];
console.log(arr.fill("good")); //输出good
当有两个或以上的空元素时,输出有两个或以上的"good"。
find()方法
find()方法返回 传入一个函数作为参数 且 第一个符合函数条件的 元素值。(因为可能有很多都符合某个函数,这里只返回第一个符合条件的元素值)
find()的参数为一个函数。
var arr = [1, 2, 4, 10, 20, 30];
function Bj(age) {
return age >=9; //返回大于等于9的数值
}
console.log(arr.find(Bj)); //返回10,在arr数组中,符合大于等于9的数有10,20,30,find()方法返回第一个符合条件的元素值,所以是10
在arr数组中,符合大于等于9的数有10,20,30,find()方法返回 第一个 符合条件的元素值,所以是10