搜索建议优化方案背景 在搜索框中，用户输入关键词后，服务器会根据关键词自动补全，并展示在搜索框下方的下拉列表中，如果用户输入的很快，我们应该每个请求都发吗？请求的顺序是否能与响应的顺序一致？ 目标 保证用户输入的关键词与服务器返回的关键词顺序一致。 减少请求次数。 方案 使用防抖 也就是在一段时间内只发送最后一次请求，一段时间内连续请求会取消上一次的请求。 那如果用户在请求成功发送，服务器还没响应的期间再次发送请求呢？服务器能保证响应的顺序吗？ 所以防抖也没解决根源性问题。 使用节流 也就是在一段时间内只发送第一次请求，后续请求不在处理。 用户快速输入节流无法处理 。 优解方案 在每次请求放送时，取消上一次的请求。const search = document.querySelector("#app .search");//创建一个控制器let controller;search.onchange = async (e) => { //取消上一次的请求 controller && controller.ab ...

knex 基于js的查询生成器,允许使用js代码来生成qsl语句新建数据库CREATE DATABASE `user` 设置编码DEFAULT CHARACTER SET = 'utf8mb4'; 新建表 CREATE TABLE users( id INT NOT NULL PRIMARY KEY AUTO_INCREMENT , name VARCHAR(20) NOT NULL COMMENT '姓名', age INT NOT NULL COMMENT '年龄', gender VARCHAR(10) NOT NULL COMMENT '性别', create_time TIMESTAMP DEFAULT CURRENT_TIMESTAMP COMMENT '创建时间')COMMENT '用户表'; id int类型(INT) 非空校验(NOT NULL ) 主键(PRIMARY KEY) 自增(AUTO_INCREMENT) TIMES ...

LRU 缓存置换 LRU（Least Recently Used）(最久未使用)缓存置换算法 在限定的空间已存满数据时，再要增加缓存应当先把一个最近未使用的数据置换出去，然后把新的数据插入到缓存中。 实现class LRUCache { #map; #length; constructor(len) { this.#length = len; this.#map = new Map(); } has(key) { return this.#map.has(key); } //获取缓存->获取到了就是最新的缓存访问，所以需要添加到队列头部 get(key) { if (!this.has(key)) return null; let value = this.#map.get(key); //删除当前key，添加到队列头部 this.#map.delete(key); this.#map.set(key, value); return value; ...

什么是并发？ 你吃饭吃到一半，电话来了，你一直到吃完了以后才去接，这就说明你不支持并发也不支持并行。 你吃饭吃到一半，电话来了，你停了下来接了电话，接完后继续吃饭，这说明你支持并发。 你吃饭吃到一半，电话来了，你一边打电话一边吃饭，这说明你支持并行。 并发的关键就是需要能同时处理多个任务的能力，这个不一定是同时进行的。并行则关键是要能同时处理多个任务二者的关键区别在于是否具备同时性。 前端并发数量关于并发前端能做的就是控制请求数量，控制请求的频率，控制请求的耗时(个人见解) 实现export async function conCurrent(urls, max = 2) { const urlList = urls.flat(); //扁平化数组 if (urlList.length === 0) return new Promise.resolve([]); return new Promise((resolve) => { const result = []; //存放结果数组 let index = 0; //指向下一个url ...

scss 模块化 什么是模块化?模块化是指将一个复杂的程序依据一定的规则封装成几个块,并进行组合在一起。 scss 的模块化分为运行时与编译时 运行时在以往的时候导入方式是使用 import url(‘xxx’) 而编译时的导入方式与运行时大差不差，import ‘xxx’ 而这两种方式都差不多，容易混淆，让人无法一眼看出在干什么。 所以 scss 提供了新的导入方式 @use 一个成熟的模块化方式，需要解决变量污染,私有变量等问题 //支持导入别名@use "b.scss as a" @use "b.scss" // 支持命名空间 color: a.$color;//私有变量$_s: red;

在使用 forEach 时的一些现象 为什么次添加一个元素到数组不会陷入死循环？ const arr = [1, 2, 3];arr.forEach((item) => { arr.push("x"); console.log("arr", item); //arr 1 arr 2 arr 3}); 为什么下标为 1 的元素没有删除？ const arr = [1, 2, 3];arr.forEach((item, i) => { arr.splice(i, 1); console.log("arr", item); //arr 1 arr 3});console.log(arr); //[2] 为什么存在稀疏元素时 会跳过稀疏数组？ const arr = [, , 3];arr.forEach((item) => { console.log("arr", item); // arr 3}); 解 ...

博客完成搭建英雄联盟酷酷上分准备毕设那个老头规定的前端毕设还要写开发文档，写就算了还要写数据库字段代表意义，我服了!!!