随笔分类 - 2022目标
摘要：
css样式表主要是样式属性的描述，写起来相当的费事，为此，CSS预处理器定义了一种新的语言，其基本思想是，用一种专门的编程语言，为CSS增加了一些编程的特性，将CSS作为目标生成文件，然后开发者就只要使用这种语言进行编码工作。通俗的说，CSS预处理器用一种专门的编程语言，进行Web页面样式设计，然后
阅读全文
css样式表主要是样式属性的描述，写起来相当的费事，为此，CSS预处理器定义了一种新的语言，其基本思想是，用一种专门的编程语言，为CSS增加了一些编程的特性，将CSS作为目标生成文件，然后开发者就只要使用这种语言进行编码工作。通俗的说，CSS预处理器用一种专门的编程语言，进行Web页面样式设计，然后
阅读全文
摘要：
Promise 构造函数是同步的，而then 方法是异步的 如何证明？ const p = new Promise((res, rej) => { console.log('11111') // 1 res('bbbb') }) console.log('899090') // 2 p.then(r
阅读全文
Promise 构造函数是同步的，而then 方法是异步的 如何证明？ const p = new Promise((res, rej) => { console.log('11111') // 1 res('bbbb') }) console.log('899090') // 2 p.then(r
阅读全文
摘要：
盒子模型的概念： 在html中，把每一个元素都当做成一个盒子，拥有盒子的平面外形和空间 盒模型由内容（content）+内边距（padding）+边框（border）+外边距（margin）4部分构成 内容区域：你书写的内容或者子元素能够显示的区域 内边距：撑开内容与边框的距离 边框：元素的边框 外
阅读全文
盒子模型的概念： 在html中，把每一个元素都当做成一个盒子，拥有盒子的平面外形和空间 盒模型由内容（content）+内边距（padding）+边框（border）+外边距（margin）4部分构成 内容区域：你书写的内容或者子元素能够显示的区域 内边距：撑开内容与边框的距离 边框：元素的边框 外
阅读全文
摘要：
Vue源码解析，keep-alive是如何实现缓存的？: https://blog.csdn.net/xiaolinlife/article/details/108331068 keep-alive 组件是抽象组件，在对应父子关系时会跳过抽象组件，它只对包裹的子组件做处理，主要是根据LRU策略缓存组
阅读全文
Vue源码解析，keep-alive是如何实现缓存的？: https://blog.csdn.net/xiaolinlife/article/details/108331068 keep-alive 组件是抽象组件，在对应父子关系时会跳过抽象组件，它只对包裹的子组件做处理，主要是根据LRU策略缓存组
阅读全文
摘要：
https://learnku.com/articles/50523 静态作用域又叫做词法作用域，采用词法作用域的变量叫词法变量。词法变量有一个在编译时静态确定的作用域。词法变量的作用域可以是一个函数或一段代码，该变量在这段代码区域内可见（visibility）；在这段区域以外该变量不可见（或无法访
阅读全文
https://learnku.com/articles/50523 静态作用域又叫做词法作用域，采用词法作用域的变量叫词法变量。词法变量有一个在编译时静态确定的作用域。词法变量的作用域可以是一个函数或一段代码，该变量在这段代码区域内可见（visibility）；在这段区域以外该变量不可见（或无法访
阅读全文
摘要：
方案一：百分比布局 利用对属性设置百分比来适配不同屏幕，注意这里的百分比是相对于父元素 方案二：使用媒体查询 (CSS3 @media 查询) 方案三.rem 响应式布局 方案四.vw 响应式布局 方案五.flex 弹性盒子布局
阅读全文
方案一：百分比布局 利用对属性设置百分比来适配不同屏幕，注意这里的百分比是相对于父元素 方案二：使用媒体查询 (CSS3 @media 查询) 方案三.rem 响应式布局 方案四.vw 响应式布局 方案五.flex 弹性盒子布局
阅读全文
摘要：
转载：https://zhuanlan.zhihu.com/p/389009882 HTML方向 调用系统功能 使用<a>能快速调用移动设备的电话/短信/邮件三大通讯功能，使用<input>能快速调用移动设备的的图库/文件。 这些功能方便了页面与系统的交互，关键在于调用格式一定要准确，否则会被移动端
阅读全文
转载：https://zhuanlan.zhihu.com/p/389009882 HTML方向 调用系统功能 使用<a>能快速调用移动设备的电话/短信/邮件三大通讯功能，使用<input>能快速调用移动设备的的图库/文件。 这些功能方便了页面与系统的交互，关键在于调用格式一定要准确，否则会被移动端
阅读全文
摘要：
<html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width
阅读全文
<html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width
阅读全文
摘要：
一个 HTTP 报文通常报告两个部分：头部(head)和主体(body)，其中 body 可以为空，常见的 GET 请求就是这种情况。但当 body 不为空时，接收的一端需要知道它是什么类型的数据，采用什么编码，这时候就需要在 Content-Type 来指明 body 的人 MIME 类型。是否需
阅读全文
一个 HTTP 报文通常报告两个部分：头部(head)和主体(body)，其中 body 可以为空，常见的 GET 请求就是这种情况。但当 body 不为空时，接收的一端需要知道它是什么类型的数据，采用什么编码，这时候就需要在 Content-Type 来指明 body 的人 MIME 类型。是否需
阅读全文
摘要：
/** * 实现一个 Promise.allSettled 方法 * @param {*} list * @returns [ { status: 'fulfilled'| 'rejected', value(fulfilled) | reason(rejected) } ] */ function
阅读全文
/** * 实现一个 Promise.allSettled 方法 * @param {*} list * @returns [ { status: 'fulfilled'| 'rejected', value(fulfilled) | reason(rejected) } ] */ function
阅读全文
摘要：
function jmPromiseAll(list) { const result = []; let count = 0; return new Promise((reslove, reject) => { list.forEach(promise => { promise.then((res)
阅读全文
function jmPromiseAll(list) { const result = []; let count = 0; return new Promise((reslove, reject) => { list.forEach(promise => { promise.then((res)
阅读全文
摘要：
JS 天然支持并行请求，但与此同时会带来一些问题，比如会造成目标服务器压力过大，所以本文引入“请求调度器”来节制并发度。 class Scheduler { constructor(size) { this.size = size; this.stacks = []; this.count = 0;
阅读全文
JS 天然支持并行请求，但与此同时会带来一些问题，比如会造成目标服务器压力过大，所以本文引入“请求调度器”来节制并发度。 class Scheduler { constructor(size) { this.size = size; this.stacks = []; this.count = 0;
阅读全文
摘要：
<html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width
阅读全文
<html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width
阅读全文
摘要：
对虚拟DOM的理解？ 可以看作是一个使用javascript模拟DOM结构的树形结构 虚拟DOM主要做了什么？ 传统的DOM操作，对于复杂项目来说，是非常消耗性能的，对DOM的修改开销非常大，vdom：render virtual dom + diff + 必要的dom更新 和 DOM 操作比起来，
阅读全文
对虚拟DOM的理解？ 可以看作是一个使用javascript模拟DOM结构的树形结构 虚拟DOM主要做了什么？ 传统的DOM操作，对于复杂项目来说，是非常消耗性能的，对DOM的修改开销非常大，vdom：render virtual dom + diff + 必要的dom更新 和 DOM 操作比起来，
阅读全文
摘要：
!function (root, doc) { class Delegator { /* *@param 顶级选择器（代理者） */ constructor (selector) { this.root = document.querySelector(selector);//顶级dom this.
阅读全文
!function (root, doc) { class Delegator { /* *@param 顶级选择器（代理者） */ constructor (selector) { this.root = document.querySelector(selector);//顶级dom this.
阅读全文
摘要：
1. 标准盒子 布局时遵守块级元素单独占一行，行内元素一行可以布置多个元素。 2. 浮动布局 float。盒子脱离标准流，但还在文档或容器中占据位置。如果父盒子为标准盒子，则会一直浮动到最左边界或者最右边界。要浮动，全浮动。 3. 定位 相对定位：相对于自身的位置。 绝对定位：相对于最近一级相对定位
阅读全文
1. 标准盒子 布局时遵守块级元素单独占一行，行内元素一行可以布置多个元素。 2. 浮动布局 float。盒子脱离标准流，但还在文档或容器中占据位置。如果父盒子为标准盒子，则会一直浮动到最左边界或者最右边界。要浮动，全浮动。 3. 定位 相对定位：相对于自身的位置。 绝对定位：相对于最近一级相对定位
阅读全文
摘要：
一、栈和堆的区别 栈：其操作系统自动分配释放，存放函数的参数值和局部变量的值等。其操作方式类似于数据结构中的栈。简单的理解就是当定义一个变量的时候，计算机会在内存中开辟一块存储空间来存放这个变量的值，这块空间叫做栈，然而栈中一般存放的是基本数据类型，栈的特点就是先进后出(或者后进先出) 堆：一般由程
阅读全文
一、栈和堆的区别 栈：其操作系统自动分配释放，存放函数的参数值和局部变量的值等。其操作方式类似于数据结构中的栈。简单的理解就是当定义一个变量的时候，计算机会在内存中开辟一块存储空间来存放这个变量的值，这块空间叫做栈，然而栈中一般存放的是基本数据类型，栈的特点就是先进后出(或者后进先出) 堆：一般由程
阅读全文
摘要：
提高Web页面渲染速度的7个技巧: https://blog.csdn.net/Taobaojishu/article/details/117458077 作为前端你可能要知道如何加快页面渲染速度的几点知识: https://www.jianshu.com/p/424f835c599a 1. con
阅读全文
提高Web页面渲染速度的7个技巧: https://blog.csdn.net/Taobaojishu/article/details/117458077 作为前端你可能要知道如何加快页面渲染速度的几点知识: https://www.jianshu.com/p/424f835c599a 1. con
阅读全文
摘要：
webpack 打包时 hash 码是怎么生成的 webpack 生态中存在多种计算 hash 的方式： 1、输出的结果全部使用 hash 的情况 每个文件都具有相同的 hash 值，因为 hash 是基于我们使用的所有源文件生成的。 如果重新运行该构建而不更改任何内容，则生成的 hash 将保持不
阅读全文
webpack 打包时 hash 码是怎么生成的 webpack 生态中存在多种计算 hash 的方式： 1、输出的结果全部使用 hash 的情况 每个文件都具有相同的 hash 值，因为 hash 是基于我们使用的所有源文件生成的。 如果重新运行该构建而不更改任何内容，则生成的 hash 将保持不
阅读全文
摘要：
移动端适配解决方案 viewport（scale=1/dpr） <meta name="viewport" content="width=device-width; initial-scale=1; maximum-scale=1; minimum-scale=1; user-scalable=no
阅读全文
移动端适配解决方案 viewport（scale=1/dpr） <meta name="viewport" content="width=device-width; initial-scale=1; maximum-scale=1; minimum-scale=1; user-scalable=no
阅读全文
浙公网安备 33010602011771号