数组在javaScript中是一个引用值，下面列举在学习中遇到的一些数据常用方法
1. 改变原数组
push(), pop(), shift(), unshift(), sort(), reverse(), splice()
2. 不改变原数组
concat(), join(), split(), toSting(), slice()
下面就一一介绍这些方法的使用
1. push
push就是从数组的最后面加入新的元素
var arr = [1,2,3,4];
arr.push(5);
console.log(arr);//[1,2,3,4,5]
//原数组改变成了 [1,2,3,4,5]
2. pop
pop与push相反是删除数组中的最后一个元素,可以联想到内存中压栈(push),出栈(pop)
var arr = [1,2,3,4];
arr.pop();
console.log(arr);//[1,2,3]
3.shift
shift 从数组的第一位开始删除元素
var arr = [1,2,3,4];
arr.shift();
console.log(arr);[2,3,4]
4. unshift
在数组的第一位之前加入元素
var arr = [1,2,3,4];
arr.unshift(0);
console.log(arr);//[0,1,2,3,4]
5. sort
sort可以将无序数组进行排序,sort()的默认排序是按照 ** ASCII升序** 进行排序的,但是系统内部提供了一个接口可以让** 用户自定义排序 **
//默认排序 升序
var num = [10,0,2,9,"a","A","z","T","你"];
var hadSort = num.sort();
console.log(hadSort);//[0, 10, 2, 9, "A", "T", "a", "z", "你"];
//设置倒序输出
var hadSort = num.sort().reverse();
console.log(hadSort);//["你", "z", "a", "T", "A", 9, 2, 10, 0]
用户自定义排序:
- 必须有两个参数
- 看返回值
- 当返回值为负数的时候,那么前面的数放在前面
- 返回值为正数的时候,后面的数移动到前面去
- 返回值为0不动
var arr = [5,8,1,5,2,7,4,1,3];
var newArr = arr.sort(function(a, b){
if(a - b > 0){
return 1;
}else if(a - b < 0){
return -1;
}else{
return 0;
}
})
console.log(newArr) //[1, 1, 2, 3, 4, 5, 5, 7, 8]
//观察上面式子其实可以简单书写
//因为无论a-b如何比较,都是返回a-b的值那么函数可以改写
var newArr = arr.sort(function(a, b){
return a - b;
})
// 当然如果是要降序的话可以使用 reverse()方法,或者return b -a
给一个数组随机乱序排列
var arr = [1,4,7,8,5,2]
arr.sort(function(a, b){
return Math.random()-0.5;//返回的是-0.5 ---- 0.5之间的数
})
6. reverse
就是倒置数组，将数组内容倒置输出
var arr = [1,2,3,4,5]
console.log(arr.reverse()); //[5, 4, 3, 2, 1]
7.splice
splice("第几位开始(-1是倒着数的第一位(不是倒着数的第0位))","截取多少长度(可以为0)","在切口处添加新的数据")
var arr = [2,5,4,2,5];
var newArr1 = arr.splice(2,3,5,0,0,0,0,0);
console.log(arr); //[2, 5, 5, 0, 0, 0, 0, 0]
console.log(newArr1);//[4, 2, 5]; //这类似于剪切,返回了剪切的值
var arr = [2,5,4,2,5];
var newArr2 = arr.splice(-1,0,"你好");
console.log(arr); //[2, 5, 4, 2, "你好", 5]
console.log(newArr2);//[]
concat
连接两个数组
var arr1 = [1,2,3];
var arr2 = [4,5,6];
var newArr = arr1.concat(arr2);
console.log(newArr)//[1, 2, 3, 4, 5, 6]
console.log(arr1)//[1,2,3] 原数组没有改变
其实连接两个数组有很多方法:
1. call/apply 改变this指向
var arr1 = [1,2,3];
var arr2 = [4,5,6];
var newArr = Array.apply(arr1,[arr2,arr1]).join(",").split("-");
console.log(newArr)//[4,5,6,1,2,3]
var newArr2 = Array.call(arr1,arr1,arr2).join(",").split("-");
console.log(newArr2)//[1,2,3,4,5,6]
2. 使用es6语法 ...扩展运算符
let arr1 = [1,2,3]
let arr2 = [4,5,6]
let arr = [...arr1,...arr2]
8.join
返回一个字符串
var arr = ["加","油","不","放","弃"];
console.log(arr.join("-")); "加-油-不-放-弃"
9. split
split() 方法用于把一个字符串分割成字符串数组
var arr = ["加","油","不","放","弃"];
console.log(arr.join("-")); "加-油-不-放-弃"
var newArr = arr.join("-");
console.log(newArr.split());//["加-油-不-放-弃"]
console.log(newArr.split(""));//["加", "-", "油", "-", "不", "-", "放", "-", "弃"]
console.log(newArr.split("-"))//["加", "油", "不", "放", "弃"]
10.toString
toString() 方法可把一个逻辑值转换为字符串，并返回结果
var arr = [1,2,3,4,5];
var str = arr.toString();
console.log(str)//1,2,3,4,5
typeof(str); //String
11.slice
截取字符串 slice("从该位开始截取(包含)","截取到该位(改位不截取,不包含)"),一个参数,从第n位开始一直到列表的最后的一位,规定从何处开始选取。如果是负数，那么它规定从数组尾部开始算起的位置。也就是说，-1 指最后一个元素，-2 指倒数第二个元素，以此类推。不能整个截取
var arr = [1,2,3,4,5,6];
var newArr = arr.slice(2,4);
console.log(arr);//[1, 2, 3, 4, 5, 6];
console.log(newArr);//[3, 4];
var newArr1 = arr.slice(-1);
ES6新增方法
map() 映射, reduce()汇总, filter()过滤, forEach()迭代
1. map
1.
var arr = [4,5,8,6];
var newArr= arr.map((item)=>{
return item
})
console.log(newArr)//[4, 5, 8, 6]
2.
var arr = [88,70,14,55,78,99];
var newArr = arr.map((item)=>{
if(item>60){
return "及格";
}else{
return "不及格";
}
})
console.log(newArr);//["及格", "及格", "不及格", "不及格", "及格", "及格"]
3.
var arr = [1,2,3,4,5,6]
var newArr = arr.map((item)=>{
return item*2;
})
相当于=>
var arr = [1,2,3,4,5,6]
function fx(x){
return x*x
}
var newArr = arr.map(fx);
console.log(newArr) //[1, 4, 9, 16, 25, 36]
2.reduce
- reduce() 方法接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值。
- reduce() 可以作为一个高阶函数，用于函数的 compose。
- 注意: reduce() 对于空数组是不会执行回调函数的。
arr.reduce(callback,[initialValue])
* callback （执行数组中每个值的函数，包含四个参数）
* previousValue （第一项的值或者上一次叠加的结果值，或者是提供的初始值（initialValue））
* currentValue （数组中当前被处理的元素）
* index （当前元素在数组中的索引）
* array （数组本身）
* initialValue （作为第一次调用 callback 的第一个参数，可以控制返回值的格式）
var arr = [1,2,3,4];
var result = arr.reduce((pre,item,index,array)=>{
console.log(pre,item,index);
return pre + item;
})
console.log(result);
//1 2 1
//3 3 2
//6 4 3
//10
如果有个初始值,第一次调用callback的参数存在
var arr = [1,2,3,4];
var result = arr.reduce((pre,item,index,array)=>{
return pre + item;
},100)
console.log(result); //110
3. filter
添加过滤条件得到想要的
var num = [1,88,2,9,2,7,7];
var result = num.filter((item)=>{
if(item%2==0){
return item;
}
})
console.log(result)//[88,2,2]
4.forEach
forEach() 方法用于调用数组的每个元素，并将元素传递给回调函数。注意: forEach() 对于空数组是不会执行回调函数的
var books = ["乱世佳人","飘","傲慢与偏见","老人与海"];
var index1 = [];
var items = [];
var bookList = books.forEach((item,index)=>{
items.push(item);
index1.push(index);
})
console.log(items);["乱世佳人", "飘", "傲慢与偏见", "老人与海"]
console.log(index1);[0, 1, 2, 3]