<?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-37/</link><description>Recent content in 腾讯-暑期实习 on Last Stand</description><generator>Hugo</generator><language>zh-cn</language><lastBuildDate>Sun, 29 Jun 2025 13:39:17 +0000</lastBuildDate><atom:link href="https://amatsuzero.github.io/LastStand/posts/frontend/interview-experiences/experience-37/index.xml" rel="self" type="application/rss+xml"/><item><title>腾讯-暑期实习 · 第 1 轮 · 一面</title><link>https://amatsuzero.github.io/LastStand/posts/frontend/interview-experiences/experience-37/round-48/</link><pubDate>Sun, 29 Jun 2025 13:39:17 +0000</pubDate><guid>https://amatsuzero.github.io/LastStand/posts/frontend/interview-experiences/experience-37/round-48/</guid><description>&lt;blockquote&gt;
&lt;p&gt;← 已是第一轮 · &lt;a href="https://amatsuzero.github.io/LastStand/posts/frontend/interview-experiences/experience-37/"&gt;返回本次面经&lt;/a&gt; · 已是最后一轮 →&lt;/p&gt;
&lt;/blockquote&gt;
&lt;p&gt;&lt;strong&gt;本轮要点：&lt;/strong&gt; 主要几种在以下几个方向：&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;vue3原理&lt;/li&gt;
&lt;li&gt;前端工程化：webpack、vite、pnpm、monorepo&lt;/li&gt;
&lt;li&gt;前端安全&lt;/li&gt;
&lt;li&gt;计算机网络&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;本轮共 21 道题。答案默认折叠，便于先自行作答。&lt;/p&gt;
&lt;h2 id="question-subjective-20e6c69e8673"&gt;1. JSON数组扁平化&amp;amp;数据过滤&lt;/h2&gt;
&lt;p&gt;假设有一个模拟接口 &lt;code&gt;fetchData()&lt;/code&gt;，返回 Promise 对象，数据格式为：&lt;br&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-json" data-lang="json"&gt;&lt;span style="display:flex;"&gt;&lt;span&gt;{
&lt;/span&gt;&lt;/span&gt;&lt;span style="display:flex;"&gt;&lt;span&gt;&lt;span style="color:#f92672"&gt;&amp;#34;data&amp;#34;&lt;/span&gt;: [
&lt;/span&gt;&lt;/span&gt;&lt;span style="display:flex;"&gt;&lt;span&gt; { &lt;span style="color:#f92672"&gt;&amp;#34;id&amp;#34;&lt;/span&gt;: &lt;span style="color:#ae81ff"&gt;1&lt;/span&gt;, &lt;span style="color:#f92672"&gt;&amp;#34;value&amp;#34;&lt;/span&gt;: &lt;span style="color:#ae81ff"&gt;5&lt;/span&gt; },
&lt;/span&gt;&lt;/span&gt;&lt;span style="display:flex;"&gt;&lt;span&gt; { &lt;span style="color:#f92672"&gt;&amp;#34;id&amp;#34;&lt;/span&gt;: &lt;span style="color:#ae81ff"&gt;2&lt;/span&gt;, &lt;span style="color:#f92672"&gt;&amp;#34;value&amp;#34;&lt;/span&gt;: &lt;span style="color:#ae81ff"&gt;10&lt;/span&gt;, &lt;span style="color:#f92672"&gt;&amp;#34;children&amp;#34;&lt;/span&gt;: [
&lt;/span&gt;&lt;/span&gt;&lt;span style="display:flex;"&gt;&lt;span&gt; { &lt;span style="color:#f92672"&gt;&amp;#34;id&amp;#34;&lt;/span&gt;: &lt;span style="color:#ae81ff"&gt;3&lt;/span&gt;, &lt;span style="color:#f92672"&gt;&amp;#34;value&amp;#34;&lt;/span&gt;: &lt;span style="color:#ae81ff"&gt;8&lt;/span&gt; } ]
&lt;/span&gt;&lt;/span&gt;&lt;span style="display:flex;"&gt;&lt;span&gt; }
&lt;/span&gt;&lt;/span&gt;&lt;span style="display:flex;"&gt;&lt;span&gt;]
&lt;/span&gt;&lt;/span&gt;&lt;span style="display:flex;"&gt;&lt;span&gt;}
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;要求：&lt;br&gt;&lt;/p&gt;
&lt;ol&gt;
&lt;li&gt;&lt;strong&gt;将接口返回的嵌套数据结构扁平化为一维数组&lt;/strong&gt;；&lt;br&gt;&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;筛选出 &lt;strong&gt;&lt;code&gt;value&lt;/code&gt;&lt;/strong&gt; 大于等于 8 的元素&lt;/strong&gt;；&lt;br&gt;&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;按 &lt;strong&gt;&lt;code&gt;id&lt;/code&gt;&lt;/strong&gt; 升序排列后，渲染为 &lt;strong&gt;&lt;code&gt;&amp;lt;ul&amp;gt;&lt;/code&gt;&lt;/strong&gt; 列表&lt;/strong&gt;。&lt;br&gt;&lt;/li&gt;
&lt;/ol&gt;
&lt;p&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-html" data-lang="html"&gt;&lt;span style="display:flex;"&gt;&lt;span&gt;&amp;lt;&lt;span style="color:#f92672"&gt;ul&lt;/span&gt;&amp;gt;
&lt;/span&gt;&lt;/span&gt;&lt;span style="display:flex;"&gt;&lt;span&gt;&amp;lt;&lt;span style="color:#f92672"&gt;li&lt;/span&gt;&amp;gt;id:2, value:10&amp;lt;/&lt;span style="color:#f92672"&gt;li&lt;/span&gt;&amp;gt;
&lt;/span&gt;&lt;/span&gt;&lt;span style="display:flex;"&gt;&lt;span&gt;&amp;lt;&lt;span style="color:#f92672"&gt;li&lt;/span&gt;&amp;gt;id:3, value:8&amp;lt;/&lt;span style="color:#f92672"&gt;li&lt;/span&gt;&amp;gt;
&lt;/span&gt;&lt;/span&gt;&lt;span style="display:flex;"&gt;&lt;span&gt;&amp;lt;/&lt;span style="color:#f92672"&gt;ul&lt;/span&gt;&amp;gt;
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;h3 id="题目要点"&gt;题目要点&lt;/h3&gt;
&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;递归与数据结构处理&lt;/strong&gt;：考查候选人是否理解如何处理嵌套结构。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;数组操作基础&lt;/strong&gt;：filter/sort/map 等高阶方法掌握情况。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;异步处理能力&lt;/strong&gt;：是否熟悉 &lt;code&gt;Promise&lt;/code&gt; 的使用。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;原生 DOM 操作&lt;/strong&gt;：不用框架的情况下渲染 HTML。&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;此题本质是一个数据处理与 DOM 渲染综合题，目标包括：&lt;/p&gt;</description></item></channel></rss>