改变原数组的方法
- push（） 在数组末尾添加一个或者多个新元素并返回数组的长度
const arr = [1, 2, 3]
//res= arr.push(4)
res= arr.push(4, 5, 6)
console.log(arr);//[1,2,3,4,5,6]
console.log(res);//6
- pop（） 删除数组最后一个元素,并返回删除的元素，如果数组为空则返回undefined
var arr = [10, 20, 30, 40]
res = arr.pop()
console.log(arr);//[10,20,30]
console.log(res);//40
- unshift（） 在数组前面添加一个或多个元素,并返回新元素的长度
var arr = [10, 20, 30, 40]
res = arr.unshift(99)
// res = arr.unshift(99,11,12)
console.log(arr);//[99,10,20,30,40]
console.log(res);//5
- shift（） 删除原数组的第一项，并返回删除元素的值，如果原数组为空则返回undefined
var arr = [10, 20, 30, 40]
res = arr.shift()
console.log(arr);[20, 30, 40]
console.log(res); 10
- splice（） 截取数组 返回值是一个新数组
//splice(删除下标,删除个数,新增内容(可选))
//splice() 语法一
var arr = [2, 63, 48, 5, 4, 75]
res = arr.splice(1, 2)
console.log(arr); // [2, 5, 4, 75]
console.log(res); // [63, 48]
//******************************
//splice() 语法二
var arr = [2, 63, 48, 5, 4, 75]
res = arr.splice(1, 1, 99999, 88888)
console.log(arr); // [2, 99999, 88888, 48, 5, 4, 75]
console.log(res); // [63]
- sort（） 排序
var arr = [2, 63, 48, 5, 4, 75, 69, 11, 23]
arr.sort()
console.log(arr); // [11, 2, 23, 4, 48, 5, 63, 69, 75]
arr.sort(function (a, b) { return (a - b) })
console.log(arr); // [2, 4, 5, 11, 23, 48, 63, 69, 75]
arr.sort(function (a, b) { return (b - a) })
console.log(arr); // [75, 69, 63, 48, 23, 11, 5, 4, 2]
- reverse()翻转数组
var arr = [10, 20, 30, 40]
res = arr.reverse()
console.log(arr);//[40,30,20,10]
console.log(res);//[40,30,20,10]
不改变原数组的方法
- concat():可以将两个数组合并在一起，如果是使用ES6语法也可以用扩展运算符…来代替
var arr = [10, 20, 10, 30, 40, 50, 60]
res = arr.concat(20, "小敏", 50)
console.log(arr); // [10, 20, 10, 30, 40, 50, 60]
console.log(res); // [10, 20, 10, 30, 40, 50, 60, 20, "小敏", 50]
let c = [1,2,3,4,5];
let d = [6,7,8,9];
let e = a.concat(b);
let f = [...a, ...b];
// 使用 ...
console.log(e);// [1,2,3,4,5,6,7,8,9]
console.log(f);// [1,2,3,4,5,6,7,8,9]
- slice(start,end):可以截取出数组某部份的元素为一个新的数组，有两个必填的参数，第一个是起始位置，第二个是结束位置(包含开始索引不包含结束索引)
var a = [1,2,3,4,5,6];
var b = a.slice(2,5);
console.log(a)//[1,2,3,4,5,6]
console.log(b)//[3,4,5]
- join("任意分隔符"):将数组的元素组起一个字符串，不写分割符号的话就是默认的，号隔开
let a = [1, 2, 3, 4, 5];
let b = a.join();
console.log(a); //[1, 2, 3, 4, 5]
console.log(b); //1,2,3,4,5
let c =a.join("|")
console.log(c)//1|2|3|4|5
- filter()将数组进行过滤，返回一个新的数组，不改变原数组
let a = [1, 2, 3, 4, 5, 6, 7, 8];
let b = a.filter(i => i > 3);
console.log(a); //[1, 2, 3, 4, 5, 6, 7, 8]
console.log(b); //[4, 5, 6, 7, 8]
- find():会将数组中的元素遍历并且做判断，并会返回第一个符合判断条件的元素，如果没有元素符合则会返回undefined
let a = [1,2,3,4,5,6,7,8];
console.log(a.find(i => i > 3)); // 4
console.log(a.find(i => i < 0)); // undefined
- includes():会判断数组中是否包含某个值，如果有包含就返回true，否则返回false，有两个参数，第一个参数表示要判断的值( 必填)，第二个参数表示从数组的哪个位置开始判断( 选填)
let a = [1, 2, 3, 4, 5, 6, 7, 8];
console.log(a.includes(2));// true
console.log(a.includes(2, 2));// false
- indexOf():会判断数组中是否包含某个值(从左到右)，如果有包含就返回这个值在数组中第一个元素的索引值，如果没有就返回-1，有两个参数，第一个参数表示要判断的值( 必填)，第二个参数表示从数组的哪个位置开始判断( 选填，预设为0 )。
//indexOf 语法一
var arr = [10, 20, 10, 30, 40, 50, 60]
res = arr.indexOf(10)
console.log(arr) // [10, 20, 10, 30, 40, 50, 60]
console.log(res); // 0
//indexOf 语法二
var arr = [10, 20, 10, 30, 40, 50, 60]
res = arr.indexOf(10, 1)
console.log(arr)// [10, 20, 10, 30, 40, 50, 60]
console.log(res);// 2
- lastIndexOf():会判断数组中是否包含某个值(由右而左)，如果有包含就返回这个值在数组中第一个元素的索引值，如果没有就返回-1，这个方法有两个参数，第一个参数表示要判断的值( 必填)，第二个参数表示判断从数组的哪个位置开始从右往左查找( 选填，默认为整个数组长度-1 )。
//lastIndexOf 语法一
var arr = [10, 20, 10, 30, 40, 50, 60]
res = arr.lastIndexOf(50)
console.log(arr) // [10, 20, 10, 30, 40, 50, 60]
console.log(res); //5
//lastIndexOf 语法二
var arr = [10, 20, 10, 30, 40, 50, 60]
res = arr.lastIndexOf(50, 4)
console.log(arr) // [10, 20, 10, 30, 40, 50, 60]
console.log(res); // -1
- findIndex():会将数组中的遍历并左判断，并会返回第一个符合判断条件元素的位置索引，如果没有元素符合则会返回-1。
let a = [1,2,3,4,5,6,7,8];
console.log(a.findIndex( i => i > 3)); // 3
console.log(a.findIndex(i => i < 0)); // -1
- reduce(function (prev, item, index, arr) { }, 初始值) 累加器，用来累加数组中的元素求和
var arr = [1, 2, 3, 4, 5]
var res = arr.reduce(function (prev, item) {
return prev *= item
}, 1)
console.log(arr);// [1, 2, 3, 4, 5]
console.log(res);//120
- some():遍历素组只要其中一个满足条件就会返回true,反之false
let a = [1, 2, 3, 4, 5, 6];
console.log(a.some(i => i > 3));
// 返回 true，因为 4、5、6 大于 3
console.log(a.some(i => i > 6));
// 返回 fasle，因为全都小于或等于 6
原数组是否改变：如果是通过值类型的方式修改，则不会改变，如果通过下标的方式或者通过引用类型的方式修改，则原数组可能会发生变化；注意返回值的情况，如果返回值为true，则会中断整个循环，导致后续的数组项不会继续执行。
var arr1 = [
{name:'鸣人',age:16},
{name:'佐助',age:17}
];
var arr2 = [1,2,3];
var aa=arr1.some((item)=>{item.age=item.age+1})
// some 方法--- 用法1 只要回调函数返回了true 则返回true 否则返回false
const someArray1 = [10, 20, 30, 40];
const someRet = someArray1.some(item => item > 21)
console.log('some的someArray1结果', someRet);
console.log('some的someArray1原有数组', someArray1)
// some 方法--- 用法2 通过修改下标的方式修改原有数组
const someArray2 = [20, 40, 60, 80];
const someRet1 = someArray2.some((item, index) => someArray2[index] = item + 1)
console.log('some的someArray2结果', someRet1);
console.log('some的someArray2原有数组', someArray2)
// some 方法--- 用法3 回调函数如果返回false 则循环会立刻终止
const someArray3 = [120, 140, 160, 180];
const someRet3 = someArray3.some((item, index) => {
console.log(`【前】index是${index}`);
if (index === 2) {
return false
}
console.log(`【后】index是${index}`);
return true
})
console.log('some的someArray3结果', someRet3);
console.log('some的someArray3原有数组', someArray3);
- every():会将素组进行遍历，只要其中一个元素不满足要求就会返回false,反之全部符合就会返回ture
let a = [1,2,3,4,5,6];
console.log(a.every(i => i > 3));
// fasle ( 因为1、2 小于 3，3 等于 3 )
console.log(a.every(i => i > 0));
// true
原数组是否改变：如果是通过值类型的方式修改，则不会改变，如果通过下标的方式或者通过引用类型的方式修改，则原数组可能会发生变化；注意返回值的情况，如果返回值为false，则会中断整个循环，导致后续的数组项不会继续执行。
var arr1 = [
{name:'鸣人',age:16},
{name:'佐助',age:17}
];
var arr2 = [1,2,3];
var aa=arr1.every((item)=>{item.age=item.age+1})
// every 方法--- 用法1 如果所有都满足条件就返回true 否则返回false
const everyArray1 = [10, 20, 30, 40];
const everyRet = everyArray1.every(item => item > 21)
console.log('every的everyArray1结果', everyRet); // false
console.log('every的everyArray1原有数组', everyArray1);// [10, 20, 30, 40];
// every 方法--- 用法2 通过修改下标的方式修改原有数组
const everyArray2 = [20, 40, 60, 80];
const everyRet1 = everyArray2.every((item, index) => everyArray2[index] = item + 1)
console.log('every的everyArray2结果', everyRet1);//true
console.log('every的everyArray2原有数组', everyArray2);//[21, 41, 61, 81]
// every 方法--- 用法3 回调函数如果返回false 则循环会立刻终止
const everyArray3 = [120, 140, 160, 180];
const everyRet3 = everyArray3.every((item, index) => {
console.log(`【前】index是${index}`);
if (index === 2) {
return false
}
console.log(`【后】index是${index}`);
return true
})
console.log('every的everyArray3结果', everyRet3);
console.log('every的everyArray3原有数组', everyArray3);// [120, 140, 160, 180]
- forEach(function (item, index, arr) { }) 循环遍历数组每个元素（没有返回值） 如果真的说要有返回值就是undefined
var arr = [1, 2, 3, 4, 5]
var res = arr.forEach(function (item, index, arr) {
console.log(item, "------", index, "-------", arr);
})
console.log(arr);// [1, 2, 3, 4, 5]
console.log(res); // undefined
原数组是否改变：如果是通过值类型的方式修改，则不会改变，如果通过下标的方式或者通过引用类型的方式修改，则原数组会发生变化；
var arr1 = [
{name:'鸣人',age:16},
{name:'佐助',age:17}
];
var arr2 = [1,2,3];
arr1.forEach(item => {
item.age = item.age + 1}
);
//=> [{name:'鸣人',age:17},{name:'佐助',age:18}]
arr2.forEach(item => {
item = item * 2}
)
// => [1,2,3]
// forEach 方法---不是通过下标的修改方式
const forEachArray1 = [10, 20, 30, 40];
const forEachRet = forEachArray1.forEach(item => item + 1)
console.log('forEach的forEachArray1结果', forEachRet);// undefined
console.log('forEach的forEachArray1原有数组', forEachArray1);// [10, 20, 30, 40]
// forEach 方法---通过修改下标的方式
const forEachArray2 = [20, 40, 60, 80];
const forEachRet1 = forEachArray2.forEach((item, index) => forEachArray2[index] = item + 1)
console.log('forEach的forEachArray2结果', forEachRet1);// undefined
console.log('forEach的forEachArray2原有数组', forEachArray2); // [21, 41, 61, 81]
- map(function (item, index, arr) { }) 循环遍历数组每个元素并返回新数组
var arr = [1, 2, 3, 4, 5]
var res = arr.map(function (item) {
return item * 1000
})
console.log(arr); // [1, 2, 3, 4, 5]
console.log(res); // [1000, 2000, 3000, 4000, 5000]
原数组是否改变：如果是通过值类型的方式修改，则不会改变，如果通过下标的方式或者通过引用类型的方式修改，则原数组会发生变化；
var arr1 = [
{name:'鸣人',age:16},
{name:'佐助',age:17}
];
var arr2 = [1,2,3];
var aa=arr1.map((item)=>{item.age=item.age+1})
// map 方法---不是通过下标的修改方式
const mapArray1 = [10, 20, 30, 40];
const mapRet = mapArray1.map(item => item + 1);
console.log('map的结果--有返回值', mapRet); // [11, 21, 31, 41]
console.log('map的原有数组--无变化', mapArray1); // [10, 20, 30, 40]
// map方法---通过修改下标的方式
const mapArray2 = [20, 40, 60, 80];
const mapRet2 = mapArray2.map((item, index) => {
mapArray2[index] = item + 1;
return item
});
console.log('map的mapArray2结果', mapRet2); // [20, 40, 60, 80]
console.log('map的mapArray2原有数组', mapArray2); // [21, 41, 61, 81]
