yezheyu 最近的时间轴更新
yezheyu

yezheyu

V2EX 第 166159 号会员,加入于 2016-04-03 15:25:18 +08:00
如何定制 console.log 的打印结果?
程序员  •  yezheyu  •  74 天前  •  最后回复来自 yezheyu
23
请教一个 vue 中组件复用的问题
程序员  •  yezheyu  •  129 天前  •  最后回复来自 Zzzz77
23
请教一个高级语言中函数调用栈相关的问题
  •  1   
    程序员  •  yezheyu  •  160 天前  •  最后回复来自 Orlion
    22
    Vue 新手上路,像请教个 vue-router 的问题
    程序员  •  yezheyu  •  182 天前  •  最后回复来自 daolanfler
    5
    请教个关于 vue3 中根节点需不需的问题
    程序员  •  yezheyu  •  208 天前  •  最后回复来自 sjhhjx0122
    5
    关于前后端分离的一些疑问
    程序员  •  yezheyu  •  243 天前  •  最后回复来自 ychost
    24
    请教一个前端的 css 问题
    程序员  •  yezheyu  •  277 天前  •  最后回复来自 yezheyu
    9
    关于装双系统中分区的一些疑问
    程序员  •  yezheyu  •  303 天前  •  最后回复来自 yezheyu
    9
    yezheyu 最近回复了
    关于 button 的点击事件的回调函数 this 为啥是 button

    我猜是这样的的,你们看对吗?

    当页面上一个点击事件触发时,页面上如果有多个元素绑定了点击事件,那总不能把所有的点击事件都触发了,为了精准触发某个按钮的点击事件,所以区别于一般的任务,其多保存了一个回调函数的绑定对象,大概结构类似下面

    {
    btn1:{
    showText1: func(){…},
    showText2: func(){…}
    }
    }

    所以回调函数调用时是这样 btn1.showText()调用,走的隐式绑定,所以 this 指向 btn1

    @biguokang
    @autoxbc
    @Al0rid4l
    @biguokang
    @autoxbc
    @Al0rid4l
    @h0099

    还有个问题想请教大家

    ---------------------------------------------------------
    setTimeout( function(){ console.log(this), 0 } )
    // 打印 window
    --------------------------------------------------------

    异步任务的回调函数中的 this 大多数是指向 window ,因为回调函数作为任务执行时,主线程的执行栈已清空,函数是单独调用,其默认绑定的就是 window

    我这样理解对吗?

    那为啥 button 点击事件的回调函数中 this 会指向事件的触发对象 button 呢?而不是 window ?
    @biguokang #30
    老哥你这一说,我也觉得像,哈哈
    @biguokang
    @h0099

    多谢老哥的详细解答,那再请教一个类似的问题。

    对于 JavaScript 中事件绑定和触发,同样涉及到事件循环,我这样理解对吗?



    当你为一个事件绑定一个回调函数 ( 事件触发后执行的一段代码,可以是绑定多个回调函数 )时,本质是使用一个容器 ( 如对象 ) 记录事件名和回调函数的映射

    当浏览器监控到特定的事件被触发时,就会从容器中取出事件对应的回调函数,把事件对象作为参数传递进回调函数中,再封装成一个任务放入任务队列中等待主线程执行
    @h0099
    多谢指正

    所以 xhr 只是负责和浏览器的网络线程通信,下发任务
    而网络线程就只管从服务器下载资源,对于下载好的资源,你怎么处理,就算只是打印一下,也必须让主线程处理。网络线程只负责 socket 通信。

    所以我上面的例子,对于结果不管是更新 UI ,还是打印结果,都只能是主线程处理,对吗?
    @cyndihuifei @peterlitszo

    个人理解,可能有错,欢迎指出



    js 之所以是单线程,主要为了避免资源竞争问题。

    但实际上 js 不可能是单线程,就比如 xhr 图片加载,xhr 在下载时没有阻塞主线程,那图片的下载必定不是在主线程执行,那必定有一个线程帮你执行下载工作,就是网络线程。

    所以我认为 js 单线程是指你在 js 代码中无法像其它语言那样使用多线程模块创建一个线程执行一个代码块。只能使用预留的 API 调用现有的线程,如浏览器的 xhr Web Api ,node 的 fs 模块

    那像 xhr 中在网络线程中要渲染图片,涉及到操作 dom ,就会出现资源竞争问题,所以必须放到任务队列中让主线程来进行



    那你在代码中的耗时任务该怎么办呢? js 又没有多线程让你开辟一个线程去处理,而浏览器也没有一个特定的 WEB API 帮你执行。

    所以为了不阻塞后续代码只能延期执行,让其它代码先执行,执行完后再执行耗时任务和对其结果的依赖代码,即微任务。

    每个宏任务都有一个微任务队列,里面放的就是这些延期代码。微任务的执行时机就是当前宏任务执行完,下一个宏任务执行前。这样就可以完美解决。

    而 Promise 就是这样的实现
    @Mutoo 多谢老哥,明白了
    @elonmask 有道理,但如果不是 UI 相关,收尾代码纯粹 console.log 或者保存图片等等,另一个线程也能做到,是不是就没必要放到任务队列中等主线程执行呢?
    74 天前
    回复了 yezheyu 创建的主题 程序员 如何定制 console.log 的打印结果?
    @Great233

    再次感谢老哥,最近重新看了 Object 上 Object.getOwnPropertyDescriptors() API ,其中提到了属性的是否可枚举,我才算彻底明白这个问题,也明白了是我当初这个问题问歪了,哈哈
    103 天前
    回复了 yezheyu 创建的主题 程序员 如何定制 console.log 的打印结果?
    @stefanieewu

    谢谢!这就是我本意想问的答案,怪我描述不清,害的大家误解我的意思


    还有,也多谢 @Great233 老哥的耐心解答
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   我们的愿景   ·   广告投放   ·   实用小工具   ·   3782 人在线   最高记录 5497   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 33ms · UTC 05:05 · PVG 13:05 · LAX 21:05 · JFK 00:05
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.