阿里云前端一面

实习1.怎么处理跟ai对话的上下文2.怎么处理性能瓶颈(打字机效果，每个字渲染一下)八股1.防抖和节流的区别2.RTK和Zustand在状态管理上的区别3.RTK的实现原理4.前端设计模式了解吗5.设计表单项之间的联动/判断逻辑，可以用啥 (Proxy)6. React的事件循环机制7.如果我想把一些代码的逻辑放进下一个事件循环里，怎么做8.虚拟滚动的原理9. useMemo和useCallback的区别10.介绍一下useEffect11.介绍一下useContext(用useContext会 3/3 不会有什么弊端)12.了解高阶组件吗，项目中有用到吗13.介绍闭包14.介绍原型链15.深...

自我介绍 实习项目基础从什么时候开始接触前端？为什么选择前端？实习为什么离开？介绍一下你觉得做得最好的项目和它的亮点是什么？如何发现性能问题的？简单描述一下从输入URL到页面渲染完成的过程。有了解过Canvas吗？（不咋了解）重绘和重排区别，哪个性能消耗更大？场景：如何判断用户是否看到广告卡片，以统计其曝光？（说了监听scroll和IntersectionObserve实现）SSE和 WebSocket 区别和优缺点？addEventListener方法有几个参数？事件的执行阶段是什么？（事件捕获和冒泡）事件对象中的 event.target 和 event.currentTarget 区别？代码输出题：事件循环Event Loop打印顺序，解释原因Promise在实现和运行中会产生闭包吗？（产生、结合源码说了说）JS封装一个网络请求？（XMLHttpRequest）除了XMLHttpRequest，还有什么其他方法可以发送网络请求？（Fetch API）如何主动取消一个已经发出的Fetch请求？了解自定义事件吗？（说可以自定义eventEmitter）CSS Flex布局问题：如何让父容器中的三个子元素，前两个居左，最后一个居右，中间留白？CSS或JS动画有做过吗？（这个不会）讲一下二分查找的原理React常见的性能优化点有哪些？（除了useMemo/useCallback）了解微前端吗？Chrome开发者工具里，如何查看页面帧率？查看内存占用？如何快速定位到有性能问题的代码？开放题：纯前端（无流量变量）实现A/B Test，让80%的用户访问A页面，20%访问B页面？实习期间的工作强度是怎样的？能否接受较强的工作强度？有过沟通冲突吗？如何解决？未来工作中发生冲突或对立，如何处理？平时通过哪些渠道学习前端知识？平时使用哪些AI编程工具？反问，问了培养、氛围、不同面侧重体验挺好的，有说有笑

八股1. html渲染，遇到script标签会怎样2. async和defer有啥区别，怎么执行的3. http缓存(强缓存，协商缓存)4.跨域5.跨域的表现是什么样的，发出去无响应/压根没发?6.请求发出去以后，根据啥判断是否跨域?7. option请求8.介绍一些es6和更新的API9.箭头函数和function区别10. 事件循环11.怎么利用事件循环机制，优化大量计算导致的页面卡顿问题12.了解requestAnimationFrame吗，他在事件循环中的位置是啥13.怎么理解react中的hooks，为啥不用类组件，好在哪14.自己有封装自定义的hook吗?为啥不用普通的方法函数15...

淘宝交易前端1.自我介绍2.介绍实习和项目3.http和https本身有什么区别，混用有什么风险?4.跨域问题答： 在 webpack.config.js 的 devServer 中添加 proxy 配置，指定目标服务器地址，可设置 pathRewrite 重写路径，或 changeOrigin 模拟同源请求。或后端配置 CORS 允许指定源访问；使用代理服务器转发请求（Webpack Dev Server）。简单场景可用 JSONP（仅支持 GET）。5.proxy是本地开发环境使用的，项目上线了呢？（1）后端配置 CORS（推荐）（2）服务器层代理（如 Nginx、Apache）6.一个html页面里，监听一个元素是否滚动到了页面中可视位置？（1）Intersection Observer API 实现（2）监听 window 的 scroll 事件，获取元素的 getBoundingClientRect ()，得到其 top、bottom 等位置信息，再与视口高度比较。7.scroll判断滚动方向是向上滚还是向下滚？答：监听 window 的 scroll 事件，在回调中获取当前 scrollTop，与之前存储的值比较，当前值大则为向下滚，反之向上滚，最后更新历史值。8.space-between和space-around在布局上有什么区别？答：实际开发中，space-between适合需要元素贴边且均匀分布的场景，space-around适合需要整体居中且两侧有留白的布局。9.flex:1 是哪几个属性的合并？flex:1 是 flex-grow、flex-shrink 和 flex-basis 三个属性的简写形式，等价于 flex: 1 1 0%。这种简写在实际开发中很常用，比如在分栏布局中，给多个子元素设置 flex:1，可实现等宽分配父容器空间。