丁鹿学堂:前端面试手写系列之promise(一)

news/2024/4/19 10:03:23/文章来源:https://blog.csdn.net/qq_38525381/article/details/127626098

从零开始手写promise(一)

上次总结了promise A+ 规范,其实js中的promise只是实现了这个规范。就像js这个语言实现了es的规范一个道理。
带着大家一起手写promise,让我们可以更透彻的理解promise。
今天分享第一步,实现一个工具函数,为后面手写promise服务。
一个是add方法,可以添加函数到队列里,一个是statrup方法,它从工具函数里面拿到函数去依次执行。
因为resove本身也是从函数队列里去拿出来函数执行。

实现一个container工具函数

再加一些需求,如果创建实例的时候添加一些特殊的字段,会有特殊的功能:
stopOnFalse:如果有一个回调函数返回false,则后续的函数不执行

    let p = container('stopOnFalse')let fn1 = function(){console.log(1)return false}let fn2 = function(){console.log(2)}p.add(fn1,fn2)p.startup() 

once:重复调用的话只执行第一次

    let p = container('once')let fn1 = function(){console.log(1)return false}let fn2 = function(){console.log(2)}p.add(fn1,fn2)p.startup()p.startup()

memory:实力化以后添加函数立即执行

    let p = container('memory')let fn1 = function(){console.log(1)return false}let fn2 = function(){console.log(2)}p.add(fn1,fn2)p.startup()p.add(function(){console.log(3)})

具体实现代码在这里:纯粹干货

