array方法
2020-05-14 本文已影响0人
回忆不死我们不散
JS数组（every、some、filter、forEach、map、reverse、sort、indexOf、lastindexOf方法）
reverse方法
JavaScript中数组的reverse()方法用于将数组倒序输出，并且改变了原数组，并且返回的也是新数组。
var arr=["8",3,5,6,"a","s"];
var con=arr.reverse();
console.log(arr); //结果为：["s","a",6,5,8,3,8]
console.log(con); //结果为：["s","a",6,5,8,3,8]
sort方法
JavaScript中数组的sort()方法用于对数组进行排序，如果不写任何参数，sort是按照字符串排序的，也就是ascII码排序，sort方法会改变原数组，并且返回改变后的新数组。
var arr=[1,2,10,14,21,3];
var con=arr.sort();
console.log(arr); //结果为：[1,10,14,2，21,3]
console.log(con); //结果为：[1,10,14,2，21,3]
使用sort方法还可以让数组的元素按照数字的大小进行排序，此时sort方法中需要传入一个参数，并且是一个函数，函数有两个形参，a，b，其中a是数组的第二个元素，b是数组的第一个元素。
var arr=[3,5,11,3,5,67,8,4,14];
// sort中传递一个函数,每次函数会拿两个值进行比较
arr.sort(function (a,b) {
//第一次a是5 b是3
console.log(a);
return a-b //否则为正就是升序，也就是说如果返回值为正数则是升序
})
indexof和lastIndexOf方法
JavaScript中数组的indexof()和lastIndexOf()方法用于检测某个值是否在数组中出现，如果没有没有则返回-1,如果有则返回第一个检测到的下标，然后停止继续检测，indexof()由数组的前向后找，lastIndexOf()由数组的后面往前找，这两个方法都不会改变原数组。
一个参数的情况：
var arr=[1,3,5,7,6,34,23,6,6,6,3,6];
var num1=18;
var num2=6;
var num1=arr.indexOf(num1); //检测这个数组中是否有18这个数
var num2=arr.indexOf(num2); //检测这个数组中是否有6这个数
console.log(num1); //结果为：-1
console.log(num2); //结果为：4
两个参数的情况：
arr.indexOf(num1,5)中有两个参数，其中第一个参数num1则是需要检测的值，5则是检测的起始下标,，但是检测到的元素下标仍然是在原数组中的下标，不会改变。
var arr=[1,3,5,7,6,34,23,6,6,6,3,6];
var num1=6;
var isHas=arr.indexOf(num1,5);
console.log(isHas); //结果为：7
every和some方法
JavaScript中数组的every()方法用于检测数组的元素是否全都满足定义的条件，遇到一个元素不满足则返回false，并且停止遍历，并且every返回false，也就是一假即假。
some方法和every用法类似，只是some方法中只要有一个元素满足条件则返回true，也就是一真即真。
两个方法的参数都是一个函数，函数中有三个参数，item,index,arr，参数名可以自定义，但是建议使用以上三个参数名，其中第一个参数item表示数组中的元素值，第二个参数index表示元素的下标，第三个参数arr则表示原数组。这两个方法都不会改变原数组。
// 检测你得到的年龄是否有小于18岁，那么就进入未成年模式，否则提示进入成年模式
// some是一真即真
var arr=[18,18,19,18,21,23,22,25,26];
var isPerson=arr.some(function (item,index,arr) {
// 只要有一个返回真，则停止判断
return item<18
})
if (isPerson){
alert("未成年");
}else{
alert("成年");
}
filter方法
JavaScript中数组的filter()方法用于过滤元素，如果满足条件则将该元素添加到新的数组中并返回新的数组，该方法不会改变原数组。
var arr=[
{name:"jiaxing",age:19},
{name:"lipeihua",age:2},
{name:"laozhang",age:38},
{name:"laoliu",age:11},
{name:"laowang",age:58},
]
var newArr=arr.filter(function (item,index,arr) {
return item.age<18;
})
console.log(newArr);
forEach和map方法
forEach和map这两个方法都可以用于遍历数组，在默认情况下都不会改变原数组，可根据个人的需求使用这两种方法遍历的同时改变原数组。不同的是forEach没有返回值，map方法则是有返回值的，在默认情况下，也就是没有通过return语句定义返回数值时，每遍历一个则添加一个undefined到新数组中，并返回新的数组。
var arr=[18,18,19,18,21,23,22,25,26];
var mapReturn=arr.map(function (item,index,arr) {
// 对数组的每一项应用给定条件，返回新的数组
//map的返回值是一个新数组，每次循环进来都对每一项操作，然后需要return出去，就只给给到新数组对应的值了
return item+1;
})
数组常用方法
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<h2>请按F12</h2>
</body>
</html>
<script>
// 返回数组长度
var str = [1, 5, 5, 63, 4, 5, 5];
console.log(str.length);
// push 向数组的末尾添加一个或更多元素，并返回新的长度
const a = [1, 2, 3, 4];
const aa = a.push(2);
console.log("数组的新长度" + aa);
console.log("新数组" + a);
// unshift 向数组的开头添加一个或更多元素，并返回新的长度
const b = [2, 5, 6, 7, 8];
const bb = b.unshift(3);
console.log("数组新长度" + bb);
console.log("新数组" + b);
// pop 删除数组的最后一个元素返回删除的元素
const c = [1, 2, 5, 4, 8, 4, 6, 5];
const cc = c.pop();
console.log("删除元素是" + cc);
console.log("新数组" + c);
// shift 删除并返回数组的第一个元素
const d = [1, 2, 3, 4, 5, 6];
const dd = d.shift();
console.log("删除的元素是" + dd);
console.log("新数组" + d);
// reverse 反转数组的元素顺序
const e = [1, 2, 3, 4, 5];
const ee = e.reverse();
console.log("反转的数组为" + ee);
console.log("原数组为" + e);
// find 返回符合传入测试（函数）条件的数组元素
const f = [1, 2, 3, 4, 5];
get = num => {
return num > 3;
// 这里接判断符号
};
const ff = f.find(get); // 函数要放在前面
console.log("比3大的第一个元素是" + ff);
// findIndex 返回符合传入测试(函数)条件的数组元素索引(下标)
const g = [1, 2, 3, 4, 5];
set = num => {
return num == 2;
// 如果要查找2的位置，应该用 == 来进行判断，是否等于2，是的话返回坐标
};
const gg = g.findIndex(set);
console.log("2的第一个在数组gg里的坐标为" + gg);
// slice 选取数组的一部分，并返回一个新数组
const h = [1, 2, 3, 4, 5, 6];
console.log("截取坐标0到4的数组" + h.slice(0, 4));
// 这里不包含坐标为4的数值
const hh = ["a", "b", "c", "d"];
console.log("读取左边1和3的两个字符串" + hh.slice(1, 3));
// 注意是不包含后面那个坐标的
//splice 从数组中添加或删除元素
const i = [1, 2, 3, 4, 5, 6];
const num = i.splice(1, 0, "7");
console.log("i.splice(1, 0, '7'):在坐标为1的地方添加7:" + i);
i.splice(3, 1);
console.log("i.splice(3,1):在坐标为3的地方删除一个数:" + i);
// join 把数组的所有元素放入一个字符串
const j = [1, 2, 3, 4, 5];
const stre = j.join();
console.log(stre);
// forEach 迭代数组
const k = [1, 2, 3, 4, 5];
fun = (item, index) => {
console.log("index" + index + ":" + item);
};
k.forEach(fun);
// 遍历数组
// map 通过指定函数处理数组的每个元素，并返回处理后的数组
const l = [1, 2, 3, 4, 5, 6];
sum = num => {
return (num += 1);
console.log("每项+1:" + num);
};
l.map(sum);
// 不难发现，不管什么函数都需要返回值才能在外部生效
// filter 过滤 检测数值元素，并返回符合条件所有元素的数组
const m = [1, 2, 3, 5, 4, 8];
bi = num => {
return num > 2;
};
const mm = m.filter(bi);
console.log("比2大的所有元素的数组为:" + mm);
// indexOf 搜索数组中的元素，并返回它所在的位置
const n = [1, 2, 3, 5, 4, 6];
console.log("2在数组里面的位置为:" + n.indexOf(2));
// includes 判断一个数组是否包含一个指定的值
const o = [1, 5, 3, 6, 4, 7, 5];
console.log("判断数组是否包含o:" + o.includes(o)); //false
// isArray 判断对象是否为数组
const p = [1, 2, 4, 5, 6, 3, 4];
console.log("判断是否是数组" + Array.isArray(p)); // true
// concat 连接两个或更多的数组，并返回结果
const sums = a.concat(b, c);
console.log("a、b、c三个数组连接" + sums);
// sort 对数组的元素进行排序
console.log("对数组sums排序:" + sums.sort());
//数组转化为对象
var fruits = ['1','pp'];
var fruitsObj = {...fruits};
console.log(fruitsObj);
function arrayToObj(arr){
var obj = {};
for(var i = 0; i < arr.length; i++){
obj[i] = arr[i];
}
}
//或者
function arrayToObj(arr){
return Object.assign({},arr);
}
</script>
