[问题探讨]js数组(Array)方法汇总3/3

需求：

js数组(Array)方法汇总

索引：

对数组方法的学习和汇总，分为三大类：

一，改变原数组的方法(10种)---1/3点此跳转对应链接：

1，arr[key]='tom';

2，arr.splice();

3，arr.reverse();

4，arr.sort();

5，arr.push();

6，arr.pop();

7，arr.unshift();

8，arr.shift();

9，arr.fill();

10，arr.copyWithin();

二，不动原数组，只产生新数据的方法(14种)---2/3点此跳转到对应链接：

1，arr.concat();

2，arr.slice();

3，arr.join();

4，arr.toString();

5，arr.map();

6，arr.filter();

7，arr.reduce()和arr.reduceRight();

8，arr.find();

9，Array.from();

10，Array.of();

11，Object.keys(arr);

12，arr.values();

13，arr.keys();

14，arr.entries();

三，不动原数组，只依据原数组进行判断/处理的方法(10种)---3/3本文阐述：

1，arr.forEach()---遍历;

2，for()---遍历;

3，for...of....---遍历;

4，for...in...---遍历;

5，...(spread);

6，arr.indexOf()||arr.lastIndexOf();

7，arr.every()||arr.some();

8，Array.isArray();

9，arr.includes();

10，arr.findIndex();

正文:

三，不动原数组，只依据原数组进行判断/处理的方法

1，arr.forEach()

(1)作用：遍历数组，为每个元素调用指定的函数；

(2)语法：arr.forEach(function(item,index,arr){arr[index]=item+1;});

(3)语法解释：item指代元素，index指代下标，arr指代数组本身；

(4)返回值：undefined；

(5)示例代码：

// 示例1.1
const arr=[1,2,3,4,5,6,7,8,9];
let sum=0;
const res=arr.forEach((item)=>{sum+=item});
console.log(res)；// undefined
console.log(sum);// 45

// 示例1.2
const res1=arr.forEach((item,index,arr)=>{arr[index]=item+1})
console.log(res1)；// undefined
console.log(arr);// [2, 3, 4, 5, 6, 7, 8, 9, 10]

// 示例1.3
const res2=arr.forEach((item)=>{return item+1});
console.log(res2);// undefined

// 示例2
let arr2=[];
arr.forEach((item,index)=>{arr2[index]=item+1});
console.log(arr2);// [2, 3, 4, 5, 6, 7, 8, 9, 10]

2,for

(1)作用：遍历数组；

(2)语法：for(let key=0;key<arr.lenth;key++){};

(3)语法解释：arr指代某个数组；

(4)返回值：无；

(5)示例代码：

const arr=[1,2,3,4,5,6,7,8,9];
for(let key=0;key<arr.length;key++){
  console.log(arr[key]);
}
// 1
// 2
// 3
// 4
// 5
// 6
// 7
// 8
// 9

3,for...of...

(1)作用：遍历数组；

(2)语法：for(let item of arr){};

(3)语法解释：arr指代数组，item指代数组的元素；

(4)返回值：无；

(5)示例代码：

const arr=[1,2,3,4,5,6,7,8,9];
for(let item of arr){
  console.log(item)
}
// 1
// 2
// 3
// 4
// 5
// 6
// 7
// 8
// 9

4,for...in...

(1)作用：遍历数组；

(2)语法：for(let key in arr){};

(3)语法解释：arr指代数组，key指代数组的下标；

(4)返回值：无；

(5)示例代码：

const arr=[1,2,3,4,5,6,7,8,9];
for(let item of arr){
  console.log(item)
}
// 1
// 2
// 3
// 4
// 5
// 6
// 7
// 8
// 9

5,...(spread)

(1)作用：如果函数需要传入多个参数值，但是给定的参数却是数组，函数无法处理时，可以用...实现数组的打散和逐个分配；

(2)语法：function computed(arr){};let arr=[1,2,3];computed(...arr);

(3)语法解释：arr指代某个数组；

(4)返回值：无；

(5)示例代码：

