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

大佬们,一人出一道前端面试题,年后准备跳槽

  •  
  •   Croow · 4 小时 23 分钟前 · 1043 次点击

    如题,op 目前 3 年经验,准备年后投一波,大佬们,html ,css,es5,es6,ts,vue,react,vite,webpack,常见算法手写题,项目场景题等等无任何限制, 任意发挥,可以自创,可以搜索,金三银四,可以准备一波。

    31 条回复    2025-01-21 21:50:10 +08:00
    murmur
        1
    murmur  
       4 小时 13 分钟前
    这是我面试别人的题,有人说,因为 vue3 可以在 setup 模式下直接用 ref 定义响应式变量,那么我只要把这个变量用全局变量共享出去,就可以实现以前状态管理框架才能实现的功能。

    1 、这个说法可不可行

    2 、这个说法有没有什么不妥或者漏洞

    3 、如果不妥,请指出不妥之处
    c3de3f21
        2
    c3de3f21  
       4 小时 7 分钟前
    出一个 JsDistServer 搭建+版本控制+远程加载+局部渲染+事件联动的方案?
    c3de3f21
        3
    c3de3f21  
       4 小时 6 分钟前
    根据上面的方案 设计一条链路,我写组件,发布,在线拖拽配置数据源,发布页面,自动部署?
    lyyhello
        4
    lyyhello  
       4 小时 3 分钟前
    vue 生命周期
    murmur
        5
    murmur  
       4 小时 3 分钟前   ❤️ 1
    @c3de3f21 你这个至少得月薪 50k 的才能回答,我们目前在用的大型 OA 就有这个功能,有一个 react 二开平台,全拖拉拽操作,各种配置,各种操作图形化编程,什么字段校验多复杂的流程直接拖,还有移动端自动适配,换皮什么都是小 case

    但是人家光 redis 服务器就一堆节点,这么复杂的配置要做到编译的性能,你缓存得存多大啊
    musi
        6
    musi  
       3 小时 59 分钟前
    @murmur #5 op 说项目场景题等等无任何限制,如果对方公司刚好就是你们在用的大型 OA 公司呢?我觉得问这个问题也正常,而且可以通过候选人答题的思路以及考虑的范围去了解候选人的知识深度和广度,无非就是最终方案的可行性和完整性跟薪资匹不匹配的问题
    Croow
        7
    Croow  
    OP
       3 小时 58 分钟前
    @murmur 目前我在做的项目,早期部分模块就是这样做的,这样写有几个问题:1,跟使用 pinia 的状态管理工具相比,组件的状态是不能用游览器调试插件直观地看出来,2 ,整个组件数据流向不清晰,代码可读性非常差,项目会变得非常难维护,3 ,这些变量是存在全局的,如果有多个组件在频繁访问,修改这些全局变量会增高耦合度。
    courtier
        8
    courtier  
       3 小时 56 分钟前
    好哥哥们来点 5-6 年的,好久没面过了不知道外面怎样,年后估计要被整走了
    murmur
        9
    murmur  
       3 小时 56 分钟前
    @Croow

    我其实听到的点,是 ssr 下可能会有问题,具体没看,因为 js 在浏览器上都是单线程的,但是上了 ssr 就未必了

    对于我来说,完全可行反倒是我喜欢的答案,企业开发没多少全局变量,全局状态太多了你耦合性是不是太高了,全局数据就一个用户信息一个权限,几个变量就存完了。以前全 event 开发都能调试,现在有 watch 调试不了,你得多不自信啊
    murmur
        10
    murmur  
       3 小时 54 分钟前
    还有一个考 css 熟练度,纯八股文的偏题,就是问,如何实现文字超过 2 行才显示省略号
    shadowyue
        11
    shadowyue  
       3 小时 53 分钟前
    问这么难的干嘛,我都是问,怎么比较两个日期字符串或者日期对象谁先谁后这种
    Croow
        12
    Croow  
    OP
       3 小时 52 分钟前
    @murmur 大佬,学习了
    davin
        13
    davin  
       3 小时 42 分钟前
    Q: 浏览器渲染页面的过程是怎样的
    A: DOM 树->CSSOM 树->渲染树->布局->绘制->合成

    Q: 有哪些方式可以触发浏览器启用 GPU 渲染,浏览器如何知道什么时候是否启用 GPU 渲染?
    A: 普通文档流与 Compositing Layer 。3D transforms ,CSS filters ,will-change 属性等可以触发。渲染原理:图层分层,纹理映射。

    Q: 如何发现前端性能瓶颈,优化方式有哪些(开放性提问)?
    A: 合理使用 GPU 加速,使用 will-change 提前告知浏览器。DevTools 分析,网络优化,代码优化,缓存策略,性能监控工具。Lighthouse ,Sentry ,Microsoft Clarity ,Google Analytics 等。

    可能容易混淆的知识点:
    强缓存🆚协商缓存
    微任务🆚宏任务
    事件冒泡🆚事件捕获
    前端渲染🆚服务端渲染
    原型继承🆚类继承
    深拷贝🆚浅拷贝
    同步🆚异步
    闭包🆚立即执行函数
    节流🆚防抖
    let🆚const🆚var
    Promise🆚async/await
    箭头函数🆚普通函数
    模块化规范:CommonJS🆚ES Module
    优雅降级🆚渐进增强
    SchwarzeR
        14
    SchwarzeR  
       3 小时 42 分钟前 via Android
    感觉我能想的都是问问烂的八股文
    不过纯搓业务的话感觉不如结对写几行代码有代表性

    一定要问的话比如
    顺着跨域问 preflight 条件,怎么处理,alloworigin 能不能一律返回*,请求过来现装一个域名返回去有什么风险
    vue3 怎么快速的把非受控子组件的状态重置,会不会内存泄漏,要是里面还有保持的长连接怎么搞

    状态共享不用 pinia 行不行,不用模板撮 render 函数来看看,设计个简易埋点,sendbeacon 好用不,试过调 wasm 没,掺着算法问一段文字给你几个词第 n 个 A 词,B 词 hover 加粗,剩下的 hover 时造一个用 css 搞一个深色遮罩并关掉鼠标事件

    感觉一般糊业务也就差不多到这了
    c3de3f21
        15
    c3de3f21  
       3 小时 42 分钟前
    @murmur 测一下有没有思路,比如问题拆解能力,每部分大概要怎样规划,怎样做,包括你说的皮肤,适配,i18n ,联动崩溃如何检测,巴啦巴啦巴啦。迎难嘛。
    murmur
        16
    murmur  
       3 小时 41 分钟前
    我这还一个基础题,请将下面 fun1 的位置带入 fun1-fun5 ,说一说执行结果是什么

    ```
    async function fun1(){
    return false;
    }

    async function fun2(){
    return Promise.resolve(false);
    }

    async function fun3(){
    return Promise.reject(true);
    }

    async function fun4(){
    return new Error('出错力!');
    }

    async function fun5(){
    throw new Error('又出错力!');
    }

    async function test(){
    try {
    await fun1();
    }catch(e){
    console.log('fun: 捕捉到错误了',);
    }
    }


    test();
    ```
    ( 2 )如果执行的不是 await fun5(),而是 fun5()结果又是什么
    EmbraceQWQ
        17
    EmbraceQWQ  
       3 小时 37 分钟前
    有没有后端的,蹲一条可以吗?
    murmur
        18
    murmur  
       3 小时 37 分钟前
    @davin 优雅降级🆚渐进增强 这个是 IE 年代才有的面试题,现在就是上完整版,用户如果浏览器不支持就让他去下个 360
    murmur
        19
    murmur  
       3 小时 37 分钟前
    @EmbraceQWQ javaguide.cn 自己去背八股文吧,后端能面的太多了,光一个 spring 系列就能出多少题
    EmbraceQWQ
        20
    EmbraceQWQ  
       3 小时 29 分钟前
    @murmur 会点 感谢分享 经典的 java guide ,虽然我现在就在写 java ,但是我比较向往每个后端语言都写写,灵活应对需求的,不知道有没有这样的大杂烩八股文宝典。
    guyeu
        21
    guyeu  
       3 小时 28 分钟前
    什么是原型链
    guanzhangzhang
        22
    guanzhangzhang  
       3 小时 22 分钟前
    前端有一个按钮,避免用户 500ms 内点击多次,纯 js 层面如何实现
    jackmod
        23
    jackmod  
       2 小时 41 分钟前
    执行 String.prototype.trim(" \n abc\n ")
    得到 "\n abc\n"
    找出其原因。这是我今天遇到的问题
    FakerLeung
        24
    FakerLeung  
       2 小时 34 分钟前
    @murmur #16 盲猜
    fun1: undefine
    fun2: undefine
    fun3: 捕获了一个未被捕获的 Promise 错误
    fun4: undefine
    fun5: fun: 捕捉到错误了

    (2): 捕获了一个未被捕获的 Promise 错误
    FakerLeung
        25
    FakerLeung  
       2 小时 33 分钟前
    @FakerLeung #24 啊,执行了一下,3 ,5 反了
    (2) 跟 fun3 是一样的
    ltaoo1o
        26
    ltaoo1o  
       2 小时 10 分钟前
    @guanzhangzhang 防抖吗?这个问题我一直想吐槽,我看公司其他同事写提交按扭,就喜欢用防抖来防止重复提交,为什么不直接加一个 loading 变量来控制呢,响应时间长的情况下,恰巧间隔 500ms 重复点击是有可能的。
    mxT52CRuqR6o5
        27
    mxT52CRuqR6o5  
       2 小时 4 分钟前
    @jackmod #23
    我这儿跑了一下,String.prototype.trim(" \n abc\n ")返回空字符串," \n abc\n ".trim()返回'abc'
    jackmod
        28
    jackmod  
       1 小时 12 分钟前
    @mxT52CRuqR6o5 #27 空环境下执行的结果都是正确的,所以答案是 trim 被某个依赖库给改了。
    dyv9
        29
    dyv9  
       1 小时 6 分钟前
    年轻人都这么强,俺老老实实地打杂,不加班。^_^
    Torpedo
        30
    Torpedo  
       57 分钟前
    react 的话,我喜欢问 const app=<App/> 这里的 app 在 js 里是什么样的数据结构?
    react 组件树 diff 的原理(只需要说出组件树的 diff 怎么比较的就行了)另外这个 diff 比较方法可以手写一下(其实就比较两棵树)
    spkingr
        31
    spkingr  
       9 分钟前 via Android
    有一个 3 层的书架,有 N 本书( 1<N<10000 ),书的宽度和高度各不相同(第 i 本书宽高为 w_i ,h_i ),如何摆放才能让书架的宽度 W✖️高度 H 最小?
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2917 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 20ms · UTC 13:59 · PVG 21:59 · LAX 05:59 · JFK 08:59
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.