let cache = {} // 缓存对象
let container = function(flags){flags = typeof flags === 'string' ? (cache[flags] || createFlags(flags)):extend({},flags)let carryOut = falselet stack = []let memory = falselet stackLen,stackPoint = 0let fire = function(data){let len = stack.length;let i = stackPoint || 0stackPoint = 0memory = flags.memory && data // flags.memory存在就把data 赋值给变量memorycarryOut = truefor(;i<len;i++){if(stack[i].apply(data[0],data[1]) === false && flags.stopOnFalse){break}}}let obj = {add:function(){(function(args){stackLen = stack.lengthArray.from(args).forEach(item=>{if(toString.call(item) === '[object Function]'){if(!obj.has(item)){stack.push(item)}}else{throw new Error('请正确传参数')}})})(arguments)if(memory){stackPoint = stackLenfire(memory)}},startBind(context,args){args = args || []args = [context,args]if(!flags.once || !carryOut){fire(args)}},startup(){obj.startBind(this,arguments)},has(fn){return stack.indexOf(fn) > -1}}return obj
}
// (flags.match(/\S+/g) 是根据空格去分割字符串为数组
function createFlags(flags){let res = {}
let arr = flags.match(/\S+/g) || []
arr.forEach(item =>{res[item] = true
})return res
}
function extend(to,from){for(let key in from){to[key] = from[key]}return to
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.luyixian.cn/news_show_410378.aspx

如若内容造成侵权/违法违规/事实不符,请联系dt猫网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

小程序配置详解

小程序新生成时的目录 有4中不同的文件类型 .json 后缀的 JSON 配置文件.wxml 后缀的 WXML 模板文件.wxss 后缀的 WXSS 样式文件.js 后缀的 JS 脚本逻辑文件json app.json 是对当前小程序的全局配置&#xff0c;包括了小程序的所有页面路径、界面表现、网络超时时间、底部 ta…

elasticsearch、kibana、Ik分词器基于docker的单点部署

一、创建网络 由于需要让es和kibana容器互联&#xff0c;因此需要先创建一个网络。 但当也可以使用docker-compose的方式来完成一键互联&#xff0c;那样的话就不需要创建网络。 docker network create es-network二、安装elasticsearch 2.1 dockerHub直接拉取镜像的方式 …

AWS 使用Lambda实现钉钉机器人报警

aws 支持邮件和短信的报警通知&#xff0c;考虑时效性问题和结合公司的使用情况&#xff0c;需要接入钉钉机器人的告警提醒&#xff0c;为了使用钉钉机器人的告警&#xff0c;我们利用LambdaSNS&#xff0c;利用Lambda接受SNS的警告信息&#xff0c;然后通过python发送到钉钉机…

Git快速入门

本文是我在学习过程中记录学习的点点滴滴&#xff0c;目的是为了学完之后巩固一下顺便也和大家分享一下&#xff0c;日后忘记了也可以方便快速的复习。 Git前言一、版本控制1.1、常见的版本控制工具二、版本控制分类2.1、本地版本控制2.2、集中版本控制 SVN2.3、分布式版本控制…

从0到1实现python基于RPC协议的接口自动化测试

01、什么是RPC RPC&#xff08;Remote Procedure Call&#xff09;远程过程调用协议是一个用于建立适当框架的协议。从本质上讲&#xff0c;它使一台机器上的程序能够调用另一台机器上的子程序&#xff0c;而不会意识到它是远程的。 RPC 是一种软件通信协议&#xff0c;一个程…

记一次VMOS Pro破解记录

vmos pro是在安卓上运行的安卓模拟器&#xff0c;自带root&#xff0c;免root运行Xposed&#xff0c;免root运行Magisk等&#xff0c;支持修改分辨率&#xff0c;支持谷歌GMS服务&#xff0c;后台可持续运行. 背景 意外发现这么一款好玩的虚拟机但使用起来有诸多限制&#xff…

科研快报|全长扩增子测序揭示口腔微生态变化可用作阿尔兹海默症识别指标

背景介绍 阿尔茨海默病&#xff08;AD&#xff09;是一种神经退行性疾病&#xff0c;通常影响老年人。由于老年人患牙根龋和缺牙的发病率较高&#xff0c;这些牙齿问题中涉及的细菌可能会恶化他们的认知功能。口腔中微生物群的改变可能通过从口腔迁移到大脑而诱发神经炎症。然…

Spring IOC 核心流程介绍

前言 接下来我们编写入口代码&#xff0c;跟代码梳理一下Spring IOC一些重要的方法节点。IOC有12个比较重要的方法&#xff0c;把这12个方法学习一下&#xff0c;整个Spring IOC基本就差不多了。 编写Spring IOC入口 1、创建需要被管理的类 接口类&#xff1a; package se…

爱尔兰药品局药品信息数据查询

爱尔兰位于欧洲西部的爱尔兰岛中南部&#xff0c;多年来实施低税率国家政策&#xff0c;吸引着全球各大巨头公司&#xff0c;如苹果、谷歌、脸书等巨头&#xff0c;其中不乏包含很多医药企业&#xff0c;如世界级生物医药巨头辉瑞&#xff08;Pfizer&#xff09;、诺华&#xf…

刷题笔记(牛客java选择题)

目录 访问权限修饰符 抽象类和接口 线性安全的集合类 线性不安全的集合类 方法重载与重写 getDeclaredMethods方法 浮点型 和 long 不能做 switch() 的参数类型 java程序运行命令 字符串的不可变性 访问权限修饰符 抽象类和接口 使用abstract修饰的类或方法&#xff0c;就…

MacOS安装FFmpeg

MacOS安装FFmpeg方式一、使用Homebrew安装FFmpeg1. 安装Homebrew2. 安装FFmpeg方式二、通过官网安装FFmpeg方式一、使用Homebrew安装FFmpeg 1. 安装Homebrew 如果你的Mac上没有安装Homebrew&#xff0c;那么就先来安装Homebrew吧&#xff01;步骤如下&#xff1a; 打开Termi…

学习笔记-Linux 安全

Linux 安全 免责声明 本文档仅供学习和研究使用,请勿使用文中的技术源码用于非法用途,任何人造成的任何负面影响,与本人无关. 漏洞利用 OS-Exploits LOL Living Off The Land 相关文章 busybox docker 受限环境下回传文件命令行上线小技巧 相关资源 GTFOBinshttps://github.com…

前端高频手写题自测,你能做出几道

实现字符串的repeat方法 输入字符串s&#xff0c;以及其重复的次数&#xff0c;输出重复的结果&#xff0c;例如输入abc&#xff0c;2&#xff0c;输出abcabc。 function repeat(s, n) {return (new Array(n 1)).join(s); }递归&#xff1a; function repeat(s, n) {return…

edge:H5抓包

1、打开edge:并输入地址:edge://inspect/#devices 2、USB连接手机,并手机和电脑使用WiFi连接同一个ssid,以使手机和电脑在同一个网络; 3、手机设置:1)打开开发人员选项 2)进入开发人员选项,并开启USB调试 3)进入开发人员选项,设置USB配置为RNDIS 4、开始抓…

【架构】架构到底是是什么

对于技术人员来说,「架构」是一个再常见不过的词了。我们会对新员工培训整个系统的架构,参加架构设计评审,学习业界开源系统(例如,MySQL、Hadoop)的架构,研究大公司的架构实现,例如,微信架构、淘宝架构……虽然「架构」这个词常见,但如果深究一下「架构」到底指什么,…

简单的Java web项目源码(10个)

引言&#xff1a;Java web项目主要采用mvc的的设计思想&#xff0c;系统主要采用javajspservletmysqleclipse实现&#xff0c;具有登陆、分页、导出excel&#xff0c;增删改查等功能,适合初学者&#xff0c;满足基本的实训需求&#xff0c;以下是推荐的几款&#xff0c;总有适合…

【备战蓝桥杯 | 软件Java大学B组】十三届真题深刨详解(2)

个人名片&#xff1a; &#x1f43c;作者简介&#xff1a;一名大二在校生&#xff0c;喜欢编程&#x1f38b; &#x1f43b;‍❄️个人主页&#x1f947;&#xff1a;小新爱学习. &#x1f43c;个人WeChat&#xff1a;hmmwx53 &#x1f54a;️系列专栏&#xff1a;&#x1f5bc…

以开发之名 | 小红书:用年轻人的方式开发年轻人喜欢的应用

2013年&#xff0c;小红书在上海成立&#xff0c;同年12月&#xff0c;小红书推出海外购物分享社区。一个开放式的体验型分享社区走进了数亿用户的生活。每个人都能在这个开放社区&#xff0c;分享自己的生活笔记&#xff0c;给有同样需求的人种草。 小红书用户“一只雪梨酱”的…

EPICS记录参考--数据扇出记录(dfanout)

数据散出或"dfanout"记录用于最多转发数据到8个其它记录。除了向它添加了转发数据的能力外&#xff0c;它类似于fanout记录。它没有相关联的设备支持。 参数字段 在下面描述记录特定的字段&#xff0c;按功能分组。 扫描参数 数据fanout记录有用于指定其在什么情况…

k3s 指南

k3s 指南 文章目录k3s 指南简介什么是 K3s?技术亮点架构发展趋势云边缘k3s 周边单节点高可用代理注册部署清单集群要求大型集群cpu 与 内存数据库配置选项使用安装脚本二进制配置配置文件网络选项Flannel options简介 轻量级Kubernetes k3s是经CNCF一致性认证的Kubernetes发行…