const arr=[1,2,3,4,5,6,7,8,9];
console.log(...arr);// 1 2 3 4 5 6 7 8 9 
const res=Math.min(...arr);
console.log(res);// 1
// 分解步骤
function getMin(){
  const arrLike=arguments;
  let min;
  for(let key in arrLike){
    if(key===0){
      min=arrLike[key]
    }else{
      min=min<=arrLike[key]?min:arrLike[key];
    }
  }	
  return min;
}
const res1 = getMin(...arr);
console.log(res1);// 1

6,arr.indexOf()

(1)作用：搜索整个数组中是否有给定的值；

(2)语法：arr.indexOf(n) || arr.lastIndexOf(n);

(3)语法解释：n代表某个元素值；

(4)返回值：返回找到的第一个元素的索引，如果没找到，返回-1；indexOf从前往后找，lastIndexOf从后往前找；

(5)示例代码：

const arr=['tom','jery','tom','jack'];
const res1=arr.indexOf('tom');
console.log(res1);// 0
const res2=arr.lastIndexOf('tom')
console.log(res2);// 2
const res3=arr.indexOf('kity')
console.log(res3);// -1

7,arr.every()和arr.some()

(1)作用：对数组元素应用指定的函数进行判定，判定是否符合条件；

(2)语法：arr.every(function(item){return item<n}),arr.some(function(item){return item<n});

(3)语法解释：<n是某判断条件；every要求所有元素符合条件，some只要求最少有一个元素符合要求

(4)返回值：返回true或者false；

(5)示例代码：

const arr=[1,2,3,4,5,6,7,8,9];
const res=arr.every((item)=>{return item<10});
console.log(res);// true
const res1=arr.every((item)=>{return item<8});
console.log(res1);// false
const res2=arr.some((item)=>{return item <8});
console.log(res2);// true
const res3=arr.some((item)=>{return item >10});
console.log(res3);// false

8，Array.isArray()

(1)判断一个数据是否是数组格式；

(2)语法：Array.isArray();

(3)语法解释：n是一个待判断的数据；

(4)返回值：布尔值；

(5)示例代码：

const data1=[1,2,3,,4,5,6];
const data2={name:'tom',age:30};
const data3='tom';
const res1=Array.isArray(data1);
console.log(res1);// true
const res2=Array.isArray(data2);
console.log(res2);// false
const res3=Array.isArray(data3);
console.log(res3);// false

9,arr.includes()

(1)作用：判断一个数组中是否包含一个指定的值；

(2)语法：arr.includes(n);

(3)语法解释：n某个指定的值；

(4)返回值：布尔值；

(5)示例代码：

const arr=['中国','日本','韩国'];
const res1=arr.includes('中国');
console.log(res1);// true
const res2=arr.includes('china');
console.log(res2);// false

10,arr.findIndex();

(1)作用：判断数组内是否有符合条件的元素，并返回这个元素的下标；

(2)语法：arr.findIndex(function(item,index,arr){return item<9});

(3)语法解释：item数组元素，index数组下标，arr数组本身；

(4)返回：返回数组内通过判断的第一个元素的下标,若找不到返回-1；空数组不执行函数；

和arr.indexOf(n)的区别：indexOf直接检查某个数组是否包含某个元素，findIndex是判断数组内是否有符合条件的元素，后者功能更丰富，但是前者更简洁；另外，借助Object.is后者可以判断NaN，前者不可以。

(5)示例代码：

const arr=[1,2,3,4,5,6,7,8,9];
const res=arr.findIndex((item)=>{return item<4})
console.log(res);// 0
const arr1=[{name:'tom',age:30},{name:'jery',age:35}];
const res1=arr1.findIndex((item)=>{return item.name==='tom'});
console.log(res1);// 0
const res2=arr1.findIndex((item)=>{return item.name==='tomBro'});
console.log(res2);// -1
// indexOf方法不能判定NaN
const res3=[NaN].indexOf(NaN);
console.log(res3);// -1
// finIndex借助Object.is方法可以判断NaN
const res4=[NaN].findIndex(y => Object.is(NaN, y));
console.log(res4);// 0

博文通览提示：

点击此超链接跳转到Tom哥的博文分类和索引页面 Tom哥的博客博文分类和索引页面地址：https://blog.csdn.net/tom_wong666/article/details/84137820