经验总结

  1. 首页 > 生活 > >

17_Vue列表过滤_js模糊查询( 三 )

生活百科

开始设计

  1. 首先我们需要在原型对象Array当中，通过prototype 设计一个供 所有数组类型，调用的函数
    • Array.prototype.myFilter = function(percolator){}
  2. 既然这个 方法，最终会得到一个新的数组，不会改变原有数组结构，那我们肯定要先设计一个新数组嘛
    • Array.prototype.myFilter = function(percolator){// 设计一个新数组 let newArr = [];}
  3. 我们需要得到 currentValue（循环项），这个东西到底如何上手？通过循环得到嘛
    1. 通过刚刚在原形对象上设计的 myFilter 函数，我们可以对这个数组进行基本的迭代
    2. Array.prototype.myFilter = function(percolator){// 设计一个新数组let newArr = [];// 对当前数组进行迭代;this的指向是数组本身for(let i =0; i<this.length; i++){// this[i] 就代表我们当前的循环项，也就是currentValue}}
    3. this[i] 就代表我们当前的循环项，也就是currentValue
  4. 那么现在，值得思考的地方就来了
    1. 我们使用这个for循环，是为了得到循环项，那么这个循环项给谁调用？ == 匿名函数percolator
    2. 这个匿名函数，可以接受三个参数，但是currentValue是必须要的，所以这里我们三个参数都传进去
    3. 那么，匿名函数应该用在什么位置？
      • 我觉得这里应该写个判断，当满足条件的时候，给newArr添加一个元素
    4. 它需要做什么事情？
      • 这个判断，就是匿名函数要做的事情，但是判断不能写死，要让使用者来书写
完整实现所以现在结果很明确，我们需要写个if判断，当if为true，执行if当中的语句，控制是否为true，交给匿名函数 == percolator 来搞定
  • Array.prototype.myFilter = function(percolator){// 设计一个新数组let newArr = [];// 对当前数组进行迭代;this的指向是数组本身for(let i =0; i<this.length; i++){// this[i] 就代表我们当前的循环项，也就是currentValueif(percolator(this[i],i,this)){ // 当前元素，当前索引，对应数组// 满足条件，给 newArr添加一个元素newArr.push(this[i]);}}// 循环结束，返回新的数组return newArr;}
测试这里有一个简单结构的数组
17_Vue列表过滤_js模糊查询

文章插图
现在我们调用api，myFilter，打印输出
17_Vue列表过滤_js模糊查询

文章插图

17_Vue列表过滤_js模糊查询

文章插图

经验总结扩展阅读


上一篇：2023年9月24日畜牧行吗 2023年农历八月初十宜畜牧吗

下一篇：洗衣液怎么用