11月13数组以及数组常用发法
1.数组
数组的作用：使用单独的变量名来存储一系列的值。类似于python中的列表。
简单的数组操作
var a = [123, "ABC"];
console.log(a[1]);
// 输出"ABC"
2.数据的常用方法
| 方法 | 说明 |
|---|---|
| .length | 数组的大小 |
| .push(ele) | 尾部追加元素 |
| .pop() | 获取尾部的元素 |
| .unshift(ele) | 头部插入元素 |
| .shift() | 头部移除元素 |
| .slice(start,end) | 切片 |
| .reverse() | 反转 |
| .join(seq) | 将数组元素连接成字符串 |
| .concat(val,…) | 连接数组 |
| .sort() | 排序 |
| .forEach() | 将数组的每个元素传递给回调函数 |
| .splice() | 删除元素，并向数组添加新元素 |
| .map() | 返回一个数组元素调用函数处理后的值的新数组 |
1.length方法
此方法用于查看数组的大小
例子代码
var a = ["a","b","c"];
console.log(a.length)
结果如图
2.push方法
此方法可以在尾部追加元素
例子代码
var a = ["a","b","c"];
a.push("junwan");
console.log(a);
结果如图
3.pop方法
此方法可以获取尾部的元素，但是数组会失去这个被获取的元素
例子代码
var a = ["a","b","c"];
a.push("junwan");
console.log(a.pop());
console.log(a)
结果如图
这里的结果说明了js的pop方法获取到数组尾部的数据后会将其从数组中取走，然后再次输出数组就会少去这个被pop方法获取的数据。
4.unshift方法
头部插入元素
例子代码
var a = ["a","b","c"];
a.unshift("junwan");
console.log(a);
效果如图
5.shift方法
此方法可以移除头部的元素
例子代码
var a = ["a","b","c"];
a.unshift("junwan");
a.shift();
console.log(a);
效果如图
6.slice方法
此方法就是切片的效果
var a = ["a","b","c"];
a.unshift("junwan");
console.log(a.slice(0,2));
效果如图
7.reverse方法
此方法可以让数组内的元素进行反转
例子代码
var a = ["a","b","c"];
a.unshift("junwan");
a.reverse()
console.log(a);
效果如图
8.join方法
此方法能将数组元素连接成字符串,同时也可以选择用什么符号进行连接
普通例子代码
var a = ["a","b","c"];
a.unshift("junwan");
console.log(a)
console.log(a.join());
效果如图
选择符号进行连接例子代码
var a = ["a","b","c"];
a.unshift("junwan");
console.log(a)
console.log(a.join("|"));
console.log(a.join("天"));
console.log(a.join("ziyue"));
效果如图
9.concat方法
此方法用于将多个数组之间进行连接
例子代码
var a = ["a","b","c"];
var b = ["lzy","sjw","wmc"];
a.concat(b)
console.log(a.concat(b));
效果如图
10.sort方法
此方法用于排序
例子代码
var a = ["c","d","b","a"];
console.log(a.sort())
效果如图
特殊情况
然后就是特殊的情况，就是当数组内都是数字时，有可能排序会有问题
例子情况
var numbers = [1, 10, 21, 2];
numbers.sort();
console.log(numbers); // 输出：[1, 10, 2, 21]
效果如图
解决特殊情况的方法
出现这种情况就需要使用比较函数function来处理
升序：
首先是升序的排序格式(可以理解为比大小)它的顺序是从小到大
var numbers = [1,10,21,2];
numbers.sort(function(a,b){
return a - b;
});
console.log(numbers);
这里通过将function里面的a和b进行比较，
可以这么理解如果a-b结果为负值，表示a应该排在b之前。
如果结果为零，表示a和b相等。
如果结果为正值，表示a应该排在b之后。
效果如图
降序：
然后就是降序的排序格式(也是比大小)它的顺序是从大到小。
格式
var numbers = [1,10,21,2];
numbers.sort(function(a,b){
return b - a;
});
console.log(numbers);
这个代码里面只是将a - b换成了b - a
这意味着，如果b - a 的结果为正值，那么b应该排在a之前；
如果结果为零，表示a和b相等；
如果结果为负值，表示b应该排在a之后。
效果如图
11.forEach方法
此方法用于将数组的每个元素传递给回调函数。
格式
forEach(function(currentValue, index, array), thisValue)
首先是参数function：它是必需的，每个元素需要调用的函数。
然后就是function里面的参数
| 参数 | 描述 |
|---|---|
| currentValue | 必需，当前数组元素的值。 |
| index | 可选，当前元素的索引值。 |
| array | 可选，代表当前使用forEach方法的数组的名字(这里的array是一个例子，实际应用是要填调用此方法数组的名称) |
例子代码如下
var fruits = ["apple", "banana", "orange"];
fruits.forEach(function(fruit, index, fruits){
console.log(index,fruit, fruits)
})
效果如图
在此代码里面fruit代表了fruits数组里面的元素，然后index如果不改就会以默认的形式将该数组的元素索引给获取出来。然后就是fruits是将这个数组带入然后每次迭代它都输出（可以使用也可以不使用，个人需求）。
12.splice方法
此方法用于删除元素，并向数组添加新元素
格式
splice(start,deleteCount,item1,.....,itemX)
然后就是它的内部参数
| 参数 | 描述 |
|---|---|
| start | 必需。规定从何处添加/删除元素。 该参数是开始插入和三处的数组元素的下标，必须是数字。 |
| deleteCount | 必需。规定应该删除多少元素。必须是数字，但可以是"0"。如果未规定此参数，则删除从index开始到原数组结尾的所有元素。 |
| item1，…，itemX | 可选。要添加到数组的元素(可选)。 |
将删除的功能演示一下
代码
var fruits = ["apple", "banana", "orange", "grape"];
fruits.splice(1, 2);
console.log(fruits);
这里让splice从索引位置为1开始删除，然后2是决定删除多少个元素。
效果如图
然后这里将插入的功能也给进行实现
代码
var fruits = ["apple", "banana", "orange", "grape"];
fruits.splice(1, 2,"junwan","xile","songli");
console.log(fruits);
效果如图
在这个代码里面先从索引为1的位置开始删除然后再从删除的地方进行插入新的数据。
13.map方法
用于创建一个新数组，其中的每个元素都是原始数组中的对应元素调用提供的函数后的结果(就是在原数组的元素内进行一定的处理重新创建一个数组给添加进去)。
基本格式
array.map(function(currentValue, index, array) {
// 处理每个元素的逻辑
// 返回新的元素
});
function的参数
| 参数 | 描述 |
|---|---|
| currentValue | 必需的参数，表示当前数组内的元素。 |
| index | 可选，当前元素的索引值 |
| array | 可选，表示当前调用此方法的数组。 |
实例代码
var arr = ["123", "a", "b", "c", "d"];
var arr1 = arr.map(function(val, index, arr){
return val + 1
})
console.log(arr1)
在此函数中index和arr没有什么特殊的体现(有些鸡肋可有可无)
效果如图
还有用for循环取值
格式如下
var brr = ["123","456","789","10111213"];
for(var i = 0; i<brr.length;i++){
console.log(brr[i])
}
在这个for循环里面循环起始条件是i等于0，循环条件是i小于数组brr的长度,每次循环结束后i自增。console.log(brr[i])在每次循环中，使用console.log输出数组brr在索引i处的元素。
还有一个简写的形式
for(i in brr){
console.log(brr[i])
}
然后就是效果图
