bdawn-CSDN博客

原创前端面试宝典【CSS篇】【10】

CSS 性能优化是提升网站性能的关键之一。优化 CSS 可以减少页面加载时间，提高渲染速度，并且增强用户体验。CSS 预编译语言是一种特殊的编程语言，它允许开发者以一种更加抽象和模块化的方式来编写 CSS 代码。预编译语言的主要目的是使 CSS 更易于维护、扩展和组织。

2024-08-28 09:00:00 117

如果只是简单的页面跳转并且需要传递少量数据，使用URL参数或SessionStorage/LocalStorage会比较合适；如果是需要在多个窗口或标签页之间共享数据，则可以考虑使用Broadcast Channel API。BroadcastChannel API 是一种允许不同源（如不同的窗口、标签页或 iframe）之间进行通信的方法。它使用了事件通道（Event Channel）的概念，允许消息在不同的浏览器上下文中广播。

2024-08-28 09:00:00 127

原创前端面试宝典【CSS篇】【9】

CSS 可以通过边框（border）的特性来绘制一个三角形。原理是利用一个元素的四个边框，并将元素的宽高设为0，仅保留边框的可见部分来形成三角形的形状。下面详细介绍如何使用 CSS 边框来绘制一个三角形。为了让 Chrome 浏览器支持小于 12px 的文字，可以采用几种不同的方法。这是因为 Chrome 浏览器中文版默认有一个最小字体大小限制，即 12px，以提高可读性。

2024-08-27 09:00:00 92

原创【企业级】像素流管理平台 V1.0

在当今快速发展的数字世界里，虚幻引擎的像素流技术为用户带来了前所未未有的视觉体验和交互方式。为了进一步提升开发效率和用户体验，我们推出了全新的像素流管理平台。通过一系列精心设计的功能，这个平台不仅简化了开发流程，还极大地提高了项目的部署效率。

2024-08-27 09:00:00 950

原创前端面试宝典【CSS篇】【8】

绝对单位适用于不需要缩放的场合，如打印样式。相对单位更适合Web设计，尤其是响应式设计。vw/vh 适用于基于视口尺寸的布局设计。em/rem 适用于字体大小相关的布局。

2024-08-26 14:12:41 1181

原创前端面试宝典【CSS篇】【7】

display: grid 是CSS中的一种布局模型，它允许你创建复杂的二维网格布局。与传统的布局方法相比，display: grid 提供了一种更加灵活的方式来组织页面元素，特别是当需要处理多列或多行布局时。display: table 是CSS中的一种布局模型，它模拟了HTML表格的行为，允许你使用类似于标签的方式来进行布局。这种布局方式可以让你使用表格样式的排版规则来组织元素，即使这些元素并不是真正的HTML表格。

2024-08-26 14:11:25 185

原创前端面试宝典【设计模式】【5】

组合模式是一种结构型设计模式，它允许你将对象组合成树形结构来表示“部分-整体”的层次结构。组合模式使得用户能一致地处理单个对象和组合对象，即无论处理的是单个对象还是组合对象，使用的接口和方法都是相同的。发布/订阅模式（Publish-Subscribe Pattern）是一种广泛应用于软件架构中的设计模式，它主要用于实现不同组件间的解耦以及消息的高效传递。这种模式的核心在于消息的发布者并不直接与订阅者交互，而是通过一个中间层——通常是消息代理或者主题来进行消息的传递。

2024-08-23 11:25:19 369

原创前端面试宝典【设计模式】【4】

策略模式是一种行为设计模式，它使你能在运行时改变对象的行为。策略模式定义了一系列的算法，并将每一个算法封装起来，使它们可以相互替换。策略模式让算法独立于使用它的客户。适配器模式是一种结构型设计模式，它允许不兼容的接口之间进行合作。适配器模式将一个类的接口转换成客户希望的另一个接口。适配器模式使得原本由于接口不兼容而不能一起工作的那些类可以一起工作。

2024-08-23 11:23:50 237

原创前端面试宝典【vue篇】【5】

