Array.forEach原理,仿造一个类似功能

Array.forEach原理,仿造一个类似功能

array.forEach

 // 设一个arr数组
        let arr = [12,45,78,165,68,124];
        let sum = 0;
        // 遍历该数组求和
        arr.forEach(function(item,index){
            sum += item;
        })
        console.log(sum);

如上

我们使用forEach可遍历一个数组,并取出其index,item,还有 数组本身

然后根据返回的值可以实现你想要的功能,比如求和

原理

该函数的原理是利用了Array的原型对象进行操作的,下面是依据此原理模仿forEach的例子,以此来说明一下该方法的原理

Array.prototype.myForEach = function (fn) {
        for (let i = 0; i < this.length; i++) {
            fn(this[i], i, this);
        }
    };

也就是当我们调用一次myForEach函数时,其中的fn将会被调用this.length-1次(其中的this指的自然是调用该方法的对象)

执行如下代码,可以发现输出结果确实与forEach一致

let arr = [12, 45, 78, 165, 68, 124];
Array.prototype.myForEach = function (fn) {
        for (let i = 0; i < this.length; i++) {
            fn(this[i], i, this);
        }
    };
    arr.myForEach(function (item, index, arr) {
        console.log("item:" + item + ",index:" + index + ",this:" + arr);
    })

当我们在调试台打断点在arr.muForEach(function(item,index,arr))..这一行时,再一步一步调试可以发现

执行myForEach后会调用该方法的for循环,而每一次for循环则会调用其中的fn,

此时则会执行我们在最后一个方法中写的:console.log("item:" + item + ",index:" + index + ",this:" + arr);

提问:若在for循环之后再加一个fn(),会发生什么?

原文地址:https://www.cnblogs.com/axu1997/p/11839236.html

时间: 2025-01-14 08:13:37

Array.forEach原理,仿造一个类似功能的相关文章

PHP操作实现一个多功能购物网站

一.需要实现的页面: Index.aspx:浏览商品页面,显示商品列表,用户可以点击"加入购物车". ViewCart.aspx:查看购物车页面,显示已购买的商品信息,可以点击"删除"和"提交添加订单购买"商品 ViewAccount.aspx:查看个人账户余额 Login.aspx:登录页面 二.实现功能: 1.显示商品列表 2.实现购买功能,购买的时候动态显示购物车中的商品数量和商品总价格 3.点击查看购物车后,显示已购买的商品.注意&quo

Java 实现《编译原理》简单词法分析功能

Java 实现<编译原理>简单词法分析功能 简易词法分析功能 要求及功能 (1)读取一个 txt 程序文件(最后的 # 作为结束标志,不可省去) { int a, b; a = 10; if(a>=1){ b = a + 20; } } (2)词法识别分析表 单词类别|单词自身值|内部编码 -|-|- 关键字| int.for.while.do.return.break.continue| 1 标识符| 除关键字外的以字母开头,后跟字母.数字的字符序列| 2 常数| 无符号整型数| 3

Gora是一个类似Hibernate的ORM框架

Gora是一个类似Hibernate的ORM框架,但是不只是支持关系数据库,更重要支持NoSQL之类大数据的存储. 支持NoSQL之类大数据的存储 Apache Gora是一个开源的ORM(Object/Relation Mapping,对象关系映射)框架,主要为大数据提供内存数据模型与数据的持久化.目前Gora支持对于列数据.key-value数据,文档数据与RDBMS数据的存储,还支持使用Apache Hadoop来对对大数据进行分析 虽然目前市面上有很多不错的关系数据库的ORM框架,但是基

轻量级web富文本框——wangEditor使用手册(2)——扩展一个“缩进”功能

1. 引言 上一节<轻量级web富文本框——wangEditor使用手册(1)——基本应用>中我们讲解了如何应用wangEditor创建最基本的富文本编辑器,本节继续讲如何扩展一个简单的按钮.本节是继续上一节的内容来的,所使用的代码也是接着上一节的来的,错过的朋友请先看上一节,再看本节. 下载地址:https://github.com/wangfupeng1988/wangEditor demo演示:http://www.cnblogs.com/wangfupeng1988/p/4185508

使用OTP原理构建一个非阻塞的TCP服务器(转)

经测试可用! 原文地址:http://www.iucai.com/?paged=8 Erlang OTP设计原理已经被shiningray兄翻译透了.请参见.http://erlang.shiningray.cn/otp-design-principles/index.html 这里翻译了一篇余锋老大和lzy.je老大推荐的文章,闲话不说,奉上. 使用OTP原理构建一个非阻塞的TCP服务器 原文网址:(打不开的同学请自觉FQ) http://www.trapexit.org.nyud.net:8

使用plupload做一个类似qq邮箱附件上传的效果

公司项目中使用的框架是springmvc+hibernate+spring,目前需要做一个类似qq邮箱附件上传的功能,暂时只是上传小类型的附件 处理过程和解决方案都需要添加附件,处理过程和解决方案都可以添加多个附件,也可一个都不添加 以其中一个为例:(文件保存到了数据库中),有关plupload的内容可参考:http://www.360doc.com/content/14/0714/03/552866_394228686.shtml 首先是po package cn.com.plupload.p

用JAVA写一个函数,功能如下: 任意给定一组数, 找出任意数相加之后的结果为35(任意设定)的情况

用JAVA写一个函数.功能如下:任意给定一组数,例如{12,60,-8,99,15,35,17,18},找出任意数相加之后的结果为35(任意设定)的情况. 可以递归算法来解: package test1; import java.util.Arrays; public class demo { public static void main(String[] args) { String str = "12,60,-8,99,15,35,17,18,8,10,11,12"; int s

LinQ 泛型方法Array&gt;ForEach在数组中进行迭代并调用自定义的委托

using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.Diagnostics; using System.IO; namespace LambdaExpressionAction { class Program { static void Main(string[] args) { //定义输出委托 Action<double> print = amo

firstboot script 类似功能实现

#!/bin/bash echo "fdisk success" -sed -i '/fdisk.sh/d'  /etc/rc.d/rc.local +sed -i 's/fdisk.sh/reboot.sh/'  /etc/rc.d/rc.local + reboot 主要是格式化磁盘,写在 /etc/rc.local 删除不彻底(/etc/rc.local 是links,用sed 修改文件时 把/etc/rc.local 变成regular file)  这个回头找个时间再看看se