首页 > 其他分享 >js数组-实例方法:Array.prototype.findLast(),Array.prototype.findLastIndex(),Array.prototype.flat()

js数组-实例方法:Array.prototype.findLast(),Array.prototype.findLastIndex(),Array.prototype.flat()

时间:2025-01-01 12:51:31浏览次数:1  
标签:flat callbackFn newArr 元素 数组 Array prototype

Array.prototype.findLast()

  • findLast() 方法反向迭代数组,并返回满足提供的测试函数的第一个元素的值。如果没有找到对应元素,则返回 undefined
  • 语法
    • findLast(callbackFn)
    • findLast(callbackFn, thisArg)
  • 参数
    • callbackFn:数组中测试元素的函数。回调应该返回一个真值,表示已找到匹配的元素,否则返回一个假值。函数在被调用时会传递以下参数
      • element:当前遍历到的元素
      • index:当前遍历到的元素的索引(位置)
      • array:调用 findLast() 的数组本身
    • thisArg
      • 执行 callbackFn 时,用作 this 的值
  • 返回值:数组中满足提供的测试函数索引最高的元素;如果没有元素匹配,返回 undefined
  • Array.prototype.myFindLast()
Array.prototype.myFindLast = function (callbackFn, thisArg) {
  if (typeof callbackFn !== 'function') {
    throw new TypeError(`${typeof callbackFn} is not a function`)
  }
  const len = this.length
  for (let i = len - 1; i >= 0; i--) {
    if (callbackFn.call(thisArg, this[i], i, this)) {
      return this[i]
    }
  }
  return undefined
}

Array.prototype.findLastIndex()

  • findLastIndex() 方法反向迭代数组,并返回满足所提供的测试函数的第一个元素的索引。若没有找到对应元素,则返回 -1
  • 语法
    • findLastIndex(callbackFn)
    • findLastIndex(callbackFn, thisArg)
  • 参数
    • callbackFn:对数组中的每个元素执行的函数。回调必须返回一个真值,表示已找到匹配的元素,否则返回一个假值。函数在被调用时会传递以下参数:
      • element:当前遍历到的元素
      • index:当前正在处理的元素的索引
      • array:调用 findLastIndex() 的数组本身
    • thisArg:执行 callbackFn 时,用作 this 的值
  • 返回值:数组中通过测试的最后一个(索引最大)元素的索引。如果没有找到任何匹配的元素,则返回 -1
  • Array.prototype.myFindLastIndex()
Array.prototype.myFindLastIndex = function (callbackFn, thisArg) {
  if (typeof callbackFn !== 'function') {
    throw new TypeError(`${typeof callbackFn} is not a function`)
  }
  const len = this.length
  for (let i = len - 1; i >= 0; i--) {
    if (callbackFn.call(thisArg, this[i], i, this)) {
      return i
    }
  }
  return -1
}

Array.prototype.flat()

  • flat() 方法创建一个新的数组,并根据指定深度递归地将所有子数组元素拼接到新的数组中
  • 语法
    • flat()
    • flat(depth)
  • 参数
    • depth:指定要提取嵌套数组的结构深度,默认值为 1
  • 返回值:一个新的数组,其中包含拼接后的子数组元素
  • Array.prototype.myFlat()
Array.prototype.myFlat = function (depth = 1) {
  // 如果this不是含有length属性的元素,则返回空数组;包含Set,Map等等具有[Symbol.iterator]
  if (this.length === undefined) {
    return []
  }
  // 创建一个新数组
  let newArr = []

  // 两种情况
  if (Object.prototype.toString.call(this) === '[object Array]') {
    // 如果this是数组的情况
    // 需要先将稀疏数组中的空槽去掉
    const len = this.length
    // 循环:根据值的类型和depth进行判断:如果depth>0且值是数组,则继续对值进行展开
    // 如果depth小于等于0,则将原有值添加到新函数里边
    // 如果depth是Infinity,则在递归函数调用完成后即可返回结果
    for (let i = 0; i < len; i++) {
      if (this.hasOwnProperty(i)) {
        if (Array.isArray(this[i]) && depth > 0) {
          depth--
          newArr.push(...this[i].myFlat(depth))
        } else {
          newArr.push(this[i])
        }
      }
    }
  } else {
    // 如果是含有length属性的对象
    newArr = Array.from(this)
    // 如果有元素的值为数组,需要根据depth对数组进行对应的展开
    newArr = newArr.myFlat(depth)
  }
  // 返回的是新数组
  return newArr
}

