QQ笔记

Appearance

Return to top
On this page

基础用法 只写参数必选值的用法

数组去重方法：

sort 排序

js
const arr = [1, 2, 3, 4, 5, 6, 4, 3, 7, 1]
// 数组去重：
// 方法3： for + sort
const newArrFn = (arr) => {
  arr = arr.sort()
  let newArr = []
  for (let i = 0; i < arr.length; i++) {
    arr[i] === arr[i - 1] ? newArr : newArr.push(arr[i])
  }
  return newArr
}
console.log(newArrFn(arr)) /// [1, 2, 3, 4, 5, 6, 7]

Set:Set 函数可以接受一个数组（或类数组对象）作为参数来初始化，利用该特性也能做到给数组去重

js
const arr = [1, 2, 3, 4, 5, 6, 4, 3, 7, 1]
// 数组去重：
// 方法4： set
// .new Set方法，返回是一个类数组，需要结合 ...运算符，转成真实数组

const setNewArr = (arr) => {
  return [...new Set(arr)]
}
console.log(setNewArr(arr))

filter + indexOf indexOf，可以检测某一个元素在数组中出现的位置，找到返回该元素的下标，没找到返回 -1

js
const arr = [1, 2, 3, 4, 5, 6, 4, 3, 7, 1]
// 数组去重：
// 方法6 ：filter + findIndex
const newArrFn = (arr) => {
  // 利用indexOf检测元素在数组中第一次出现的位置是否和元素现在的位置相等，
  // 如果相等，说明数组中没有重复的
  return Array.prototype.filter.call(arr, (item, index) => {
    return arr.indexOf(item) === index
  })
}
console.log(newArrFn(arr))

includes :利用 includes 检查新数组是否包含原数组的每一项。 如果不包含，就 push 进去

js
const arr = [1, 2, 3, 4, 5, 6, 4, 3, 7, 1]
// 数组去重：
// 方法7 ：for + includes
const newArrFn = (arr) => {
  // 利用includes 检查新数组是否包含原数组的每一项
  // 如果不包含，就push进去
  let newArr = []
  for (let i = 0; i < arr.length; i++) {
    newArr.includes(arr[i]) ? newArr : newArr.push(arr[i])
  }
  return newArr
}
console.log(newArrFn(arr))

reduce 方法

js
// 基本使用
const arr = [
  { price: 10, num: 1 },
  { price: 20, num: 5 },
  { price: 30, num: 10 },
  { price: 40, num: 15 },
]

const newArr = arr.reduce((total, item) => {
  return (total += item.price * item.num)
})
console.log(newArr) //结果1010
js
//将二维数组转化为一维
let arr = [
  [1, 2],
  [3, 4],
  [5, 6],
].reduce((total, item) => total.concat(), [])
console.log(arr) //结果就是[1,2,3,4,5,6]
js
// 将多维数组转化为一维
const reduceSion = (arr) => {
  let newArr = arr.reduce(
    (total, item) =>
      total.concat(Array.isArray(item) ? reduceSion(item) : item),
    []
  )
  console.log(newArr)
  return newArr
}

let arr = [
  [0, 1],
  [2, 3, [4, 5]],
  [6, [7, 8, 9, [10, 10]]],
]
reduceSion(arr) //结果:[0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]

map

  1. map()不会对空数组进行检测
  2. map()不会改变原始数组
js
const arr = [1, 2, 3, 4, 5]
const newArr = arr.map((item) => {
  return item * 2
})
console.log(newArr) //结果:[ 2, 4, 6, 8, 10 ]

some 和 every

  1. some 翻译为一些,every 翻译为每个，所以 some 方法 只要其中一个为 true 就会返回 true ，every 方法必须所有都返回 true 才会返回 true，哪怕有一个 false，就会返回 false
js
const arr = [1, 2, 3, 4, 5, 6, 4, 3, 7, 1]

// somes
const snewArr = arr.some((item) => {
  return item > 6
})
console.log(snewArr) //遍历每一项 有一项满足条件就返回true，都不满足返回false

//every
const enewArr = arr.every((item) => {
  return item > 6
})
console.log(enewArr) //发现有不满足这个条件的就返回false，都满足才返回true

splice

js
const arr = ['尖椒', '炒蛋', '番茄', '炒蛋']
arr.splice(0, 1, '葱花') //从索引0开始。删除一个元素，插入葱花
console.log(arr) //['葱花', '炒蛋', '番茄', '炒蛋']

find 和 findIndex

js
const arr = ['尖椒', '炒蛋', '番茄', '炒蛋']

// find 找第一个满足条件的数组成员 返回该元素 没有找到返回undefind
const newArr = arr.find((item) => {
  return item.indexOf('番茄') === 0
})
console.log(newArr) //结果：番茄

//findIndex 找第一个满足条件的数组成员的位置(索引) 返回该索引 没有找到返回-1
const newArrs = arr.findIndex((item) => {
  return item === '番茄'
})
console.log(newArrs) //结果；返回索引 索引为2

filter

  1. 过滤数组单元值，生成新数组
js
const arr = [1, 2, 3, 4, 5]
const newArr = arr.filter((item) => {
  return item > 3
})
console.log(newArr) //结果[4,5]

封装 map

js
let arr = [1, 2, 3, 4, 5, 6]

Array.prototype.myMap = function (fn) {
  const arr = []
  for (let i = 0; i < this.length; i++) {
    arr.push(fn(this[i], i, this))
  }
  return arr
}

const newArr = arr.myMap((item) => {
  return item > 2
})
console.log(newArr) //结果：[ false, false, true, true, true, true ]

封装 reduce

js
Array.prototype.myReduce = function (fn, ...item) {
  let total = item.length > 0 ? item[0] : this[0]
  let index = item.length > 0 ? 0 : 1
  for (let i = index; i < this.length; i++) {
    total = fn(total, this[i], i, this)
  }
  return total
}

const arr = [1, 2, 3, 4, 5, 6]
const newArr = arr.reduce((total, itam) => {
  return total + itam
})
console.log(newArr) //结果：21

封装 filter

js
Array.prototype.myFilter = function (fn) {
  let arr = []
  for (let i = 0; i < this.length; i++) {
    if (fn(this[i], i, this)) {
      arr.push(this[i])
    }
  }
  return arr
}
let arr1 = ['西兰花', '西瓜', '花椒', '剁椒']
let res = arr1.myFilter((item, index, arr) => {
  return item.indexOf('西') === 0
})
console.log(res)