JavaScript操作数组的技巧总结-优快云博客

本文链接：https://blog.youkuaiyun.com/huanglujian886/article/details/126590735

这篇博客详细介绍了JavaScript中操作数组的26种方法，包括查找最大/最小值、定位元素、includes()检查包含、join()转为字符串、slice()截取、concat()合并以及增删操作等。这些方法对理解和提升JavaScript数组处理能力非常有帮助。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1、获得最大/最小值

const arr = [1, 2, 3, 4, 5, 6]
console.log(Math.max(...arr))       //   6
console.log(Math.min(...arr))       //   1

2、获取某个元素在数组当中的某个位置

// indexOf 获取某个元素在数组当中的某个位置; 也适用于字符串 slice includes
  const arr = [1, 2, 3, 4, 2, 6]
  console.log(arr.indexOf(4))         // 3
  console.log(arr.lastIndexOf(2))     // 4

3、includes( ) 包括则返回一个布尔值

// includes 包含；包括 返回一个布尔值
const arr = [1, 2, 3, 4, 2, 6]
console.log(arr.includes(1))     // true

4、join( ) 将数组转换为字符串

// join() ：将数组转换为字符串 
const arr = [1, 2, 3, 4, 2, 6]
console.log(arr.join('-'))       // 返回 字符串 ， 并用 '-' 串联在一起

5、slice（）截取数组

注意：返回选定的元素组成的新数组，且该方法不会修改原数组。

括号里（）装的是开始位置的索引，结束位置后面一个的索引

// slice 可以截取某一个片段 
// 参数给0 ，表示什么都不截取，拷贝一份
// 开始位置(表示从哪里开始取)，结束位置的索引
const arr = [1, 2, 3, 4, 5, 6]
console.log(arr.slice(1, 3))   // [2, 3]
console.log(arr)     //  [1, 2, 3, 4, 5, 6]

6、contact() 做合并，拼接

此方法也不更改原数组

也可以用扩展运算符 ...

const arr = [1, 2, 3, 4, 5, 6]
const arr1 = [8, 9, 10]
console.log([...arr, ...arr1]) // 建议
console.log(arr.concat(arr1))  // 俩个方法结果一致

7、数组的增与删

会改变原数组

  // push 表示向数组末尾进行追加 [会更改原数组]
  const arr1 = [1, 2, 3, 4, 5, 6]
  console.log(arr1.push(7))      // 7
  console.log(arr1)              // [1, 2, 3, 4, 5, 6, 7]

  // unshift 表示向数组最前面进行追加 [会更改原数组]
  const arr2 = [1, 2, 3, 4, 5, 6]
  console.log(arr2.unshift(0, 100))   // 8
  console.log(arr2)                   // [0, 100, 1, 2, 3, 4, 5, 6]

  // shift 可以从数组的开头开始删除 [会更改原数组]
  const arr3 = [1, 2, 3, 4, 5, 6]
  console.log(arr3.shift())     // 1
  console.log(arr3)             // [2, 3, 4, 5, 6]

  // pop 可以从数组的末尾开始删除 [会更改原数组] 
  const arr4 = [1, 2, 3, 4, 5, 6]
  console.log(arr4.pop())       // 6
  console.log(arr4)             // [1, 2, 3, 4, 5]

代更