当前位置: 首页 > news >正文

Vue nextTick原理回顾

nextTick就是将异步函数放在下一次实践循环的微任务队列中执行

  • 实现原理比较简单,极简版本:
function myNextTick(cb){
  let p;
  p=Promise.resolve().then(cb)
  return cb?p:Promise.resolve()
}

  • 复杂版本,考虑异步函数入队、执行锁、兼容处理
let callbackArr=[]
let pendding=false

function executeAsyncTask(){
	//该执行promise.then了表示
  pendding=false
  for(let i=0;i<callbackArr.length;i++){
    callbackArr[i]()
  }
}

function myNextTick(cb){

  callbackArr.push(cb)

  if(!pendding){
    pendding=true
    Promise.resolve().then(executeAsyncTask)
  }
  
  if(!cb){
    return Promise.resolve()
  }
}
http://www.dtcms.com/a/40821.html

相关文章:

  • 第四届工程管理与信息科学国际学术会议 (EMIS 2025)
  • Node.js, Bun, Deno 比较概述
  • Nginx 报错:413 Request Entity Too Large
  • DeepSeek在昇腾上的模型部署 - 常见问题及解决方案
  • 本地svn
  • 视频批量分段工具
  • 网络之重要角色---MAC地址(The Important Role of the Network - MAC Address)
  • Java—初始多线程
  • Immich自托管服务的本地化部署与随时随地安全便捷在线访问数据
  • Python常见面试题的详解24
  • YOLOv11-ultralytics-8.3.67部分代码阅读笔记-train.py
  • 多组织业务流程中提示从价目表被终止
  • 打破关节动力桎梏!杭州宇树科技如何用“一体化设计”重塑四足机器人性能?
  • Android构建系统 - 06 添加编译模块
  • 记一次命令行启动springboot项目的问题 java -jar的问题
  • docker安装RabbitMq
  • 【力扣】2626. 数组归约运算——认识循环
  • WebSocket相关技术
  • 关系型数据库的技术思路
  • 代码随想录第16天|找树左下角的值、 路径总和
  • 嵌入式八股,Linux驱动三大基础类
  • Hive面试:行列转换
  • HTML/CSS/JS
  • XFeat:轻量级的深度学习图像特征匹配
  • leetcode 912. 排序数组
  • 【Eureka 缓存机制】
  • 【大模型+知识图谱】大模型与知识图谱融合:技术演进、实践应用与未来挑战
  • ue5 3dcesium中从本地配置文件读取路3dtilles的路径
  • Module-info.java文件
  • Java 接口与实现类:为什么接口不能直接创建对象?