寻梦环游记

数据库系统概述数据 Data 数据 是描述事物的符号记录，是指利用物理符号记录下来的、可以鉴别的信息 数据是信息存在的一种形式，只有通过解释或处理的数据才能成为有用的信息 数据库 DB 数据库 Database 是指长期储存在计算机中的有组织的、可共享的数据集合 数据库中存储的数据具有永久存储、有组织和可共享三个基本特点 数据要按照一定的数据模型组织、描述和存储，具有较小的冗余度、较高的数据独立性，系统易于扩展，并可以被多个用户分享 数据库管理系统 DBMS 数据库管理系统 是专门用于建立和管理数据库的一套软件，介于应用程序和操作系统之间 数据定义功能 数据操纵功能 数据库的运行管理功能 数据库的建立和维护功能 数据组织、存储和管理功能 其他功能 数据库系统 DBS 数据库系统的构成 通常，一个完整的数据库系统包括数据库、数据库管理系统及相关实用工具、应用程序、数据库管理员(DBA)和用户 数据库系统的结构分类 从DBA的视角 内部系统结构，采用三级模式: 外模式, 模式(核心), 内模式 名称 别称 视图类型 外模式用户级 子模式、用户模式 数据视 ...

Web 相关编码URL 编码 encodeURI encodeURIComponent HTML 编码戳 👈 JS 编码XSS 跨站脚本攻击Cross-Site Scripting 反射型（非持久型）诱导点击带有恶意脚本代码参数的链接 存储型（持久型）发一篇带有恶意脚本代码的公众文章给用户浏览 DOM-Based 型 现代框架默认会屏蔽 XSS 攻击，除非手动开启 Vue v-html React dangerouslySetInnerHTML escape 转义1234567891011// require('escape-html')function escape(str) { str = str.replace(/&/g, '&amp;') str = str.replace(/</g, '&lt;') str = str.replace(/>/g, '&gt;') str = str.replace(/"/g, ...

高并发 QPS每秒钟请求或者查询的数量, 在互联网领域, 指每秒响应请求数（HTTP请求） 峰值每秒请求数(QPS) = (总PV数 80%) / (6小时秒数 20%) 80% 的访问量集中在 20% 的时间 吞吐量单位时间内处理的请求数量（通常由 QPS 与 并发数 决定） QPS 是每秒 HTTP 请求数量, 并发连接数 是系统同时处理的请求数量 一个并发连接数 会有多个 HTTP请求 响应时间从请求发出到收到响应花费的时间 PV页面浏览量 UV独立访客, 即一定时间范围内相同访客多次访问网站, 只计算为一个独立访客 带宽计算带宽大小需关注两个指标, 峰值流量 和 页面的平均大小 日网站带宽 = PV / 统计时间s 平均页面大小kb 8 压力测试ab、wrk、http_load、Web Bench、Siege、Apache JMeter abapache benchmark, 是 Apache 官方推出的工具 创建多个并发访问线程, 模拟多个访问者同时对某一 URL 地址进行访问。它的测试目标是基于 URL 的, 因此, 它 ...

自动化构建工具 Webpack 基于模块化打包工具，适用于大型复杂前端项目构建 Grunt 基于Node、上手容易、插件齐全、社区活跃 早期产物: 每次操作都是文件读写慢、配置相对繁琐 Gulp 基于任务运行的工具 工作流 配置相对简单、基于文件流操作快 Rollup 适用于基础库的打包 Parcel Webpack v4Webpack 官网Webpack 中文文档 初始化合并参数 run 编译，从 entry 入口，使用 loader 递归编译模块 输出资源，根据入口和 Module 之间的依赖关系，组装成一个个包含多个模块的 Chunk，再把每个 Chunk 转换成一个单独的文件 Bundle. 在以上过程中，Webpack 会在特定的时间点广播出特定的事件，插件在监听到感兴趣的事件后会执行特定的逻辑，并且插件可以调用 Webpack 提供的 API 改变 Webpack 的运行结果 分别介绍 bundle, chunk, module 是什么？ module是开发中的单个模块，在 webpack 的世界，⼀切皆模块，⼀个模块对应⼀个⽂件，webpack 会从配置的 ...