Array.prototype.flatMap()

  • flatMap() 方法对数组中的每个元素应用给定的回调函数,然后将结果展开一级,返回一个新数组。它等价于在调用 map() 方法后再调用深度为 1 的 flat() 方法(arr.map(...args).flat()),但比分别调用这两个方法稍微更高效一些
  • 语法
    • flatMap(callbackFn)
    • flatMap(callbackFn, thisArg)
  • 参数
    • callbackFn:一个在数组的每个元素上执行的函数。它应该返回一个包含新数组元素的数组,或是要添加到新数组中的单个非数组值。该函数将被传入以下参数:
      • element:数组中正在处理的当前元素
      • index:数组中正在处理的当前元素的索引
      • array:调用 flatMap() 的当前数组
    • thisArg:在执行 callbackFn 时用作 this 的值
  • 返回值:一个新的数组,其中每个元素都是回调函数的结果,并且被展开一级
  • Array.prototype.myFlatMap()
Array.prototype.myFlatMap = function (callbackFn, thisArg) {
  if (typeof callbackFn !== 'function') {
    throw new TypeError(`${typeof callbackFn} not is a function`)
  }
  let newArr = []
  for (let i = 0; i < this.length; i++) {
    if (this.hasOwnProperty(i)) {
      const arr = callbackFn.call(thisArg, this[i], i, this)
      newArr.push(arr)
    }
  }
  newArr = newArr.flat()
  return newArr
}

标签:flat,callbackFn,newArr,元素,数组,Array,prototype
From: https://www.cnblogs.com/shenhf/p/18645469

相关文章

  • 序列化 FlatBuffers & protobuf
    序列化FlatBuffers&protobuf1.FlatBuffers源码:FlatBuffers指南:FlatBuffersProgrammer’sGuide结构定义文件为.fbs,注释使用//,可以使用include"my.fbs"嵌套包含文件可以理解为轻量级的protobuf,不会依赖library,但是编码会复杂一些FlatBuffers的特点是先构造......
  • wx.arrayBufferToBase64
    stringwx.arrayBufferToBase64(ArrayBufferarrayBuffer)从基础库2.4.0开始,本接口停止维护基础库1.1.0开始支持,低版本需做兼容处理。小程序插件:支持微信Windows版:支持微信Mac版:支持微信鸿蒙OS版:支持功能描述将ArrayBuffer对象转成Base64字符串参数A......
  • Array.from()
    Array.from() 功能:将类数组对象转换为数组将字符串转换为数组拷贝一个素组Array.from()方法就是将一个类数组对象或者可遍历对象转换成一个真正的数组。所谓类数组对象,最基本的要求就是具有length属性的对象。第一个接收参数可以是:类数组对象/字符串/数组/{length:长......
  • Function.prototype和Object.prototype 的区别
    Function.prototype和Object.prototype都是JavaScript中的重要原型对象,它们分别用于所有函数对象和所有普通对象的原型链。它们有很多不同之处,主要体现在它们所代表的对象类型和功能上。1.作用域和对象类型Object.prototype是所有普通JavaScript对象的原型。任......
  • 请手动实现Array.prototype.reduce的方法
    Array.prototype.reduce方法接收一个函数作为累加器(accumulator),数组中的每个值(从左到右)开始缩减,最终为一个值。以下是一个手动实现的reduce方法的示例:Array.prototype.myReduce=function(callback,initialValue){//如果没有提供初始值,则将数组的第一个元素作为初始......
  • 一维数组、多维数组、Array(deepToString sort fill binarySearch)方法2024122620241
    数组20241226[数组详情](深入理解Java数组-静默虚空-博客园)什么是数组:数组是相同类型数据的有序集合注意:必须是相同数据数组描述的是相同类型的若干个数据,按照一定的先后次序排列组合而成其中,每一个数据称作一个数组元素。每个数组元素可以通过一个下标来访问......
  • Extjs中Ext.Array 方法的使用
    1.Ext.Array.clean(arr);过滤数组中的空元素vararr=[1,"",2,"",3];Ext.clean(arr);//[1,2,3]2.Ext.Array.clone(arr);可以克隆数组,对象,dom节点和日期数据,以避免保持旧的指向vararr=[1,,2,3];Ext.clone(arr)3.Ext.Array.contains(arr,items);检查此数组是否包含......
  • UE4.27, 揣摩源码, 序列化 (一) FArrayReader, FArrayWriter
    1.从ArrayReader.h和ArrayWriter.h开始1.1.SVO为了减少误解,介绍一下SVO这里的read和write的主词都是array,宾语都是memory所以前者是从内存读出array,后者是将array写入内存1.2.关键继承关系FArrayReader,FArrayWriterc......
  • LayoutInflater.from(context).inflate() 和 View.inflate
    两个都是布局加载器,而View.inflate是封装LayoutInflater.from(context).inflate后的产物,功能相同。将布局文件/res/layout/my_view.xml实例化为View对象,inflate()方法返回布局文件的view对象。LayoutInflater.from(getContext()).inflate(intresource,ViewGrouproot);//root为nu......
  • Postgres 的 Array 类型
    Postgres的Array类型|Id|Title|DateAdded|SourceUrl|PostType|Body|BlogId|Description|DateUpdated|IsMarkdown|EntryName|CreatedTime|IsActive|AutoDesc|AccessPermission||-------------|-------------|-------------|-------------|......