京东-技术中台-校招 · 第 1 轮 · 一面

Fri, 27 Jun 2025 05:48:05 +0000

← 已是第一轮 · 返回本次面经 · 第 1 轮 →

本轮要点： 本次面试深度考察JavaScript核心原理（闭包、继承实现）、前端框架（Vue响应式机制、虚拟DOM性能、Vue vs React区别）、性能优化（高并发请求处理、HTTP/2应用）、前端安全（XSS/CSRF防御）。难点聚焦于Vue响应式系统限制的解决（如动态字段更新）、复杂布局实现（自适应流式），以及高效算法设计（O(n)去重）。

本轮共 14 道题。答案默认折叠，便于先自行作答。

1. 自我介绍

题目要点

个人背景、能力、经验。

参考答案

我叫[姓名]，毕业于[学校]，专业是[专业]。我有[X]年的前端开发经验，熟练掌握HTML、CSS、JavaScript等前端技术，熟悉Vue.js和React框架。在项目中，我注重代码质量和用户体验，善于解决复杂的技术问题。我曾参与过多个大型项目的开发，例如[项目名称]，负责[具体工作]，通过优化代码结构和性能，提升了页面加载速度和用户体验。

2. 怎么学习javascript的？讲一下闭包，自己的使用场景

题目要点

JavaScript学习方法、闭包概念及应用。

参考答案

学习JavaScript时，我首先从基础语法入手，通过阅读经典书籍如《JavaScript高级程序设计》来系统地学习。闭包是JavaScript中的一个重要概念，它允许函数记住并访问其创建时所在的作用域链中的变量。闭包的使用场景很多，比如在事件处理中，可以使用闭包来保存事件相关的数据。例如，创建一个计数器函数，每次调用时返回当前的计数值，利用闭包可以保持计数器的状态。

3. Javascript如何实现继承？

题库原题：Javascript如何实现继承？

题目要点

1. 原型链继承

通过将一个构造函数的实例作为另一个构造函数的原型，实现属性和方法的继承。

特点

简单易实现。
缺点是父类实例的属性会被所有子类实例共享。

2. 借用构造函数（经典继承）

通过在子类构造函数中调用父类构造函数，实现属性的继承。

特点

避免了原型链继承共享属性的问题。
但无法继承父类的原型方法。

3. 组合继承（原型链+借用构造函数）

结合原型链继承和借用构造函数的方法，既调用父类构造函数，又将父类原型赋值给子类原型。

特点

可以继承实例属性和原型方法。
需要注意避免构造函数属性的多次调用。

4. 原型式继承

使用一个函数来创建一个新对象，并将这个新对象的原型指向另一个对象。

特点

适用于对象之间的属性继承，不涉及构造函数。

5. 寄生式继承

基于原型式继承，但添加了额外的包装函数，以提供更好的控制和灵活性。

特点

通过创建对象的副本来实现继承，避免修改原始对象。

6. ES6 类继承

使用class关键字和extends关键字实现继承。

特点

语法简洁，易于理解。
底层仍然是基于原型链实现。

参考答案

一、是什么

继承（inheritance）是面向对象软件技术当中的一个概念。

如果一个类别B“继承自”另一个类别A，就把这个B称为“A的子类”，而把A称为“B的父类别”也可以称“A是B的超类”

继承的优点

继承可以使得子类具有父类别的各种属性和方法，而不需要再次编写相同的代码

京东-技术中台-校招 · 第 1 轮 · 二面

Fri, 27 Jun 2025 05:48:05 +0000

← 第 1 轮 · 返回本次面经 · 已是最后一轮 →

本轮要点： 本次面试聚焦CSS布局核心问题（浮动清除、BFC机制）、高频JS手写能力（防抖函数）、工程化实践（TS迁移痛点、Vue3升级策略）、深度性能优化（缓存协同更新、Tree Shaking原理）。难点在于浮动导致的布局塌陷解决方案、CDN与本地缓存协同策略设计，以及复杂框架迁移的兼容性处理。

本轮共 11 道题。答案默认折叠，便于先自行作答。

1. 浮动元素导致的布局错乱应该如何解决？

题目要点

CSS浮动布局及解决方案。

参考答案

浮动元素会导致其父元素高度塌陷，从而影响布局。解决方法有：

1. 清除浮动：在浮动元素后面添加一个空的`div`，设置`clear: both`。
2. 使用伪元素清除浮动：在父元素上使用`::after`伪元素，设置`clear: both`。

.parent::after {
 content: "";
 display: block;
 clear: both;
}

1. 使用`overflow: hidden`：给父元素设置`overflow: hidden`，但可能会隐藏超出部分的内容。
2. 使用`BFC`（块级格式化上下文）：通过设置`display: flow-root`或`overflow: auto`等属性，使父元素形成一个独立的BFC，从而包含浮动元素。

2. 实现一个固定侧边栏+自适应主内容的布局

题目要点

CSS布局技巧。

参考答案

可以使用flexbox布局实现固定侧边栏和自适应主内容的布局：

<div class="container">
 <div class="sidebar">侧边栏</div>
 <div class="main">主内容</div>
</div>

.container {
 display: flex;
}
.sidebar {
 width: 200px; /* 固定宽度 */
 background-color: #f0f0f0;
}
.main {
 flex: 1; /* 自适应宽度 */
 background-color: #ffffff;
}

3. 实现 debounce（防抖）函数

题库原题：实现 debounce（防抖）函数

京东-技术中台-校招 on Last Stand

京东-技术中台-校招 · 第 1 轮 · 一面

1. 自我介绍

题目要点

2. 怎么学习javascript的？讲一下闭包，自己的使用场景

题目要点

3. Javascript如何实现继承？

题目要点

1. 原型链继承

特点

2. 借用构造函数（经典继承）

特点

3. 组合继承（原型链+借用构造函数）

特点

4. 原型式继承

特点

5. 寄生式继承

特点

6. ES6 类继承

特点

一、是什么

京东-技术中台-校招 · 第 1 轮 · 二面

1. 浮动元素导致的布局错乱应该如何解决？

题目要点

2. 实现一个固定侧边栏+自适应主内容的布局

题目要点

3. 实现 debounce（防抖）函数