👨面试官:后端一次性给你一千万条数据,你该如何优化渲染
问题背景 在去年的一场面试中,面试官向我提了一个问题: 面试官:后端一次性给你一千万条数据,渲染到页面上发生卡顿,你该怎么优化? 我:我会问候后端(bushi) 实际上我的回答是:如果没办法改变后端的情况下,我会避免给这种大数据量赋予响应式,然后手动 分页渲染 。 面试官:不对哈,用 来优化。 我:??? 这段时间突然想起这个问题,决定试一下实际遇到这种情况到底该怎么优化。 测试环境搭建 前端实现(Vue3) 后端实现(NestJS)...
JavaScript 原型链深度解析
JavaScript 原型链深度解析:从概念到实践 前言 JavaScript 原型链是前端开发中最重要也是最容易混淆的概念之一。理解原型链不仅有助于我们掌握 JavaScript 的面向对象编程,更是深入理解继承、方法查找等核心机制的关键。本文将从基础概念开始,逐步深入到原型链的实际应用。 1\. 核心概念理解 什么是原型? 在 JavaScript 中,每个对象都有一个内部属性指向另一个对象,这个被指向的对象就是原型。原型本身也是一...
JavaScript 中的this
引言:为什么 让开发者又爱又恨? 在 JavaScript 的生态系统中, 是一个极具争议的核心概念。它灵活、动态,却又常常“出人意料”。许多开发者在调试时都会遇到类似问题: “为什么 是 ?” “明明是对象的方法,怎么 指向了 ?” “箭头函数到底有没有 ?” 这些问题的背后,是 JavaScript 独特的 执行上下文机制 与 动态绑定策略 。与 Java、C++ 等静态绑定语言不同,JavaScript 的 是在函数 运行时 根据...
JavaScript 运行机制详解:再谈 Event Loop
常常在各种场合被问到类似下面代码的输出顺序。 如果你能毫不犹豫地答出 ,并解释其原因,那么你对 JS 的异步机制已经有了不错的理解。如果你还有一丝困惑,希望本文能帮助你彻底梳理清楚。 这个问题的背后,是整个 JavaScript 的运行模型(runtime model),也就是我们常说的“事件循环”(Event Loop)。理解它,是前端工程师进阶的必经之路。 为什么 JavaScript 是单线程? 首先,我们必须记住一个基本事实:...
原型链 & this 指向总结
一、JavaScript 原型链 1\. 基础概念 每个对象都有一个 内部属性 \[\[Prototype\]\] ,可以通过 或 访问。 构造函数 有一个 属性,指向一个对象,这个对象作为实例的原型。 查找属性的顺序: 实例 → 原型 → 原型的原型 … → Object.prototype → null 2\. 典型例题示意 | 表达式 | 值/说明 | | | | | | 1 (实例自身没有,去原型链找) | | | Foo.pr...
眼前一亮的HTTP 🌐
🌐 HTTP协议基础 什么是HTTP? HTTP(HyperText Transfer Protocol)超文本传输协议 是互联网上应用最为广泛的一种网络协议。它是一个基于 请求 响应 模式的、 无状态 的应用层协议,常基于TCP协议传输。 OSI七层协议模型 面试考点 :能够清晰说出HTTP位于应用层,基于TCP协议,并理解各层的作用。 🚀 HTTP版本演进史 HTTP/0....
javascript类数组
前言 在JavaScript开发中,我们经常会遇到一些看起来像数组,但实际上并不是真正数组的对象,这些对象被称为 “类数组对象(Array like Objects)” 。 一、什么是类数组对象? 类数组对象是指那些具有以下特征的对象: 1. 拥有 属性,表示元素的数量 2. 拥有索引元素(0, 1, 2…),可以通过索引访问 3. 不具备数组原型上的方法(如 , , 等) 简单来说,类数组对象"看起来像"数组,但它们并不是从 构造函数...
堆栈/异步/执行栈连环问
1\. 数据类型分别存在哪里? (1) ,b输出什么? 关键点 : 是 地址复制 ,不是深拷贝。a断开连接,b不受影响。 「Q1: 如果 ,a再访问会怎样?❓」 A1: a已为null,但若a未被赋null, 也会变成"改了",因为指向同一堆对象!👉继续看? 「Q2: 什么情况下b会变null?💥」 A2: 只有 才行。或者全局作用域被销毁(如页面关闭)。 「Q3: 这种机制叫什么?🤯」 A3: 按引用传递(pass by ref...
前端路由揭秘:单页应用流畅导航的核心技术
前端路由揭秘:单页应用流畅导航的核心技术 为什么现代网页可以在不刷新的情况下切换页面?URL变化但页面却不会重新加载的秘密是什么?这一切都要归功于前端路由——单页应用(SPA)的核心技术。 什么是前端路由? 在传统多页应用中,每次点击链接都会触发 整页刷新 :浏览器向服务器请求新HTML页面,重新加载所有资源(CSS、JS等)。这种体验明显卡顿且效率低下。 前端路由则完全不同——它是 在单页应用中建立URL与组件映射关系的导航系统 。想...