虚拟 DOM (Virtual DOM) 是一种前端技术，用于提高 Web 应用程序的性能，尤其是在涉及频繁 UI 更新的情况下。Diff 算法是虚拟 DOM (Virtual DOM) 中的核心算法之一，用于比较新旧虚拟 DOM 树之间的差异，从而确定需要更新的真实 DOM 节点。虚拟 DOM主要用于提高 Web 应用程序的性能，尤其是在涉及频繁 UI 更新的应用场景中。虚拟 DOM 是一个轻量级的内存中的表示形式，用来模拟实际的 DOM 树结构。

2024-08-09 09:00:00 214

原创前端面试宝典【vue篇】【6】

在 Vue 中，key 的主要作用是在列表渲染和组件复用时提高应用的性能和准确性。keep-alive 是 Vue.js 中的一个内置组件，它的主要作用是在组件切换过程中将状态保留在内存中，从而避免重复渲染 DOM，提高应用性能和用户体验。Vue.nextTick 是 Vue.js 中的一个非常重要的方法，它主要用于解决 Vue 的异步更新机制带来的问题。

2024-08-09 09:00:00 110

原创前端面试宝典【Javascript篇】【7】

在JavaScript中，事件冒泡（Event Bubbling）和事件捕获（Event Capturing）是两种事件传播机制，它们定义了事件如何从嵌套的元素向外部或内部传播。JavaScript中的事件委托（Event Delegation）是一种优化事件处理的技术，它利用了事件冒泡机制来减少事件监听器的数量。

2024-08-08 09:00:00 182

原创前端面试宝典【Javascript篇】【8】

JavaScript 中的数据类型分为两大类：简单数据类型（也称为原始数据类型/基础数据类型）和复杂数据类型（主要是对象类型）。typeof 是一个一元操作符，用于检测变量或表达式的类型。它返回一个字符串，表示给定表达式的类型。instanceof 是一个二元操作符，用于检测一个对象是否是某个构造函数的实例。它返回一个布尔值。

2024-08-08 09:00:00 391

原创前端面试宝典【CSS篇】【6】

Flexbox（弹性盒布局模型）是 CSS3 中的一种布局模式，它提供了一种高效且灵活的方式来对容器中的项目进行布局、对齐和分配空间。Flexbox 特别适合于响应式设计，可以轻松地实现复杂的布局，而无需使用浮动或其他传统布局方法。Flexbox 提供了一种简单而强大的方式来布局元素，尤其适用于响应式设计和复杂的布局需求。通过理解和掌握 Flexbox 的基本属性，你可以创建出更加灵活和用户友好的界面。实现两栏布局（右侧自适应）和三栏布局（中间自适应）可以通过多种 CSS 技术来完成。

2024-08-07 09:00:00 175

原创前端面试宝典【设计模式】【3】

装饰器模式是一种结构型设计模式，它允许在不改变对象结构的情况下动态地给对象添加新的功能。装饰器模式提供了一种灵活的方式来扩展对象的功能，而不是通过继承的方式。代理模式是一种结构型设计模式，它通过创建一个代理对象来控制对另一个对象（真实主题或目标对象）的访问。代理模式的主要目的是为了增加对真实对象的访问控制，并且可以在不修改真实对象的前提下添加额外的功能。

2024-08-07 09:00:00 282

原创前端面试宝典【CSS篇】【5】

CSS 选择器的优先级（也称为“特异性”或“specificity”）是指当多个 CSS 规则应用于同一个 HTML 元素时，哪个规则会被应用。CSS 的优先级机制确保了样式规则能够按照预期的方式生效。在 CSS 中，一些属性是可以被子元素继承的，这意味着子元素会自动采用父元素的这些属性值。

2024-08-06 10:43:32 326

原创前端面试宝典【CSS篇】【4】

