bt365体育投注.主頁欢迎您!!

    <acronym id="zvmrr"></acronym>
    <td id="zvmrr"></td>
  • <tr id="zvmrr"><label id="zvmrr"></label></tr>
  • <acronym id="zvmrr"></acronym>
  • Cyearn

    Cyearn 查看完整档案

    填写现居城市  |  填写毕业院校填写所在公司  |  职责 编辑 填写个人主页 编辑
    编辑
    _ | |__ _ _ __ _ | '_ \| | | |/ _` | | |_) | |_| | (_| | |_.__/ \__,_|\__, | |___/ 个人简介什么都没有

    个人动态

    Cyearn 赞了回答 · 1月22日

    解决请问为什么上面的可以分别打印出不一样的,可以下面的两次结果都一样?下面的第一次不是应该是[{a:0}]

    因为log打印出来的实际上是地址的引用,所以你再控制台展开的时候是会显示赋值之后的结果,因此你这里可以改成

    b=[{},{}]
    for(i=0;i<2;i++){
    b[i].a=i
    console.log(JSON.parse(JSON.stringify(b)))
    }

    关注 5 回答 4

    Cyearn 赞了回答 · 1月22日

    解决请问为什么上面的可以分别打印出不一样的,可以下面的两次结果都一样?下面的第一次不是应该是[{a:0}]

    以下内容完全引自:《你不知道的javascript中卷》第二部分异步和性能 1.1 异步控制台部分

    并没有什么规范或一组需求指定console.* 方法族如何工作——它们并不是JavaScript 正式
    的一部分,而是由宿主环境(请参考本书的“类型和语法”部分)添加到JavaScript 中的。因此,不同的浏览器和JavaScript 环境可以按照自己的意愿来实现,有时候这会引起混淆。

    尤其要提出的是,在某些条件下,某些浏览器的console.log(..) 并不会把传入的内容立即输出。出现这种情况的主要原因是,在许多程序(不只是JavaScript)中,I/O 是非常低速的阻塞部分。所以,(从页面/UI 的角度来说)浏览器在后台异步处理控制台I/O 能够提高性能,这时用户甚至可能根本意识不到其发生。

    关注 5 回答 4

    Cyearn 回答了问题 · 1月22日

    为什么同一个链接用chrome打开就是下载,用微信打开就是预览,一个pdf文件?

    可能是后台配置了下载的,而微信内置了预览,转换了他的性质

    关注 4 回答 3

    Cyearn 回答了问题 · 1月22日

    解决请问为什么上面的可以分别打印出不一样的,可以下面的两次结果都一样?下面的第一次不是应该是[{a:0}]

    你这是不是看错了,下面那个第一次打印的是[{"a":0},{}] ,第二次打印的是[{"a":0},{"a":1}],没有问题啊!!??

    关注 5 回答 4

    Cyearn 赞了文章 · 1月22日

    这次,十分钟把宏任务和微任务讲清楚

    为什么写这个文章

    • 这是一道大厂、小厂面试官都喜欢问的题目
    • 很多面试官和面试者也不知道什么是标准答案
    • 网上各种文章层次不齐..误导过不少人,包括我
    • 觉得还是今天花十分钟讲清楚他吧

    正式开始

    • 先上代码
        function app() {
          setTimeout(() => {
            console.log("1-1");
            Promise.resolve().then(() => {
              console.log("2-1");
            });
          });
          console.log("1-2");
          Promise.resolve().then(() => {
            console.log("1-3");
            setTimeout(() => {
              console.log("3-1");
            });
          });
        }
        app();
    • 输出结果:
    1-2
    1-3
    1-1
    2-1
    3-1

    开始分析

    • 面试官特别喜欢问:你讲讲什么是微任务和宏任务
    大部分面试官其实自己也不懂什么是微任务和宏任务,不信下次你们反问一下

    所谓微任务和宏任务

    • 宏任务:常见的定时器,用户交互事件等等.(宏任务就是特定的这些个任务,没什么特殊含义)
    • 微任务:Promise相关任务,MutationObserver等(一样,只是一种称呼而已!!!

    到底先执行微任务还是宏任务

    • 先有鸡还是先有蛋? 到底是先有宏任务还是微任务啊?

    第一个原则

    • 万物皆从全局上下文准备退出,全局的同步代码运行结束的这个时机开始
    • 例如我们刚才这段代码:
       function app() {
          setTimeout(() => {
            console.log("1-1");
            Promise.resolve().then(() => {
              console.log("2-1");
            });
          });
          console.log("1-2");
          Promise.resolve().then(() => {
            console.log("1-3");
            setTimeout(() => {
              console.log("3-1");
            });
          });
        }
        app();
    • 当执行完了console.log("1-2");的时候,意味着全局的上下文马上要退出了,因为此时全局的同步代码都执行完了,剩下的都是异步代码

    第二个原则

    • 同一层级下(不理解层级,可以先不管,后面会讲),微任务永远比宏任务先执行
    • 即Promise.then比setTimeout先执行
    • 所以先打印1-3,再打印1-1

    第三个原则

    • 每个宏任务,都单独关联了一个微任务队列
    • 我用刚买的黑板画了一张图,大家就知道什么是层级了

    • 每个层级的宏任务,都对应了他们的微任务队列,微任务队列遵循先进先出的原则,当全局同步代码执行完毕后,就开始执行第一层的任务。同层级的微任务永远先于宏任务执行,并且会在当前层级宏任务结束前全部执行完毕

    怎么分辨层级?

    • 属于同一个维度的代码,例如下面的func1和func2就属于同层级任务
    setTimeout(func1)...
    Promise.resolve().then(func2)...
    • 下面这种fn1和fn2就不属于同一个层级的,因为fn2属于内部这个setTimeout的微任务队列,而fn1属于外部setTimeout的微任务队列
    setTimeout(()=>{
    Promise.resolve().then(fn1)
    setTimeout(()=>{
    Promise.resolve().then(fn2)  
    })})
    划重点:每个宏任务对应一个单独的微任务队列

    遇到面试题

    • 就按照我的套路,从全局上下文退出前(全局的同步代码执行完毕后),开始收集当前层级的微任务和宏任务,然后先清空微任务队列,再执行宏任务.如果这期间遇到宏任务/微任务,就像我这样画个图,把他们塞进对应的层级里即可

    写在最后

    • 简单的1000字,相信能彻底解决你的微任务和宏任务疑惑
    • 如果你想理解得更深,记得关注下公众号,后续会写一些更深入的东西,真正的“深入浅出”
    查看原文

    赞 22 收藏 12 评论 2

    Cyearn 关注了用户 · 1月22日

    蒋鹏飞 @jiangpengfei_5ecce944a3d8a

    前端工程师,底层技术人。
    思否2020年度“Top Writer”!
    掘金“优秀作者”!
    开源中国2020年度“优秀源创作者”!
    分享各种大前端进阶知识!
    关注公众号【进击的大前端】第一时间获取高质量原创。
    更多文章和示例源码请看:https://github.com/dennis-jia...

    关注 1875

    Cyearn 关注了专栏 · 1月15日

    思否编程 技术分享

    思否编程技术内容分享

    关注 6499

    Cyearn 关注了专栏 · 1月15日

    前端森林公众号

    一个有温度的前端号,关注行业前沿。从基础到架构,携手你我共同成长。

    关注 9901

    Cyearn 关注了专栏 · 1月15日

    前端开发那些事儿

    前端知识:HTML、CSS、JS、React,nodejs、Chrome、数据结构与算法,计算机网络等精华知识分享交流。

    关注 6232

    Cyearn 关注了专栏 · 1月15日

    前端自习课

    pingan8787前端开发学习记录

    关注 910

    认证与成就

    • 获得 8 次点赞
    • 获得 3 枚徽章 获得 0 枚金徽章, 获得 0 枚银徽章, 获得 3 枚铜徽章

    擅长技能
    编辑

    开源项目 & 著作
    编辑

    (??? )
    暂时没有

    注册于 2020-11-16
    个人主页被 681 人浏览

    bt365体育投注