字节跳动前端面试经验分享:重点考察CSS、JS、Vue与网络知识

需积分: 0 1 下载量 112 浏览量 更新于2024-07-01 收藏 4.78MB PDF 举报
"该资源主要涉及前端开发面试的相关知识点,包括CSS布局、定位、选择器优先级、JavaScript原型链、MVVM架构、Vue生命周期、组件通信、网络协议(TCP与UDP)、Promise以及算法题。内容以字节跳动前端校招面试为例,强调实战能力和基础理论的结合。" 面试中涉及的前端技术知识点详解: 1. **CSS垂直居中**:常见的实现方式有`display: flex`与`align-items: center`,`vertical-align: middle`配合`line-height`或`table-cell`,`position: absolute`结合`top: 50%`和`transform: translateY(-50%)`,以及`calc()`和`margin`等方法。 2. **CSS position属性**:主要有`static`(默认值,元素按正常文档流排列),`relative`(相对定位,相对于其原来的位置),`absolute`(绝对定位,相对于最近的非`static`定位祖先元素),`fixed`(固定定位,相对于浏览器窗口)和`sticky`(粘性定位,介于相对和固定定位之间)。 3. **CSS选择器优先级**:内联样式(如`style="..."`)> ID选择器(`#id`)> 类选择器(`.class`)、属性选择器(`[attr]`)和伪类(`:pseudo`)> 标签选择器(`element`)和伪元素(`::pseudo`)> 通配符选择器(`*`)和后代选择器(`selector1 selector2`)。相同优先级时,顺序在后的优先级更高。 4. **JavaScript原型链**:JavaScript中的对象可以通过原型链共享属性和方法。每个对象都有`__proto__`属性,指向创建它的构造函数的原型对象。原型链由`__proto__`链接,最终到达`Object.prototype`,再往上是`null`,形成一条链。 5. **new操作符**:`new`用于创建一个新对象,并将新对象的`[[Prototype]]`(即`__proto__`)链接到指定构造函数的原型。同时,`this`关键字在构造函数内部指向新创建的对象。 6. **MVVM与MVC**:MVVM(Model-View-ViewModel)是Vue.js等现代前端框架采用的架构模式,强调数据双向绑定,ViewModel作为桥梁,自动同步Model和View。MVC(Model-View-Controller)更传统,Controller处理用户交互,更新Model,Model变化后通知View更新。 7. **Vue生命周期**:Vue组件从创建到销毁的过程,包括`beforeCreate`、`created`、`beforeMount`、`mounted`、`beforeUpdate`、`updated`、`beforeDestroy`和`destroyed`等阶段。获取DOM信息通常在`mounted`阶段。 8. **Vue组件通信**:Vue提供了多种组件间通信方式,如`props`(父传子)、`$emit`(子传父)、`provide/inject`(跨级通信)、事件总线(Event Bus)以及Vuex(状态管理)。 9. **TCP与UDP**:TCP(Transmission Control Protocol)是面向连接的、可靠的传输协议,保证数据有序、无丢失,但有较高的开销。UDP(User Datagram Protocol)是无连接的、不可靠的传输协议,速度快但不保证数据完整性。 10. **TCP三次握手与四次挥手**:三次握手确保建立可靠连接,四次挥手释放连接。握手过程中确认序号和确认应答序号的交换,防止旧的数据包影响新的连接。 11. **Promise状态**:Promise有三种状态:`pending`(等待中)、`fulfilled`(已完成,又称 resolved)和`rejected`(已失败)。状态一旦改变,就不会再变,保证异步操作的单向数据流。 12. **手写Promise**:基本实现包括构造函数接收一个执行器函数,该函数接收`resolve`和`reject`两个回调,分别用于改变Promise状态。还需处理状态改变后的回调执行,以及错误捕获。 13. **算法题**: - 最长公共前缀:遍历字符串数组,找到第一个不为空的公共前缀作为结果。 - 多层数组嵌套降级:使用递归或迭代(如`Array.prototype.reduce()`)将嵌套数组展开为一维数组。 面试中,字节跳动强调实战能力,面试过程包含大量现场编码,对于基础理论和编程能力有较高要求。面试官友好,允许与面试官讨论问题,营造轻松氛围。
2022-08-08 上传