盒子模型是 CSS 中用于描述 HTML 元素布局方式的一个概念。在 CSS 中，每个元素都被视为一个矩形盒子，这个盒子由几个不同的部分组成：内容区（content）、内边距（padding）、边框（border）和外边距（margin）。box-sizing 属性是 CSS 中的一个重要属性，它用于定义元素的盒模型是如何工作的。CSS Sprites（也称为 CSS 精灵或 CSS 雪碧图）是一种优化网页性能的技术，它将多个小图像合并成一个单一的大图像文件

2024-08-06 10:39:23 893

原创前端面试宝典【HTML篇】【6】

canvas标签是 HTML5 中引入的一个新元素，它提供了一个矩形区域，可以在其中绘制图形或图像。canvas 本身并不具备绘图能力，它只是一个容器，所有的绘图工作都需要通过 JavaScript 来完成。svg标签是用于定义可缩放矢量图形 (Scalable Vector Graphics, SVG) 的容器。SVG 是一种基于 XML 的图形格式，它允许开发者创建高质量的矢量图形，这些图形可以无限放大而不失真。SVG 图形不仅支持静态图像，还支持动画和交互式图形。

2024-08-05 17:22:58 333

原创前端面试宝典【HTML篇】【5】

form标签用于定义 HTML 表单，它用于收集用户输入的数据。而input 标签则是表单中最常用的元素之一，用于创建各种类型的输入控件。template 标签是 HTML5 中引入的一个新元素，用于定义文档中的不可见模板。这些模板可以被脚本动态地克隆并插入到文档的可见部分中，从而实现动态内容的快速构建。

2024-08-05 17:20:59 153

原创前端面试宝典【导航】

我们的【前端面试宝典】正是为此而来。由拥有多年一线实战经验的资深工程师亲自授课，结合最新的行业动态与实战案例，旨在全面提升你的技术实力与面试技巧。

2024-08-02 09:00:00 705

原创前端面试宝典【CSS篇】【3】

transition 和 animation 都是CSS中用于创建视觉效果和动态变化的重要属性，但它们之间存在一些关键差异。BFC（Block Formatting Context，块格式化上下文）是CSS布局中的一个重要概念，它定义了块级元素如何在页面上进行布局以及它们与其他元素的相互作用。BFC创建了一个独立的布局环境，在这个环境中，块级元素按照特定的规则进行定位和尺寸计算。CSS的盒子模型是描述网页元素布局和尺寸计算的基础模型。每个HTML元素在渲染时都会被浏览器解释成一个矩形的盒子。

2024-08-02 09:00:00 245

原创前端面试宝典【HTML篇】【4】

HTML实体是HTML中用于表示特殊字符的一种编码方式。``标签是HTML中的一种特殊标签，用于在用户的浏览器不支持或禁用了JavaScript的情况下提供备用内容或功能。在HTML中，``和``标签分别用于不同的目的，它们都是用来处理CSS样式的方式，但有着本质的区别。

2024-08-01 16:29:41 319

原创前端面试宝典【HTML篇】【3】

HTML，全称为HyperText Markup Language，即超文本标记语言，是一种用于创建网页的标准标记语言。它通过一系列预定义的元素来描述文档的结构和内容，这些元素被称为“标签”（Tags），它们可以嵌套在文档中，形成树状的文档对象模型（DOM）。``标签是HTML文档中的一种特殊标签，主要用于提供关于HTML文档的元数据（metadata），这些数据通常不是直接显示给用户的，而是被浏览器、搜索引擎或其他网络服务用来解析和理解文档的上下文信息。

2024-08-01 16:24:13 227

原创前端面试宝典【设计模式】【2】

工厂模式是一种创建型设计模式，它提供了一种创建对象的机制，而不暴露创建逻辑，将对象的实例化推迟到子类。工厂模式的主要目的是封装对象的创建过程，使其能够独立于客户端代码，从而提高系统的可扩展性和灵活性。工厂模式通常分为三种类型：简单工厂模式、工厂方法模式和抽象工厂模式。模块模式是一种在 JavaScript 中实现封装和私有成员的常用设计模式。它允许你创建具有私有变量和公共方法的对象，从而避免全局命名空间的污染，并提供更好的代码组织和可维护性。模块模式通常使用立即执行的函数表达式来创建私有作用域。

