-
why should we use pnpm
…
-
事件循环（Event Loop）promise、setTimeout、async的先后执行顺序
javaScript 的特点就是单线程，在这个线程中拥有唯一的一个事件循环。 JS 分为同步任务和异步任务，同步任务都在主线程上执行。前一个任务执行完毕之后，执行后一个任务，形成一个执行栈； 主线程之外，事件触发线程管理着一个任务队列，异步任务会被主线程挂起，不会进入主线程，而是进入任务队列。只要异步任务有了运行结果，就会在队列任务中放置一个事件； 一旦执行栈中所有的同步任务执行完毕后，系统就会读取任务队列，将可运行的异步任务添加到可执行栈中，开始执行。为什么 JS 是单线程的？？J...…
-
js预编译
预编译预编译简单理解就是，在代码执行前一刻发生的事情。预编译的过程，也就是 GO 和 AO 创建的过程。GO-> var -> function -> 执行 创建 GO（Global Object）对象； 1、寻找变量声明作为 GO 的属性名，并赋值为 undefined； 2、寻找函数声明，放入作为 GO 的属性，并赋值为其函数体。AOvar 和形参 -> 赋值 -> function -> 执行 1、再函数被调用之前，创建 AO（Activa...…
-
nodejs 相关工具
官方资源 官网 文档 仓库 文章教程资源工具 openbase - 让你每次都要找到合适的包。目前支持 JavaScript，即将推出更多语言。 npm.devtool - 找到最适合您的包，分析您的项目技术栈。书籍 狼书（卷2）：Node.js Web应用开发 - 2020-01-01 - @狼叔 本书主要讲解Node.js Web应用开发涉及的HTTP基础知识、常用开发框架、源码原理、数据库和项目实战，旨在向读者展示如何通过Node.js和Koa编写出更...…
-
css相关工具
cssgr.id生成布局样式地址： https://cssgr.idcsslayout.io地址： https://csslayout.ioloading.io弹性盒生成器地址：https://loading.io/flexboxgrid layout地址： https://grid.layoutit.com…
-
typeof和instanceof的区别
前言虽然 typeof 和 instanceof 是 JavaScript 中的基础知识，但这个知识点却有很多的小细节。数据类型js 中有 7 种数据类型，其中有 6 种基本数据类型：1、undefined2、Null3、Boolean4、Number5、String6、Symbol(在 es10 中加入了第 7 种原始类型 BigInt，现已被最新 Chrome 支持)其中 Symbol 是 ES6 新增的，还有一种复杂类型（引用类型）Object。我们常用 typeof 和 insta...…
-
pm2 logrotate
pm2-logrotate是一个 pm2 的插件, 日志管理。安装使用1. 安装pm2 install pm2-logrotate2. 查看默认配置pm2 conf可看到默认配置如下图所示，其配置文件一般在:/root/.pm2/module_conf.json：$ pm2 set pm2-logrotate:max_size 10M$ pm2 set pm2-logrotate:retain 30$ pm2 set pm2-logrotate:compress false$ pm2 se...…
-
vscode前端插件
Live server静态服务器REST ClientGitLensgit日志增强CSS Peek快捷查看css样式Quokka.js快捷调试js代码CodeSnap代码截图Auto Rename tag改标签Snippets代码缩写indent-rainbow彩虹缩进，提高辨识vscode-icons文件图标Prettier文件代码格式化Color Highlight颜色标识设置 Settings -> marker type -> User…
-
vscode快捷键
点击查看官方快捷键文档常规 General 按 Press 功能 Function Ctrl + Shift + P，F1 显示命令面板 Show Command Palette Ctrl + P 快速打开 Quick Open Ctrl + Shift + N 新窗口/实例 New window/instance ...…
-
HTTP 协议小结
初识 HTTPHTTP 全名为超文本传输协议，是应用层的协议。语意简单，可扩展，协议无状态。协议分析 HTTP/0.9 只能相应 GET /page.html，只能响应 HTML 文档。 HTTP/1.0 增加了 Header，状态吗、多种文档类型。 HTTP/1.1 开始标准化，链接复用、缓存、内容协商等。 HTTP/2 增加优异表现，二进制，压缩，服务器推送。 HTTP/3 草案阶段。报文内容 startline header Empty-line body请求类型 ...…
-
数组拍平
什么是数组拍平数组拍平方法 Array.prototype.flat() 也叫数组扁平化、数组拉平、数组降维。指的是把多维数组变成一维数组。数组拍平的使用场景复杂场景下的数据处理 （例如：echarts 大屏数据展示）常用实现数组拍平 3 种方法const array = [1,3,4,[4,5,12,67], [7,8,[6,90,5]]];使用 reduce 函数代码如下function flatten(array) { return array.reduce((prev, cur...…
-
css div 绝对居中
…
-
css如何实现左边定宽，右边自适应
主要有六种方式效果如下html代码<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,"> <title>左边定宽右边自适应</title> </head> <body> <di...…
-
css px em rem vw vh
概念PX的概念pixel像素的缩写，可以简单理解为网页开发的基本长度单位。em的概念em是一个相对长度单位，相对于当前元素内文本的字体尺寸。rem的概念rem是CSS3新增的一个相对单位，基于html元素的字体大小来决定，通常配合媒体查询用于解决移动端适配问题。vw和vh的概念vw和vh是相对于视口的长度单位，1vw即值为视口宽度的1%,1vh意味着值为视口高度的1%。速记一绝三相 px： 绝对单位，网页开发基本长度单位 em： 相对单位，相对当前盒子字体大小进行计算 （不设置浏览器...…
-
css哪些属性可以继承
CSS哪些属性可以继承1、字体 font font-family font-size font-style font-style font-variant font-weight2、字母间距 letter-spacing3、字母间距 word-spacing4、文字展示 line-height text-align text-indent text-transform5、可见性 visibility…
-
css 选择器优先级规则
优先级简述浏览器通过优先级来判断哪些属性值与一个元素最为相关，从而在该元素上应用这些属性值。简单的说优先级是基于不同种类选择器组成的匹配规则。选择器优先级规则CSS选择器的优先级（权重如下）！important > 行内样式 > ID选择器 > 类、伪类、属性选择器 > 标签、伪元素选择器 > 通配符、子类选择器、兄弟选择器小结讲清楚如下两点:1、什么是 css 选择器优先级: css选择器优先级是基于不同种类选择器组成的匹配规则。2、css 选择器的优先级:...…
-
css 选择器
CSS选择器是什么？CSS选择器是CSS规则的一部分。它是元素和其他部分组合起来告诉浏览器那个HTML元素应当是选为应用规则中的CSS属性值的方式。选择器所选择的元素，叫做’选择器的对象‘。通俗的讲CSS选择器用来对选定的页面元素进行样式修改。CSS选择器有哪些？CSS选择器从种类上可以分为如下11中： 选择器 式例 标签选择器 h1{} 通配选择器 * { } ...…
-
css box BFC
什么是BFC?块格式化上下文（Block Formatting Context, BFC)是web页面的可视CSS渲染的一部分，是块盒子的布局过程发生的区域，也是浮动元素与其他元素交互的区域。它是 CSS 2.1 规范中的一个概念，它决定了元素如何对其内容进行定位，以及与其他元素的关系和相互作用。简单的说BFC是一个完全独立的空间，这个空间里子元素的渲染不会影响到外面的布局触发BFC的条件 浮动元素(float除了none以外的值) 定位元素(position: absolute / ...…
-
css盒子模型
什么是盒模型CSS规范的一个模块，定义了一个长方形的盒子，包括各自的content、padding、border、margin。常译为盒子模型、盒模型或框模型。盒模型分类 从标准上分为标准盒模型和替代（IE)盒模型; 从元素类型上分为块级盒子（block box)和内联盒子（Inline box);两种盒模型的区别 W3C标准盒子模型(content-box): 内容是盒子的边界； W3C标准盒子模型(content-box): width=内容宽度； IE盒子模型（border...…
-
node package versions
node package version13.4.6major 13, minor:4, patch: 6major 、minor 、patchmajor : 主版本 - 做了不会向下兼容的改动minor : 次版本号 - 做了会向下兼容的功能新增patch : 修订号 - 做了会向下兼容的问题修正npm 版本符号^ : 锁定 major~ : 锁定 minor空 : 锁定 patch : 最新版本package version 更新命令升级 patch 版本 npm version p...…
