06 2020 档案
摘要：CSS常用单位 CSS的长度单位主要有%、px、in、cm、ch、mm、ex、pt、pc、em、rem、vw、vh、vmin、vmax，按照单位的计算方式大致可以分为绝对长度单位、相对长度单位、百分比单位。 绝对长度单位 px 像素 通常而言，一个CSS像素代表屏幕设备的一个像素点，但是对于高分辨率
阅读全文
摘要：常见的兼容性问题 浏览器有着大量不同的版本，不同种类的浏览器的内核也不尽相同，所以不同浏览器对代码的解析会存在差异，这就导致对页面渲染效果不统一的问题。 初始化样式 因浏览器兼容的问题，不同的浏览器对标签的默认样式值不同，如果不初始化会造成不同浏览器之间的显示差异，布局出现错乱，所以要初始化样式，达
阅读全文
摘要：长度最小的子数组 给定一个含有n个正整数的数组和一个正整数s ，找出该数组中满足其和 ≥ s的长度最小的连续子数组，并返回其长度。如果不存在符合条件的连续子数组，返回0。 实例 输入: s = 7, nums = [2,3,1,2,4,3] 输出: 2 解释: 子数组 [4,3] 是该条件下的长度最
阅读全文
摘要：data为何以函数形式返回 在使用Vue构建组件化应用时，每个组件的data属性都是以函数形式返回的，这主要是在组件化实现的时候，每个实例可以维护一份被返回对象的独立的拷贝，而不是共享同一个对象的引用。 Vue简单实例 在一个Vue简单实例中，也就是不使用组件化实现的时候，data可以是一个对象，因
阅读全文
摘要：文本选中复制 某些网站例如某度文库、道客某某等都不允许用户选中文本进行复制，作为一个搞前端的，就感觉离谱，文本都下载到本地了，还不让我复制，于是为了更好的学(复)习(制)，实现了一个脚本去解决这些限制。 描述 首先来看一下效果图，依旧是以某度文库、道客某某为例展示效果，点击复制按钮即可成功复制。 脚
阅读全文
摘要：栈排序 栈排序。 编写程序，对栈进行排序使最小元素位于栈顶。最多只能使用一个其他的临时栈存放数据，但不得将元素复制到别的数据结构（如数组）中。该栈支持如下操作：push、pop、peek和isEmpty。当栈为空时，peek返回-1。 示例 输入： ["SortedStack", "push", "
阅读全文
摘要：矩阵置零 给定一个m x n的矩阵，如果一个元素为0，则将其所在行和列的所有元素都设为0。请使用原地算法。 示例 输入: [ [1,1,1], [1,0,1], [1,1,1] ] 输出: [ [1,0,1], [0,0,0], [1,0,1] ] 输入: [ [0,1,2,0], [3,4,5,2
阅读全文
摘要：顶端迭代器 给定一个迭代器类的接口，接口包含两个方法：next()和hasNext()。设计并实现一个支持peek()操作的顶端迭代器--其本质就是把原本应由next()方法返回的元素peek()出来。 示例 假设迭代器被初始化为列表 [1,2,3]。 调用 next() 返回 1，得到列表中的第一
阅读全文
摘要：二进制求和 给你两个二进制字符串，返回它们的和（用二进制表示）。 输入为 非空 字符串且只包含数字1和0。 示例 输入: a = "11", b = "1" 输出: "100" 输入: a = "1010", b = "1011" 输出: "10101" 提示 每个字符串仅由字符'0'或'1'组成。
阅读全文
摘要：括号生成 数字n代表生成括号的对数，请你设计一个函数，用于能够生成所有可能的并且有效的括号组合。 示例 输入：n = 3 输出：[ "((()))", "(()())", "(())()", "()(())", "()()()" ] 题解 /** * @param {number} n * @ret
阅读全文
摘要：全排列 给定一个没有重复 数字的序列，返回其所有可能的全排列。 示例 输入: [1,2,3] 输出: [ [1,2,3], [1,3,2], [2,1,3], [2,3,1], [3,1,2], [3,2,1] ] 题解 /** * @param {number[]} nums * @return
阅读全文
摘要：async/await剖析 JavaScript是单线程的，为了避免同步阻塞可能会带来的一些负面影响，引入了异步非阻塞机制，而对于异步执行的解决方案从最早的回调函数，到ES6的Promise对象以及Generator函数，每次都有所改进，但是却又美中不足，他们都有额外的复杂性，都需要理解抽象的底层运
阅读全文
摘要：Thunk函数的使用 编译器的求值策略通常分为传值调用以及传名调用，Thunk函数是应用于编译器的传名调用实现，往往是将参数放到一个临时函数之中，再将这个临时函数传入函数体，这个临时函数就叫做Thunk 函数。 求值策略 编译器的求值策略通常分为传值调用以及传名调用，在下面的例子中，将一个表达式作为
阅读全文
摘要：display的值及作用 display属性可以设置元素的内部和外部显示类型，元素的外部显示类型将决定该元素在流式布局中的表现，例如块级或内联元素，元素的内部显示类型可以控制其子元素的布局，例如grid或flex。目前所有浏览器都支持display属性，但是对于属性值的兼容性仍需注意。 外部显示 这
阅读全文
摘要：HTML与XHTML区别 HTML称为超文本标记语言Hyper Text Markup Language，是一种标识性的语言。XHTML称为扩展超文本标记语言Extensible HyperText Markup Language，同样是一种标识性的语言，表现方式与HTML类似，不过语法上更加严格。
阅读全文
摘要：Vue数据双向绑定 Vue是通过数据劫持的方式来实现数据双向数据绑定的，其中最核心的方法便是通过Object.defineProperty()来实现对属性的劫持，该方法允许精确地添加或修改对象的属性，对数据添加属性描述符中的getter与setter实现劫持。 描述 运行一个Vue实例并将data打
阅读全文
摘要：模板语法的简单实现 模板语法允许在HTML中之插入Js变量以及表达式，当在Js中控制render的时候能够自动在页面上将变量或者是表达式进行计算并显示，比较常见的模板语法有mustcache风格的{{}}以及DSL风格的dsl-html等。 AST AST抽象语法树，全称为Abstract Synt
阅读全文
摘要：强缓存与协商缓存 浏览器缓存是浏览器在本地磁盘对用户最近请求过的资源进行存储，当访问者再次访问同一资源时，浏览器就可以直接从本地磁盘加载资源，通过缓存的方式就可以减少与服务器的数据传输，减少服务器的负担，加快页面响应速度等。 描述 良好的缓存策略可以降低资源的重复加载提高网页的整体加载速度，通常浏览
阅读全文
摘要：深入理解Js数组 在Js中数组存在两种形式，一种是与C/C++等相同的在连续内存中存放数据的快数组，另一种是HashTable结构的慢数组，是一种典型的字典形式。 描述 在本文中所有的测试都是基于V8引擎的，使用的浏览器版本为Chrome 83.0，当然直接使用Node也是可以的。通常创建数组一般用
阅读全文
摘要：如何避免FOUC FOUC即无样式内容闪烁也可以称为文档样式短暂失效，主要就是指HTML已加载而样式表并未加载，此后样式表再加载而产生的闪烁现象。 样式表前置 根据浏览器渲染的顺序，将CSS在<head>中引入或者嵌入，相对于将CSS放到<body>或者页面底部来说，可以使页面渲染速度加快，这对于页
阅读全文
摘要：CSS隐藏元素的方法 使用CSS隐藏元素的主要方式有diaplay: none;、opacity: 0;、visibility: hidden;、position: absolute; overflow: hidden;、clip-path: polygon(0 0, 0 0, 0 0, 0 0);
阅读全文
摘要：可替换元素和非替换元素 可替换元素replaced element也称作可置换元素，其展现效果不是由CSS来控制的，这些元素是一种外部对象，它们外观的渲染，是独立于CSS的。非置换元素non-replaced element也称作非替换元素，其内容由CSS渲染直接表现给客户端。 可替换元素 一个内容
阅读全文
摘要：Vue中key的作用 key的特殊attribute主要用在Vue的虚拟DOM算法，在新旧Nodes对比时辨识VNodes。如果不使用key，Vue会使用一种最大限度减少动态元素并且尽可能的尝试就地修改、复用相同类型元素的算法，而使用key时，它会基于key的变化重新排列元素顺序，并且会移除key不
阅读全文
摘要：DNS解析过程 域名是为了方便记忆而专门建立的一套地址转换系统，要访问一台互联网上的服务器，最终还必须通过IP地址来实现，域名解析就是将域名重新转换为IP地址的过程。一个域名对应一个IP地址，一个IP地址可以对应多个域名，所以多个域名可以同时被解析到一个IP地址，域名解析需要由专门的域名解析服务器D
阅读全文
摘要：Js文件异步加载 浏览器中渲染引擎与Js脚本引擎是互斥的，在浏览器开始渲染页面时，如果遇到<script>标签，会停止渲染当前页面，也就是说在脚本加载与执行的过程中会阻塞页面的渲染，在网速较差的环境下可能会出现浏览器页面假死的情况，这也就是尽量将<script>文件放置于<body>后的原因，Js文
阅读全文
摘要：文本溢出截断省略 文本溢出截断省略是比较常见的业务场景，主要分为单行文本溢出截断省略与多行文本溢出截断省略，单行的截断方案比较简单，多行截断相对比较复杂。 单行溢出省略 单行文本溢出截断省略直接使用CSS即可，其无兼容问题，文本溢出范围才显示省略号，否则不显示省略号，省略号位置显示刚好，但是只能作为
阅读全文
摘要：默认行为及阻止 浏览器以及HTML元素提供了一些默认行为，也可以称作默认事件。 默认行为 a标签点击跳转 <a>标签在href存在的情况下会点击自动跳转链接或者定位锚点，通过对<a>的监听事件阻止默认行为后，点击链接不会跳转。 <a href="https://blog.touchczy.top"
阅读全文
摘要：Vue生命周期 Vue实例需要经过创建、初始化数据、编译模板、挂载DOM、渲染、更新、渲染、卸载等一系列过程，这个过程就是Vue的生命周期，在Vue的整个生命周期中提供很多钩子函数在生命周期的不同时刻调用，Vue中提供的钩子函数有beforeCreate、created、beforeMount、mo
阅读全文
摘要：XML和JSON的比较 XML与JSON都可以用来描述或者存储数据，两者都有各自的优点，使用场景取决于需求。 描述 XML 可扩展标记语言Extensible Markup Language，是一种用于标记电子文件使其具有结构性的标记语言，可以用来标记数据、定义数据类型、存储数据等，是一种允许用户对
阅读全文
摘要：300ms点击延迟 移动端的300ms点击延迟是因为移动端可以进行双击缩放的操作，因此浏览器在click之后要等待300ms，看用户有没有下一次点击，也就是判断这次操作是单击还是双击。如果通过监听touchstart事件来替代click事件的话，会导致一些问题：touchstart是手指触摸屏幕就触
阅读全文
摘要：Js中fetch方法 fetch()方法定义在Window对象以及WorkerGlobalScope对象上，用于发起获取资源的请求，其返回一个Promise对象，这个Promise对象会在请求响应后被resolve，并传回Response对象。 描述 Promise<Response> fetch(
阅读全文