2024-07-31 15:18:24 335

原创前端面试宝典【设计模式】【1】

观察者模式（Observer Pattern）是一种行为设计模式，它定义了对象之间的一对多依赖关系，以便当一个对象的状态改变时，所有依赖于它的对象都会得到通知并自动更新。这种模式通常用于实现事件处理系统，其中“主题”（Subject）对象维护着一个观察者列表，并在状态发生变化时通知它们。单例模式是一种常用的软件设计模式，它保证一个类只有一个实例，并提供一个全局访问点来访问这个实例。这种模式在很多情况下都非常有用，比如管理共享资源（如数据库连接、线程池、日志对象等），或者当系统只需要一个全局配置点时。

2024-07-31 15:17:56 285

原创前端面试宝典【vue篇】【4】

在 Vue.js 中，动态绑定 class 和 style 是非常常见的需求，特别是在构建响应式和动态 UI 时。v-model 是 Vue.js 中的一个特殊的指令，用于实现表单输入和其他组件的双向数据绑定。在 Vue 2 和 Vue 3 中，v-model 的实现原理有所不同，但核心思想是相同的：它简化了数据的同步过程，使得开发者无需手动编写事件监听器和数据更新代码。

2024-07-29 15:34:59 367

原创前端面试宝典【vue篇】【3】

SPA（Single Page Application，单页面应用）是一种现代Web开发模式，其中整个用户界面在一个单一的HTML页面上运行，而不需要为每个页面或视图加载新的HTML文档。在SPA中，当用户与应用交互时，例如点击链接或提交表单，应用会通过AJAX调用从服务器获取数据，并动态地更新页面的部分内容，而不是刷新整个页面。这种模式提供了类似桌面应用的流畅体验，因为用户不会经历页面加载的延迟和视觉上的中断。

2024-07-29 15:34:24 269

原创前端面试宝典【CSS篇】【2】

display: block; 和 display: inline; 是CSS中用来控制元素的显示方式和布局行为的两个重要属性值。它们的主要区别在于元素在页面布局中的行为和外观。在CSS中，有几种方法可以实现元素的水平居中。具体选择哪种方法取决于你的具体需求，比如元素的类型（块级或行内）、父元素是否有固定宽度、以及是否需要响应式设计等因素。

2024-07-28 09:00:00 72

原创前端面试宝典【CSS篇】【1】

分析比较 opacity: 0、visibility: hidden、display: none 优劣和适用场景。在CSS（层叠样式表）中，浮动（float）是一种布局机制，允许元素在其容器内向左或向右移动，同时允许其他内容围绕它流动。清除浮动是Web开发中常见的需求，特别是在使用CSS布局时，以确保父元素能够正确包裹其浮动的子元素。

2024-07-28 09:00:00 57

原创前端面试宝典【vue篇】【1】

在前端开发中，MVVM（Model-View-ViewModel）是一种设计模式，用于简化用户界面的开发，特别是当涉及到复杂的交互式应用时。Vue.js 实现数据双向绑定的核心机制是通过数据劫持结合发布者-订阅者模式。ES6（ECMAScript 2015）中的 Proxy 是一种特殊的构造函数，它允许你拦截并自定义对象的基本操作。

2024-07-28 09:00:00 180

原创前端面试宝典【vue篇】【2】

Vue.js 的生命周期是指一个 Vue 实例从创建到销毁的整个过程。这个过程被细分为多个阶段，每个阶段都有对应的生命周期钩子函数，开发者可以利用这些钩子来执行特定的代码逻辑。Vue 3 中的组合式 API 是一种全新的编程范式，它允许开发者以更灵活和可复用的方式编写组件逻辑。组合式 API 的核心是 setup() 函数，它提供了更强大的功能来管理组件的状态和行为。

2024-07-28 09:00:00 79

原创前端面试宝典【HTML篇】【1】

