<?xml version="1.0" encoding="utf-8" standalone="yes"?><rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:content="http://purl.org/rss/1.0/modules/content/"><channel><title>百度-地图-秋招 on Last Stand</title><link>https://amatsuzero.github.io/LastStand/posts/frontend/interview-experiences/experience-41/</link><description>Recent content in 百度-地图-秋招 on Last Stand</description><generator>Hugo</generator><language>zh-cn</language><lastBuildDate>Sat, 19 Jul 2025 06:27:27 +0000</lastBuildDate><atom:link href="https://amatsuzero.github.io/LastStand/posts/frontend/interview-experiences/experience-41/index.xml" rel="self" type="application/rss+xml"/><item><title>百度-地图-秋招 · 第 1 轮 · 三面</title><link>https://amatsuzero.github.io/LastStand/posts/frontend/interview-experiences/experience-41/round-60/</link><pubDate>Sat, 19 Jul 2025 06:27:27 +0000</pubDate><guid>https://amatsuzero.github.io/LastStand/posts/frontend/interview-experiences/experience-41/round-60/</guid><description>&lt;blockquote&gt;
&lt;p&gt;← &lt;a href="https://amatsuzero.github.io/LastStand/posts/frontend/interview-experiences/experience-41/round-59/"&gt;第 1 轮&lt;/a&gt; · &lt;a href="https://amatsuzero.github.io/LastStand/posts/frontend/interview-experiences/experience-41/"&gt;返回本次面经&lt;/a&gt; · 已是最后一轮 →&lt;/p&gt;
&lt;/blockquote&gt;
&lt;p&gt;本轮共 7 道题。答案默认折叠，便于先自行作答。&lt;/p&gt;
&lt;h2 id="question-subjective-645f514bf437"&gt;1. 讲一个你觉得最有成就感的项目？&lt;/h2&gt;
&lt;h3 id="题目要点"&gt;题目要点&lt;/h3&gt;
&lt;p&gt;这个问题的回答重点不在于项目多复杂，而在于是否能通过一个真实的项目，清晰地表达出在关键阶段的判断力、推动力和技术价值。能讲出一个对业务和团队产生正向影响的案例，并体现出“为什么重要”、“怎么做的”、“结果如何”以及“有哪些沉淀”，才是打动面试官的关键。&lt;/p&gt;
&lt;details&gt;
&lt;summary&gt;参考答案&lt;/summary&gt;
&lt;p&gt;这个问题考察的是候选人在复杂项目中的角色、思维方式以及实际落地能力。回答时不必拘泥于“成功上线”或“技术高大上”的标准，更重要的是能体现出技术价值、业务洞察和综合影响力。&lt;/p&gt;
&lt;p&gt;可以从以下几个方向展开：&lt;/p&gt;
&lt;hr&gt;
&lt;p&gt;&lt;strong&gt;1. 项目背景与挑战&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;项目是否处于关键节点（如业务转型、架构重构、性能瓶颈期），是否需要协调多个团队或跨端协作。重点在于说明“项目为什么重要”以及“初始面临的困难”，而不仅仅是“做了一个新功能”。&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;2. 所承担的角色与关键决策&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;可以适当展示一些深度思考，比如为什么选用了某项技术、重构的策略、组件化拆分方式、数据模型设计等。还可以强调在混乱或模糊中推动落地、制定标准、推动流程优化等能力。&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;3. 结果与影响&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;不仅仅是“功能上线”，更重要的是对业务、团队或系统带来了什么实质性的改进，比如性能提升、迭代效率变高、可维护性提升、用户体验改善、业务增长支持等。&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;4. 成长与反思&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;有价值的项目往往伴随着“认知升级”，比如原来低估了技术债的影响，或者通过实际落地理解了“领域驱动设计”的意义。这个部分体现出个人复盘能力。&lt;/p&gt;
&lt;/details&gt;
&lt;h2 id="question-subjective-68fff5a7d80c"&gt;2. 平时用哪个地图软件，你觉得百度地图和高德地图有什么区别？&lt;/h2&gt;
&lt;h3 id="题目要点-1"&gt;题目要点&lt;/h3&gt;
&lt;p&gt;这个问题背后考察的是候选人&lt;strong&gt;是否能够从日常使用中提炼出产品与技术的理解&lt;/strong&gt;。如果能结合体验差异、技术架构、场景适配和生态思考给出分析，而不是停留在“哪个好用”这类主观评价层面，将更容易体现出产品敏感度和技术视野。&lt;/p&gt;
&lt;details&gt;
&lt;summary&gt;参考答案&lt;/summary&gt;
&lt;p&gt;这个问题虽然看似轻松，其实背后是面试官在考察&lt;strong&gt;候选人是否具备产品意识、用户视角以及对技术背后的生态和体验差异的敏感度&lt;/strong&gt;。&lt;/p&gt;
&lt;h3 id="回答可以从以下几个方向展开"&gt;回答可以从以下几个方向展开：&lt;/h3&gt;
&lt;h4 id="1-使用习惯和使用场景"&gt;1. 使用习惯和使用场景&lt;/h4&gt;
&lt;p&gt;地图类产品往往不止于“导航”，不同场景下用户会对产品有不同诉求，例如：&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;日常通勤更关注路线精准、避堵能力；&lt;/li&gt;
&lt;li&gt;出行规划更看重 POI（兴趣点）搜索能力；&lt;/li&gt;
&lt;li&gt;步行、骑行、公交路线推荐的体验也会有所差异。&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;可以结合真实使用感受，说明更倾向哪一个地图工具，并说明选择背后的产品逻辑。&lt;/p&gt;
&lt;h4 id="2-产品体验差异"&gt;2. 产品体验差异&lt;/h4&gt;
&lt;p&gt;从前端视角，可以提到一些常见的 UI/UX 差异，例如：&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;高德地图整体交互更轻量，响应更快，视觉上偏简洁；&lt;/li&gt;
&lt;li&gt;百度地图在信息展示上更丰富，比如搜索结果信息量较大，适合城市探索或综合决策；&lt;/li&gt;
&lt;li&gt;两者在加载速度、动效、地图渲染逻辑、图层处理等方面也有细节差异。&lt;/li&gt;
&lt;/ul&gt;
&lt;h4 id="3-数据能力与技术架构差异"&gt;3. 数据能力与技术架构差异&lt;/h4&gt;
&lt;p&gt;可适当提及：&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;百度地图在自然语言搜索、智能推荐、AI 语义处理方面表现更突出；&lt;/li&gt;
&lt;li&gt;高德地图更注重实时交通、路线规划和精准避堵，背后依赖阿里生态中调度算法与实时数据的融合；&lt;/li&gt;
&lt;li&gt;技术开发角度，百度地图在 web 开发中更注重全家桶式工具链，而高德的 SDK 则更强调灵活性和接入效率。&lt;/li&gt;
&lt;/ul&gt;
&lt;h4 id="4-生态与平台联动"&gt;4. 生态与平台联动&lt;/h4&gt;
&lt;p&gt;从更高层次看，还可以提及两者在生态整合上的不同：&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;高德地图与支付宝、饿了么、飞猪等联动，强调生活服务整合；&lt;/li&gt;
&lt;li&gt;百度地图则依托百度搜索、百度 AI、大模型、自动驾驶等形成了更 AI 驱动的生态闭环。&lt;/li&gt;
&lt;/ul&gt;
&lt;/details&gt;
&lt;h2 id="question-subjective-081be73e1a37"&gt;3. 在多人协作开发中，若遇到接口定义不一致或代码冲突，你会如何推动问题解决？&lt;/h2&gt;
&lt;h3 id="题目要点-2"&gt;题目要点&lt;/h3&gt;
&lt;p&gt;这个问题的核心在于&lt;strong&gt;是否具备跨人、跨团队推动协作问题闭环的能力&lt;/strong&gt;。能够主动定位问题源头、推动规范和工具落地、在冲突中引导沟通达成共识，是一个成熟前端在协作场景中的重要价值体现。回答不应仅限于“怎么解决”，更要体现出“如何避免”和“如何沉淀机制”。&lt;/p&gt;</description></item><item><title>百度-地图-秋招 · 第 1 轮 · 二面</title><link>https://amatsuzero.github.io/LastStand/posts/frontend/interview-experiences/experience-41/round-59/</link><pubDate>Sat, 19 Jul 2025 06:27:27 +0000</pubDate><guid>https://amatsuzero.github.io/LastStand/posts/frontend/interview-experiences/experience-41/round-59/</guid><description>&lt;blockquote&gt;
&lt;p&gt;← &lt;a href="https://amatsuzero.github.io/LastStand/posts/frontend/interview-experiences/experience-41/round-55/"&gt;第 1 轮&lt;/a&gt; · &lt;a href="https://amatsuzero.github.io/LastStand/posts/frontend/interview-experiences/experience-41/"&gt;返回本次面经&lt;/a&gt; · &lt;a href="https://amatsuzero.github.io/LastStand/posts/frontend/interview-experiences/experience-41/round-60/"&gt;第 1 轮&lt;/a&gt; →&lt;/p&gt;
&lt;/blockquote&gt;
&lt;p&gt;&lt;strong&gt;本轮要点：&lt;/strong&gt; 本轮面试考察了前端基础能力、网络协议、Vue响应式原理、构建工具底层实现，以及手写能力与业务建模能力，重点在于深入理解底层原理和综合解决问题的能力。&lt;/p&gt;
&lt;p&gt;本轮共 11 道题。答案默认折叠，便于先自行作答。&lt;/p&gt;
&lt;h2 id="question-subjective-2b3736d3f494"&gt;1. 讲一下你的前端模块化的理解&lt;/h2&gt;
&lt;h3 id="题目要点"&gt;题目要点&lt;/h3&gt;
&lt;p&gt;模块化发展历程、ES Module 和 CommonJS 区别、模块加载机制、Tree-shaking原理。&lt;/p&gt;
&lt;details&gt;
&lt;summary&gt;参考答案&lt;/summary&gt;
&lt;p&gt;&lt;strong&gt;原理说明&lt;/strong&gt;&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;模块化的目的&lt;/strong&gt;：为了提高代码的可维护性、复用性和依赖管理能力，将代码组织为独立模块。&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;发展历程&lt;/strong&gt;：&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;无模块化（全局变量）&lt;/li&gt;
&lt;li&gt;IIFE 模式（立即执行函数）&lt;/li&gt;
&lt;li&gt;CommonJS（Node.js 标准，同步加载）&lt;/li&gt;
&lt;li&gt;AMD / CMD（异步模块定义）&lt;/li&gt;
&lt;li&gt;ES Module（ES6 标准模块系统，浏览器原生支持）&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;CommonJS vs ES Module&lt;/strong&gt;：&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;CommonJS 是同步加载，适用于服务端；ES Module 是静态分析+异步加载，适用于浏览器。&lt;/li&gt;
&lt;li&gt;ES Module 支持 Tree-shaking，CommonJS 不支持。&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;&lt;strong&gt;核心用法 + 示例代码&lt;/strong&gt;&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-text-size-adjust:none;"&gt;&lt;code class="language-js" data-lang="js"&gt;&lt;span style="display:flex;"&gt;&lt;span&gt;&lt;span style="color:#75715e"&gt;// ES Module
&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style="display:flex;"&gt;&lt;span&gt;&lt;span style="color:#66d9ef"&gt;export&lt;/span&gt; &lt;span style="color:#66d9ef"&gt;const&lt;/span&gt; &lt;span style="color:#a6e22e"&gt;add&lt;/span&gt; &lt;span style="color:#f92672"&gt;=&lt;/span&gt; (&lt;span style="color:#a6e22e"&gt;a&lt;/span&gt;, &lt;span style="color:#a6e22e"&gt;b&lt;/span&gt;) =&amp;gt; &lt;span style="color:#a6e22e"&gt;a&lt;/span&gt; &lt;span style="color:#f92672"&gt;+&lt;/span&gt; &lt;span style="color:#a6e22e"&gt;b&lt;/span&gt;;
&lt;/span&gt;&lt;/span&gt;&lt;span style="display:flex;"&gt;&lt;span&gt;&lt;span style="color:#66d9ef"&gt;import&lt;/span&gt; { &lt;span style="color:#a6e22e"&gt;add&lt;/span&gt; } &lt;span style="color:#a6e22e"&gt;from&lt;/span&gt; &lt;span style="color:#e6db74"&gt;&amp;#39;./utils.js&amp;#39;&lt;/span&gt;;
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;&lt;strong&gt;常见误区&lt;/strong&gt;&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;将 ES Module 和 CommonJS 混用，导致打包失败。&lt;/li&gt;
&lt;li&gt;忽视 ES Module 是静态结构，不能在运行时动态导入变量名模块（需使用 &lt;code&gt;import()&lt;/code&gt;）。&lt;/li&gt;
&lt;/ul&gt;
&lt;/details&gt;
&lt;h2 id="question-subjective-363169dded10"&gt;2. HTTP/2 解决 HTTP/1.1什么问题？&lt;/h2&gt;
&lt;h3 id="题目要点-1"&gt;题目要点&lt;/h3&gt;
&lt;p&gt;HTTP/2 优化点、HTTP/1.1 的瓶颈、性能原理&lt;/p&gt;</description></item><item><title>百度-地图-秋招 · 第 1 轮 · 一面</title><link>https://amatsuzero.github.io/LastStand/posts/frontend/interview-experiences/experience-41/round-55/</link><pubDate>Thu, 10 Jul 2025 14:52:42 +0000</pubDate><guid>https://amatsuzero.github.io/LastStand/posts/frontend/interview-experiences/experience-41/round-55/</guid><description>&lt;blockquote&gt;
&lt;p&gt;← 已是第一轮 · &lt;a href="https://amatsuzero.github.io/LastStand/posts/frontend/interview-experiences/experience-41/"&gt;返回本次面经&lt;/a&gt; · &lt;a href="https://amatsuzero.github.io/LastStand/posts/frontend/interview-experiences/experience-41/round-59/"&gt;第 1 轮&lt;/a&gt; →&lt;/p&gt;
&lt;/blockquote&gt;
&lt;p&gt;&lt;strong&gt;本轮要点：&lt;/strong&gt; 基础知识面不少，进一步考察实际工程和性能优化能力&lt;/p&gt;
&lt;p&gt;本轮共 12 道题。答案默认折叠，便于先自行作答。&lt;/p&gt;
&lt;h2 id="question-subjective-e78ee3f21e11"&gt;1. BFC的作用及触发条件，使用场景讲一下&lt;/h2&gt;
&lt;h3 id="题目要点"&gt;题目要点&lt;/h3&gt;
&lt;ul&gt;
&lt;li&gt;CSS 样式中 BFC 的概念、特性和触发条件&lt;/li&gt;
&lt;li&gt;BFC 应用场景：避免多列排版间隔折行问题、清除浮动、各区域形成隔离&lt;/li&gt;
&lt;/ul&gt;
&lt;details&gt;
&lt;summary&gt;参考答案&lt;/summary&gt;
&lt;h5 id="11-原理说明"&gt;1.1 原理说明&lt;/h5&gt;
&lt;p&gt;&lt;strong&gt;BFC (Block Formatting Context)&lt;/strong&gt;，即块级格式化上下文。它是 W3C CSS2.1 中的一类属性，是一个独立的布局环境，在该环境里，按照特定规则进行元素排列和布局。&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;主要特性：&lt;/strong&gt;&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;BFC 内部的元素不会和外部的元素受 margin 折行的影响&lt;/li&gt;
&lt;li&gt;BFC 可以包裹内部浮动元素，解决父容器高度不拉伸问题&lt;/li&gt;
&lt;li&gt;BFC 不会被浮动元素拉动&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;&lt;strong&gt;触发 BFC 的条件：&lt;/strong&gt;&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;样式中定义此元素为 float (non-none)&lt;/li&gt;
&lt;li&gt;正文模型 overflow 为 hidden, scroll, auto&lt;/li&gt;
&lt;li&gt;display 为 inline-block, table-cell, flex, grid, flow-root&lt;/li&gt;
&lt;li&gt;position 为 absolute 或 fixed&lt;/li&gt;
&lt;/ul&gt;
&lt;h5 id="12-核心用法--示例代码"&gt;1.2 核心用法 + 示例代码&lt;/h5&gt;
&lt;p&gt;&lt;strong&gt;场景1：清除浮动&lt;/strong&gt; 常用 BFC 包裹元素，使父元素的高度得以支撑&lt;/p&gt;</description></item></channel></rss>