资讯专栏INFORMATION COLUMN

关于数组forEach方法的封装

RayKr / 1238人阅读

摘要:今天,开始正式开始搭建自己的前端学习之路,必不可少的当然就是开始搭建自己的知识库了。好了,废话不多说,想必大家对的方法并不陌生吧,但是你知道他是怎么实现的吗我们自己能不能也封装一个这样的方法供我们自己使用呢。

今天,开始正式开始搭建自己的前端学习之路,必不可少的当然就是开始搭建自己的知识库了。
好了,废话不多说,想必大家对ES5的forEach方法并不陌生吧,但是你知道他是怎么实现的吗?我们自己能不能也封装一个这样的方法供我们自己使用呢。

**放上简略版代码:**

    Array.prototype.forEach = function myForEach(fn = function() {}, direction) {
   for (let i = 0; i < this.length; i++) {
    // 此处写 fn.apply(direction, [this[i], i, this])也是可以的哟
    // 详细知识就要去看apply,bind,call的相关知识点啦
    // direction 代表this的指向
        fn.bind(direction, [this[i], i, this])();
    }
}

**运行示例:**
 // 使用
let arr = [1, 2, 3];
let arr1 = [4, 5, 6];
arr.forEach(function(item, index, a) {
    // this 指向arr1
    console.log("this=", this)
}, arr1);
   

**涉及知识点:**
  1. forEach(()=>{},direction)中第二个参数的作用(改变函数内的this指向)
  
  2. [1,2,3].forEach(function(item,index,direction) {
     console.log(item);
    })封装的思路在哪(this指向的是这个数组,数组要想传入函数就要用到this关键字)
    
  3. apply,this,call的使用,此处用于改变函数this指向。 
 

前端的学习之路漫长,慢慢写作,慢慢成长,我们一起加油哦!

这是我第一篇自己的文章,好期待一年后的我还在坚持着写文章哪!

欢迎各位小伙伴对我批评指正,谢谢!

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/103964.html

相关文章

  • 翻译连载 | JavaScript轻量级函数式编程-第7章: 闭包vs对象 |《你不知道JS》姊妹

    摘要:相像闭包和对象之间的关系可能不是那么明显。一个没有对象的编程语言可以用闭包来模拟对象。事实上,表达一个对象为闭包形式,或闭包为对象形式是相当简单的。简而言之,闭包和对象是状态的同构表示及其相关功能。 原文地址:Functional-Light-JS 原文作者:Kyle Simpson-《You-Dont-Know-JS》作者 关于译者:这是一个流淌着沪江血液的纯粹工程:认真,...

    leanxi 评论0 收藏0
  • Refactoring to collection(译)

    摘要:获取试读文章高阶函数高阶函数就是参数为可以为,并且返回值也可为的函数。比方说,我们现在有顾客名单,但我们需要得到他们的邮箱地址我们现在不用高阶函数用一个来实现它,代码如下。 《Refactoring To Collection》 本文是翻译Adam Wathan 的《Collection To Refactoring》的试读篇章,这篇文章内容不多,但是可以为我们Laraver使用者能更...

    lavnFan 评论0 收藏0
  • 关于 bind 你可能需要了解知识点以及使用场景

    摘要:语法是这样样子的当绑定函数被调用时,该参数会作为原函数运行时的指向。当使用对象的方法时,需要引用对象,你可能需要显式地把绑定到回调函数以便继续使用对象。中方法简介备忘中的,以及中方法的使用与实现 不看不知道,一看吓一跳,已经整整一个月没有更新 underscore 源码解读系列文章了。前面我们已经完成了 Object ,Array,Collection 上的扩展方法的源码剖析,本文开...

    ls0609 评论0 收藏0
  • js之灵活使用可遍历数组API

    摘要:总结遍历数组的时候应该尽量使用这些,灵活运用可以让代码更加优雅,这种尽可能使用函数和链式调用的风格很接近函数式编程,可以提高代码质量。 js中有很多可以遍历数组的API,既然已经封装的这么好,为什么不在平常开发的时候使用,本文讲讲forEach、map、filter、some、every、reduce这些API的使用,并且和普通的for语句作对比。 我们以一个对象数组作为测试数据: c...

    sutaking 评论0 收藏0
  • express.js 路由实现解读

    摘要:关于的实现源码解读,版本为。主要为路由部分。返回到的遍历是通过尾递归的方式实现的,注意到被传入的方法中,中处理事情最后向传入,从而是否继续遍历取决于的实现是否调用的方法。 关于express.js的实现源码解读,版本为 4.14。主要为路由部分。 一个Web框架最重要的模块是路由功能,该模块的目标是:能够根据method、path匹配需要执行的方法,并在定义的方法中提供有关请求和回应的...

    sugarmo 评论0 收藏0

发表评论

0条评论

RayKr

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<