HTML 页面的渲染过程是浏览器将 HTML、CSS 和 JavaScript 转换为用户可以在屏幕上看到的可视化界面的过程。DOM (Document Object Model) 的构建和 CSSOM (CSS Object Model) 的构建主要是在浏览器的主渲染线程中进行的，但它们的构建过程可以交错进行，并且CSS资源的下载可以异步进行，不阻塞DOM的构建。

2024-07-27 09:00:00 405

原创前端面试宝典【HTML篇】【2】

HTML5 是万维网联盟（W3C）制定的一个标准，旨在改进网页应用程序的开发和用户体验。它引入了许多新特性，包括新的语义化标签、多媒体支持、绘图能力、离线存储、拖放功能、表单控件增强以及APIs等。localStorage 和 sessionStorage 是 HTML5 引入的两种客户端存储机制，它们提供了比传统的 cookies 更强大和灵活的存储方式。

2024-07-27 09:00:00 84

原创前端面试宝典【Javascript篇】【5】

闭包（Closure）是JavaScript中一个非常重要的概念，它涉及到函数和作用域的高级特性。闭包使得函数能够访问并操作其创建时所在的作用域中的变量，即使在函数被调用时，这些变量已经不在其直接作用域内。JavaScript的执行上下文栈（Execution Context Stack）和作用域链（Scope Chain）是理解JavaScript运行时行为的关键概念，它们对于变量查找、函数调用和闭包的理解至关重要。

2024-07-26 09:00:00 53

原创前端面试宝典【Javascript篇】【6】

在JavaScript中，Promise是一种用于处理异步操作的对象，它代表了一个最终可能会完成或失败的值，并且具有一个与之关联的最终值。Promise的设计目的是为了改进回调函数的使用，尤其是在处理多个异步操作时，避免所谓的“回调地狱”（Callback Hell）现象，即多层嵌套的回调函数导致的代码可读性和可维护性降低。async/await是ECMAScript 2017（ES8）引入的特性，用于简化异步编程，使异步代码看起来更像同步代码，同时保持非阻塞的特性。

2024-07-26 09:00:00 138

原创前端面试宝典【Javascript篇】【3】

异步加载JavaScript脚本是现代Web开发中常用的技术，它有助于改善页面加载性能，避免阻塞用户界面。以下是一些常用的异步加载JS脚本的方式

2024-07-25 10:00:00 179

原创前端面试宝典【Javascript篇】【4】

JavaScript中的原型链是实现继承和属性查找机制的基础。在JavaScript中，每个对象都有一个原型对象，这个原型对象可以是另一个对象的实例或者是Object.prototype。原型链就是一系列的原型对象，它们通过Object.getPrototypeOf(obj)获取obj这个对象的原型对象，同样的方法获取原型对象的原型对象，形成一个链式结构。

2024-07-25 10:00:00 215

原创前端面试宝典【Javascript篇】【2】

深拷贝和浅拷贝是两种不同的对象复制策略，主要用于复制包含复杂数据结构的对象，如对象和数组。它们之间的主要区别在于如何处理对象中的引用类型属性。

2024-07-24 19:05:40 279

原创前端面试宝典【Javascript篇】【1】

在JavaScript中，new操作符用于调用一个构造函数并创建一个新的对象。当使用new关键字调用一个构造函数时，会经历以下几个步骤

2024-07-24 19:05:20 277

原创前端http请求那些事

在前端开发中，HTTP请求是与后端服务通信的基石，无论是加载静态资源，还是与API交互，都离不开HTTP请求。本文将深入探讨前端HTTP请求的各种技术和最佳实践，从原生API到高级库，帮助你更好地理解和掌握这一核心技能。

2024-07-18 15:24:41 884

原创深入剖析CommonJS modules和ECMAScript modules

在 JavaScript 生态系统中，模块化编程已经成为构建大型、可维护应用的关键技术。CommonJS 和 ECMAScript Modules (ESM) 作为两种主要的模块化标准，各自承载着历史的重量和未来的愿景。本文将深入探讨这两种模块系统的设计哲学、语法差异、运行时行为以及在现代开发环境中的地位变迁。

2024-07-18 15:24:24 1172