V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
• 请不要在回答技术问题时复制粘贴 AI 生成的内容
kiritoxf
V2EX  ›  程序员

在前端面试八股中,问到 Promise 时面试官是想听到什么样的答案?

  •  1
     
  •   kiritoxf · 2022-03-09 11:26:01 +08:00 · 5991 次点击
    这是一个创建于 1025 天前的主题,其中的信息可能已经有所发展或是发生改变。

    我一般会这样回答:

    异步请求返回的就是个 Promise ,可以用 then 获取的具体的数据。.catch 可以拿到错误。 Promise.all 可以传个数组,都返回了才会返回。 此外还有一些其它的方法。


    但是每次这么说完感觉气氛都不是很对……

    43 条回复    2022-03-10 09:17:44 +08:00
    Oktfolio
        1
    Oktfolio  
       2022-03-09 11:29:20 +08:00
    当然是造火箭的原理
    murmur
        2
    murmur  
       2022-03-09 11:29:24 +08:00
    手搓 promise 啊,promise 的原理,那几个状态的转换,为什么会 then ,内部的状态转换,执行顺序是什么

    我感觉挺扯得,明明 promise 早就是 es 标准了,现在还得学手搓 promise
    murmur
        3
    murmur  
       2022-03-09 11:30:38 +08:00
    Promise.allSettled()
    Promise.any()
    Promise.prototype.finally()
    Promise.race()

    单论调 api 他还有这么多可以说的
    fox2081
        4
    fox2081  
       2022-03-09 11:32:53 +08:00
    Promise 主要是异步啊,异步又不是只是网络请求,这有什么八股不八股的
    shakukansp
        5
    shakukansp  
       2022-03-09 11:32:57 +08:00   ❤️ 12
    难道不是应该回答 promise 是用来处理异步逻辑的,解决了 callback 嵌套读代码困难的问题,还有 promise 任务栈和 setTimeout 的任务栈优先级
    你这个回答只是表层的应用,api caller
    Cbdy
        6
    Cbdy  
       2022-03-09 11:34:06 +08:00 via Android
    Promise.resolve().then(()=>{ console.log(0); return Promise.resolve(4);}).then((r)=>{ console.log(r)})Promise.resolve().then(()=>{ console.log(1)}).then(()=>{ console.log(2)}).then(()=>{ console.log(3)}).then(()=>{ console.log(5)}).then(()=>{ console.log(6)}).then(()=>{ console.log(7)})

    输出顺序是什么?
    caisanli
        7
    caisanli  
       2022-03-09 11:43:45 +08:00 via iPhone
    我会问 Promise 的状态是怎么改变以及实现一个人 Promise.all
    arfaWong
        8
    arfaWong  
       2022-03-09 11:49:37 +08:00
    @Cbdy #6 Uncaught SyntaxError: Unexpected identifier 😂
    murmur
        9
    murmur  
       2022-03-09 11:49:40 +08:00
    @Cbdy 这个题谁要是能不背答案为什么 01 之后正好多出两个微任务把 23 插进去那可太牛逼了,网上都直接 spec 加 v8 底层代码实现

    本来我想肛的,但是我发现 ie11 都不支持 promise ,那只能以 chrome 为准了

    真正开发的时候,01234567 这么多连续执行的任务,相互关联顺序依存,还拆到两个 promise 队列执行,更牛逼

    1234567 还恰好都不是异步请求,牛逼 plus 了
    facecool3
        10
    facecool3  
       2022-03-09 11:53:51 +08:00   ❤️ 8
    我会这样子回答。不知道面试官爱听不爱听
    promise 是 es6 推出的一个异步处理的通用模型,
    它把一个异步任务分为 2 个阶段,未决阶段和已决阶段
    未决阶段中 promise 的状态是 pending ,可以通过 resolve 或 reject 把任务
    推向已决阶段,如果是 resolve ,那 promise 的状态就是 fulfiled ,如果是 reject
    那 promise 的状态就是 reject ,
    推向已决阶段的同时,可以传递参数,用于对 promise 的后续处理。
    后续处理用 then 函数,里面传 2 个回调,一个处理 resolve 一个处理了 reject
    每个回调都能拿到他们状态改变时传递的对应的参数。then 函数是放到事件队列的微队列中的
    then 函数也会返回一个 promise 对象,这个 promise 的状态根据后续处理函数的执行过程来决定。

    如果没有对应的后续处理了,那这个 Promise 的状态与数据和上一个保持一致
    如果执行中有错误,那就是 rejected 。
    如果有对应的后续处理也没有错误,那这个 promise 的状态就是 fulfiled,数据就是处理函数的返回值
    facecool3
        11
    facecool3  
       2022-03-09 11:58:25 +08:00
    大家来做题
    const pro1 = new Promise((resolve, reject) => {
    reject('reject')
    })
    pro1.then(data => {
    console.log(data);
    return '0';
    }, err => {
    console.log(err);
    return 1;
    }).catch(err => {
    console.log(err);
    return 2;
    }).then(data => {
    console.log(data);
    })
    twing37
        12
    twing37  
       2022-03-09 12:18:08 +08:00
    想听到 Microtasks 和 event loop 之类的吧.
    a62527776a
        13
    a62527776a  
       2022-03-09 12:33:43 +08:00 via iPhone
    一般都是讲讲执行栈
    majula
        14
    majula  
       2022-03-09 12:46:28 +08:00 via iPhone
    delimited continuation, cps, capture call stack, parent pointer tree, ...

    有关的概念都说一遍呗
    winglight2016
        15
    winglight2016  
       2022-03-09 12:47:57 +08:00   ❤️ 1
    个人感觉,promise 是一种异步实现,为了解决以前的异步实现,回调函数无限嵌套的问题,实现方法是返回一个 promise 用来实现异步执行之后的顺序调用,aysnc await 是更优雅的实现方式。

    思路就是:A 是什么,为什么要用 A ,解决什么问题,缺点是什么,还有什么选择是更优解。面试官不满意,很有可能是你回答反了,promise 是一种异步实现,但并不是异步请求就一定是 promise ,毕竟他关注的是你对异步编程的理解。
    Track13
        16
    Track13  
       2022-03-09 12:50:22 +08:00 via Android
    从手搓到迭代器。😂
    joshua7v
        17
    joshua7v  
       2022-03-09 13:09:25 +08:00
    怎么都是靠猜的呢
    面试官想听什么应该是要继续往下问的啊
    lscho
        18
    lscho  
       2022-03-09 13:17:04 +08:00   ❤️ 4
    面试问某个技术,一般都是想知道你对这个技术出现的背景、解决了什么问题、有什么优缺点、还有什么其他选择的等。。而不是用法。

    感觉 #5 #10 #15 几个老哥说的感觉都可以。

    作为前端,问起 promise 马上应该意识到面试官是想问对异步的理解,毕竟异步是前端最重要的一部分了。
    Cbdy
        19
    Cbdy  
       2022-03-09 13:28:01 +08:00 via Android
    @murmur 这是当时别人发给我的,他说 v8 出 bug 了,然后我试了一下所有支持 promise 的浏览器表现是一致的,所以应该是规范规定的
    lmshl
        20
    lmshl  
       2022-03-09 13:38:37 +08:00
    要我的话,我就回答: “Promise 是 IO Monad 的一种变体,骨子里还是 Monad 。”
    本身内部状态并不重要,八股文背了无用。

    我见过很多人背的很熟,真给他把键盘,还是给我写这种垃圾代码,对 flatMap(then) 完全不理解
    ```
    function request(...) {
    return new Promise(resolve => {
    fetch(...)
    .then(res => resolve(res))
    })
    }
    ```
    66beta
        21
    66beta  
       2022-03-09 13:41:31 +08:00
    手搓是为了增加短期记忆,面试的时候能条理清晰回答上来

    真上班了,谁 TM 天天用到这个,忘记了就查一下呗
    xuxuxu123
        22
    xuxuxu123  
       2022-03-09 14:11:52 +08:00
    我怀疑是不是我面了你~~~
    Puteulanus
        23
    Puteulanus  
       2022-03-09 14:20:39 +08:00
    如果我面的话想听到的大概是这个
    promise 代表一段异步过程,它实现了异步过程的标准化,是 async/await 语法可以统一处理异步过程的基石

    回调地狱的主要原因是,多段需要按顺序执行的异步过程,前一段必需持有后一段的指针,和链表很像

    promise 就像宜家的可堆叠收纳箱,对里面,用 resolve 指代下一段异步过程,对外面,把各不相同的异步过程包装成统一标准,使用统一的 IO ,从而使用 then 调用链把回调地狱的链表(A->B->C)变成了数组(A.append(B).append(C)),最终在 async/await 语法糖中得以变成 A await B await C ([A, B, C])

    都是个人理解,错了的话打脸轻一点(捂
    Leviathann
        24
    Leviathann  
       2022-03-09 14:34:30 +08:00
    @lmshl 好像也有 promise 从数学上讲不是理论上的 monad 的说法。。不满足哪个律来着
    Zink99
        25
    Zink99  
       2022-03-09 15:18:24 +08:00
    建议是直接按照 A+ 给他当场写一个
    lmshl
        26
    lmshl  
       2022-03-09 15:24:12 +08:00
    @Leviathann 它的 then 有时候是 map 有时候是 flatMap ,数学上以及其他语言 /库里这俩是分开的,比如 Scala / Kotlin / Java8 CompeletableFuture 等等。
    ChefIsAwesome
        28
    ChefIsAwesome  
       2022-03-09 15:50:51 +08:00
    你可以把一个 promise 传进函数,返回一个多套了一层的 promise 。可以把多个 promise 通过 all 那些方法组合成一个新的 promise 。换句话讲,promise 是一种可以扩展组合的模块。
    解决复杂问题的唯一方法是把大问题分解成小问题。就编程来讲,就是设计模块的形式和模块的组合方式。promise 就是你解决复杂异步问题的模块。
    zooeymango
        29
    zooeymango  
       2022-03-09 15:59:39 +08:00
    上次看面试题, 手写一个模拟 promise 的函数...其实面试官想知道的无非就是,是什么, 为什么用它, 怎么实现的, 有什么缺点和优点, 有没有更好的解决方案, 这些的, 如果遇到不知道怎么回答的就往里面套就可以了
    stkstkss
        30
    stkstkss  
       2022-03-09 16:02:26 +08:00
    有三种状态 进行中 已完成, 失败, 状态不可逆 ,padding 到 resole 或者 padding 到 reject, 然后深入异步,事件循环机制,跟定时器比较 宏任务 微任务
    lokya
        31
    lokya  
       2022-03-09 16:34:29 +08:00
    手撸一个 Promise 他问啥基本都差不多了
    luoqiang
        32
    luoqiang  
       2022-03-09 16:42:14 +08:00
    大家说的汇集起来,不行就:拿💻来,我给你现写个
    Curtion
        33
    Curtion  
       2022-03-09 17:02:08 +08:00
    我觉得先从回调地狱说起,然后说 Promise 方案,最后引申到 async/await ,同时附带一些 generator 的内容,包括发布订阅都能扯进去。你的回答感觉只是在描述 API ,只表达出了会用这个东西,看起来你即不知道怎么来的,也不知道为了解决什么问题,也没有说明怎么实现的。
    dany813
        34
    dany813  
       2022-03-09 17:26:35 +08:00
    还是要对这玩意,有自己的理解,才能随心所欲的回答
    Tokin
        35
    Tokin  
       2022-03-09 17:31:46 +08:00
    一般我都是这么回答的:
    Promise 是异步编程的一种解决方案
    支持链式调用,解决了回调地狱问题,使代码可读性更高,便于维护
    有三种状态( pending 、resolve 、reject )
    状态一旦凝固无法再次更改

    剩下的看面试官吧,聊聊 Event Loop 。

    不过,主要还是看公司,有些公司想了解的更深入一点,但是为了不显得太啰嗦,我觉得简单聊一下就好,更深入的可以等他问
    MapHacker
        36
    MapHacker  
       2022-03-09 17:47:17 +08:00
    what how why?这样吗
    daimubai
        37
    daimubai  
       2022-03-09 17:58:38 +08:00
    应该想听 promise 解决了什么问题,它的缺点,然后 await async 语法糖,再说下用法。
    weixiangzhe
        38
    weixiangzhe  
       2022-03-09 19:28:54 +08:00
    实现方式全敲一遍先,要问来问
    rus4db
        39
    rus4db  
       2022-03-09 19:58:03 +08:00
    不就是自函子范畴上的幺半群嘛,这有什么难以理解的?
    zbinlin
        40
    zbinlin  
       2022-03-09 21:16:43 +08:00
    我根据 ES 规范,写了一个简单的实现,balabala 。。。
    tedding
        41
    tedding  
       2022-03-09 21:20:05 +08:00 via iPhone
    去看 mdn 的文档 再看看 你自己说的 ……
    msg7086
        42
    msg7086  
       2022-03-10 04:09:02 +08:00 via Android   ❤️ 1
    @rus4db 谢谢你大哥,治好了我能看懂中文的毛病(狗头
    fromdark
        43
    fromdark  
       2022-03-10 09:17:44 +08:00
    面试官想听什么答案?感觉你这个问题就很跪
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   930 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 29ms · UTC 21:57 · PVG 05:57 · LAX 13:57 · JFK 16:57
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.