十大经典排序算法 👈 冒泡排序 O(n²)12345678910111213141516171819202122232425262728function bubbleSort(arr) { let len = arr.length for (let j = 0; j < len; j++) { for (let i = 0; i < len - 1 - j; i++) { if (arr[i] > arr[i + 1]) { [arr[i], arr[i + 1]] = [arr[i + 1], arr[i]] } } } return arr}function bubbleSort(arr) { let j = arr.length - 1 while (j > 0) { let pot = 0 for (let i = 0; i < j; i++) { if (a ...

数据结构的选择比算法优化更重要 逻辑结构栈 队列 树（理论模型） 物理结构数组 链表 对象（代码表现） 算法三大思维贪心(递归) 二分 动态规划 Traverse 遍历 深度优先栈 递归 贪心 递归遍历recursion 迭代遍历iteration 广度优先队列 迭代遍历iteration 有序数据考虑用二分 双指针和Map可以解决嵌套循环 数组查找快O(1) 增删慢O(n) 单向链表查找慢O(n) 增删快O(1) BST二叉搜索树时间复杂度 O(logn) 平衡二叉树BBST增删改查都快O(log(n)) 树的高度 常见的时间复杂度 常数阶O(1) 无循环 对数阶O(logn) 二分法 线性阶O(n) 普通循环 线性对数阶O(nlogn) 一层循环 & 一层二分 平方阶O(n^2) 嵌套循环 多项式阶O(n^C) 指数阶O(C^n) 常见的空间复杂度 O(1) O(n) 位运算 运算符 描述 例子 类似于 结果 十进制 & AND 5 & 1 0101 & 0001 0001 1 ...

Stack 栈 线性结构, 仅能够在栈顶进行操作 先进后出 First In Last Out 实现方式: 数组、链表 123456789101112131415161718192021222324252627282930313233class Stack { constructor() { this.stack = [] } // 进栈 push(item) { this.stack.push(item) } // 出栈 pop() { return this.stack.pop() } // 栈顶元素 top() { return this.stack[this.size() - 1] } // 栈尾元素 end() { return this.stack[0] } // 栈的大小 size() { return this.stack.length } // 清空栈 clear( ...

设计原则开放封闭原则 OCP 对扩展开放 对修改封闭 工厂模式简单工厂模式12345678910111213141516class Man { constructor(name) { this.name = name } alertName() { alert(this.name) }}class Factory { public static create(name): Man { return new Man(name) }}Factory.create('Bobo').alertName() 工厂模式并不仅仅是用来 new 出实例 隐藏创建实例的复杂度，只需提供一个接口，传递对应的参数，就可返回实例；至于这些参数怎么使用，内部有什么逻辑并不关心 Vue createComponent 创建异步组件 React createElement('div', {}, children) 生成 v ...

https://github.com/skyline75489/what-happens-when-zh_CN 浏览器检测是否有缓存 强缓存 200 from cache 直接从本地缓存中获取响应 PragmaHTTP1.0时代的遗留产物, 该字段被设置为 no-cache 时, 会告知浏览器禁用本地缓存, 即每次都向服务器发送请求 ExpiresHTTP1.0时代用来启用本地缓存的字段, expires 值对应一个形如 Thu, 31 Dec 2037 23:55:55 GMT 的格林威治时间, 如果还没有到该时刻, 标明缓存有效, 无需发送请求受限于本地时间 Cache-ControlHTTP1.1针对 Expires 问题的解决方案, 使用 Cache-Control 告诉浏览器缓存过期的时间间隔而不是时刻 public: 可以被所有用户缓存，包括终端和CDN等中间代理服务器 private: 只能被终端浏览器缓存 no-cache: 不允许直接使用本地缓存, 先发起请求和服务器协商 no-store: 禁止浏览器缓存响应, 不使用强缓存和协商缓存 max-age  ...

React.js声明式 组件化 单向数据流 纯函数 不可变数据 函数式编程React.js 官网 ahooks React 需要使用 JSX，有一定的上手成本，并且需要一整套的工具链支持，但是完全可以通过 JS 来控制页面，更加的灵活。Vue 使用了模板语法，相比于 JSX 来说没有那么灵活，但是完全可以脱离工具链，通过直接编写 render 函数就能在浏览器中运行。 setState setState 触发时机受 React 控制, 异步更新 生命周期内触发 合成事件内触发 触发时机不在 React 所控制范围内, 同步更新 setTimeout setInterval 自定义的 DOM 事件 promise.then Ajax 回调 setState 默认合并 同步更新不会合并 传入函数不会合并 React 18 更新，setState 都是异步 合并的了 Automatic Batching 自动批处理 123456789101112131415161718192021222324252627282930313233343536class MyComponent ...