（1）知识点
- （1.1）将数组转化为字符串
- （1.2）连接数组 concat
- （1.3）获取子数组 slice
- （1.4）splice：删除 插入 替换
- （1.5）reverse：颠倒数组中所有元素的位置
- （1.6）sort()：排序
- （1.7）栈和队列
（2）细化
（2.1）将数组转化为字符串
有两种方式：
var str=arr.toString(); //返回数组中元素的内容，用逗号分隔
var str=arr.join("连接符"); //可自定义连接符
- 无缝拼接数组每个元素：var str=arr.join("")
如果不加""，等效于toString，用逗号 - 将单词拼接为句子: var str=arr.join(" ");
- 将数组拼接为html元素：
优化：数组的拼接比字符串拼接效率更高！
建议：今后凡是频繁的字符串拼接，都要2步：
（1）先将要拼接的子字符串放入一个数组中
（2）调用数组的join方法，一次性生成结果字符串
（2.2）连接数组
var newArr=arr1.concat(arr2,值1,值2,......)
强调：concat不修改原数组，总是返回一个新数组
（2.3）获取子数组
var subArr=arr.slice(starti,endi+1);
starti: 开始获取的下标位置
endi:表示获取截止到的下标位置
** 含头不含尾 **
slice方法支持倒数参数：其实负数下标不存在，假定的负数下标从-1开始
（2.4）删除 插入 替换
splice() 方法 向/从 数组中添加/删除项目，然后返回被删除的项目。
arrayObject.splice(index,howmany,item1,.....,itemX)
splice() 方法可删除从 index 处开始的零个或多个元素，并且用参数列表中声明的一个或多个值来替换那些被删除的元素。
如果从 arrayObject 中删除了元素，则返回的是含有被删除的元素的数组。
- 删除: arr.splice(starti,n)
从starti位置开始，删除n个元素 - 插入: arr.splice(starti,0,新值1,新值2,......)
在starti位置插入新值1,新值2,......
原starti位置及其之后的元素，被向后顺移 - 替换: arr.splice(starti,n,新值1,新值2,......)
新元素的个数和n不一定相等
数组会自动调整元素的位置和长度
（2.5）颠倒数组中所有元素的位置
arr.reverse();
（2.6）sort()
arr.sort();
sort() 方法用于对数组的元素进行排序；数组在原数组上进行排序，不生成副本。
特点：默认按升序排列，默认一切都转为字符串，再按字符串比大小
如果想要自定义排序规则，那么需要2步：
第一步. 定义比较器函数：专门比较任意两值大小的函数
规定：两个参数（a , b），必须返回数字：
如果a>b，就要返回正数
如果a<b，就要返回负数
如果a=b，就要返回0
第二步. 将比较器函数对象作为参数传入sort方法中
arr.sort(比较器函数名); //函数名不加圆括号
tips：升序改降序: 只要给比较器的逻辑*-1
（2.7）栈和队列
其实都是数组，只不过使用了不同的方法
- 栈
一端封闭，只能从另一端进出的数组
何时使用栈：只能从数组一端进出
LIFO ---->last in first out
a. 结尾出入栈：
入栈:
arr.push(新值); ==>arr[arr.length]=新值;
出栈:
var last=arr.pop();
** 无论出入栈都不影响已有元素的位置——效率高 **
b. 开头出入栈：
入栈:
arr.unshift(新值);
出栈:
var first=arr.shift()
** 每次出入栈都会影响所有剩余元素的位置发生顺移——效率低 **
- 队列
只能从一端进入，必须从另一端出
何时使用：只要先到的先得
FIFO---->first in first out
结尾入队列：
arr.push(新值);
开头出队列：
var first=arr.shift();
（3）实践
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>数组API</title>
</head>
<body>
<p>var arr1 = [1, 2, 3, 'a', 'b', 'c'];</p>
<p>var arr2 = ['a', 'b'];</p>
<p>var del = [1, 2, 3, 4, 5, 6];</p>
<p>var insert = [1, 2, 3, 4, 5, 6];</p>
<p>var replace = [1, 2, 3, 4, 5, 6];</p>
<p>var sortArray = [6,3,5,44,22,1];</p>
<script type="text/javascript">
init();
function init() {
var arr1 = [1, 2, 3, 'a', 'b', 'c'];
arrToString(arr1); //（1）数组转为字符串
//（2）连接两个或多个数组：concat
var arr2 = ['a', 'b'];
concatArr(arr1, arr2);
//（3）获取子数组 slice
childArr(arr1);
//（4）删除 插入 替换 splice，然后返回被删除的项目
var del = [1, 2, 3, 4, 5, 6];
delArr(del);
var insert = [1, 2, 3, 4, 5, 6];
insertArr(insert);
var replace = [1, 2, 3, 4, 5, 6];
replaceArr(replace);
//（5）颠倒数组中所有元素的位置
reverse(arr1);
//（6）sort排序
var sortArray = [6, 3, 5, 44, 22, 1];
sort(sortArray);
sort2(sortArray);
sort3(sortArray);
}
function arrToString(arr) {
var str = arr.toString(); //1,2,3 返回数组中的元素内容，用逗号分隔
var str2 = arr.join(""); //123 无缝拼接数组中的元素内容，可自定义连接符
console.log('数组转字符串，用“，”分隔：');
console.log(str);
console.log('数组转字符串，无缝拼接：');
console.log(str2);
}
function concatArr(arr1, arr2) {
var newArr = arr1.concat(arr2);
console.log('连接数组：');
console.log(newArr); //[1, 2, 3, "a", "b"] concat不修改原数组，总是返回一个新数组
}
function childArr(arr) {
var newArr = arr.slice(0, 4); //[1, 2, 3, "c"]
var newArr1 = arr.slice(-1, 4); //[]
console.log('获取子数组0-4：');
console.log(newArr);
console.log('获取子数组（-1）- 4：');
console.log(newArr1);
}
function delArr(arr) {
var delArr = arr.splice(2, 1); //从位置2开始，删除1个元素
console.log('splice删除的元素：');
console.log(delArr);
console.log('返回新的数组：');
console.log(arr);
}
function insertArr(arr) {
var insetArr = arr.splice(2, 0, 'c', 'd', 'e'); //从2的位置开始，插入新值'c','d','e'
console.log('splice插入的元素：');
console.log(insetArr);
console.log('返回新的数组：');
console.log(arr);
}
function replaceArr(arr) {
var replaceArr = arr.splice(2, 2, 'r', 'e', 'p', 'l', 'a', 'c', 'e'); //新元素的个数和n不一定相等，数组会自动调整元素的位置和长度
console.log('splice替换的元素：');
console.log(replaceArr);
console.log('返回新的数组：');
console.log(arr);
}
function reverse(arr) {
var reverse = arr.reverse();
console.log('reverse颠倒数组中所有元素的位置：');
console.log(reverse);
}
function sort(arr) {
var sortArr = arr.sort();
console.log('sort对数组进行排序，默认按升序排列：');
console.log(sortArr); //[1, 22, 3, 44, 5, 6]
}
/**
* 默认一切转为字符串，按升序排列
* 自定义排序，按数字大小升序排列
* （1）先定义一个排序函数
* （2）将排序函数对象作为参数传入sort方法中
*/
function sort2(arr) {
var sortArr = arr.sort(sortNum);
console.log('sort自定义排序，按大小升序排列：');
console.log(sortArr); //[1, 3, 5, 6, 22, 44]
}
function sortNum(a, b) {
return a - b;
}
/**
* 自定义排序，按降序排列
* 给比较器的逻辑*-1
* @param arr
*/
function sort3(arr) {
var sortArr = arr.sort(sortNumDown);
console.log('sort自定义排序，按大小降序排列：');
console.log(sortArr); //[44, 22, 6, 5, 3, 1]
}
function sortNumDown(a, b) {
return (a - b) * (-1);
}
/**
* 结尾出入栈
*/
var bottomStack = new Array();
//入栈 push
for (var i = 1; i <= 10; i++) {
bottomStack.push(i);
}
console.log(bottomStack);
//出栈 pop
//如果使用栈的时候，length的实时发生变化的
//for(var i = 1; i < bottomStack.length; i++) {
for (var i = 1; i <= 10; i++) {
console.log("出栈：" + bottomStack.pop());
console.log("当前栈：" + bottomStack.toString());
console.log("_____");
}
/**
* 开头出入栈
*/
//入栈 unshift
var headStack = [];
for (var i = 1; i <= 10; i++) {
headStack.unshift(i)
}
console.log(headStack);
//出栈 shift
for (var i = 1; i <= 10; i++) {
console.log("开头出栈：" + headStack.shift());
console.log("当前栈：" + headStack.toString());
console.log("*****")
}
/**
* 队列：只能从一端进入，从另一端出去
*/
//进：push
var lineArr = [];
for (var i = 1; i <= 10; i++) {
lineArr.push(i);
}
console.log(lineArr);
//出：shift
for (var i = 1; i <= 10; i++) {
console.log("队列：" + lineArr.shift());
console.log("当前队列：" + lineArr.toString());
console.log("*****")
}
</script>
</body>
</html>
网友评论