随笔分类 -  前端技术

摘要:用户界面事件 load: 加载完成 window/img unload: 卸载完成 window error: JS出错或加载失败 window/img select: 选中文字 input/textarea resize: 调整窗口大小 window scroll: 包含滚动条的元素 焦点事件 b 阅读全文
posted @ 2021-08-25 20:29 Peterer~王勇 阅读(123) 评论(0) 推荐(0)
摘要:闭包是外层函数作用域的引用 需求决定供给,闭包的出现是为了解决函数在定义作用域外执行时如何按照词法作用域查询变量的问题。 JS中的函数是第一公民,所以可以作为值被返回,从而在其他地方执行。当一个函数在定义作用域以外的地方执行时,如果按照正常的词法作用域,那么无法访问到定义时所在的外层函数作用域,所以 阅读全文
posted @ 2021-08-16 21:55 Peterer~王勇 阅读(53) 评论(0) 推荐(0)
摘要:多行文本溢出自动省略 .course-name { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; white- 阅读全文
posted @ 2021-08-08 19:34 Peterer~王勇 阅读(115) 评论(0) 推荐(0)
摘要:前言 ejs是javascript的模板引擎。 官方文档很详细,优先参考官方文档。 安装 npm install ejs 标签 <% %> 执行JS语句 <%= %>变量模板,仅支持JS表达式 对html标签做转义,同vue中{{}} <%- %>变量模板,仅支持JS表达式 不对html标签做转义, 阅读全文
posted @ 2020-07-20 14:48 Peterer~王勇 阅读(399) 评论(0) 推荐(0)
摘要:什么是闭包? 对于这样一个函数: function generate() { const a = 1; return function () { // a这个变量不在当前作用域,于是它是一个自由变量。 // 引用了自由变量的函数称为闭包。 console.log(a); }; } generate作 阅读全文
posted @ 2020-07-07 18:39 Peterer~王勇 阅读(384) 评论(0) 推荐(0)
摘要:限流 在JS中,如果一个事件频繁触发(比如用户疯狂点击按钮)并且处理函数处理耗时还比较长,那么就容易造成性能问题。 限流函数是针对这类问题的优化方式之一,它要求两次事件处理必须大于某个间隔时间,简而言之就是加了一层判断。 限流函数(throttle:节流阀)的核心在于内部维护了一个“上次执行时间点” 阅读全文
posted @ 2020-07-06 13:02 Peterer~王勇 阅读(2574) 评论(0) 推荐(1)
摘要:自定义事件 JS中我们可以自定义事件并通过自己派发自己监听的方式使用自定义事件完成元素之间的联动。 通常父子级元素之间可以通过事件流中捕获冒泡过程进行联动,但同级元素之间想要事件联动,就可以使用自定义事件。 <!DOCTYPE html> <html lang="en"> <head> <meta 阅读全文
posted @ 2020-07-06 11:20 Peterer~王勇 阅读(187) 评论(0) 推荐(1)
摘要:场景 由于行内元素默认vertical-align按照基线(base-line)对齐,而父元素的border-bottom对应着行内元素的底线(bottom),所以默认情况下图片会与父元素产生底部间隙。 去除间隙 vertical-align按照bottom对齐 img { vertical-ali 阅读全文
posted @ 2020-07-03 14:58 Peterer~王勇 阅读(505) 评论(0) 推荐(0)
摘要:越是结构化的有规律的数据操作起来越简单,只是我们没有找到规律和工具。 首先贴代码 首先定义了一个树结构,需求是通过任意节点遍历出其所有的子节点。 根据需求的不同,就会有深度遍历和广度遍历两种,getAllChildrenDFSByReduce(),getAllChildrenDFSByStack() 阅读全文
posted @ 2020-06-24 17:16 Peterer~王勇 阅读(2341) 评论(0) 推荐(0)
摘要:eslint和prettier eslint针对javascript做格式和语法的检查,prettier主要用于格式化,但格式化的文件类型相比eslint --fix来说要多一些。通常prettier的格式和eslint的格式会产生冲突,造成prettier格式化后eslint大量报错,所以我们需要 阅读全文
posted @ 2020-06-24 09:20 Peterer~王勇 阅读(4359) 评论(0) 推荐(0)
摘要:安装nodemon nodemon可以监控文件变化并重启服务 cnpm i nodemon -g 安装babel依赖 cnpm i @babel/core @babel/cli @babel/preset-env @babel/node -D 添加.babelrc { "presets": ["@b 阅读全文
posted @ 2020-06-17 18:25 Peterer~王勇 阅读(377) 评论(0) 推荐(0)
摘要:Vue官方文档 当 Vue 正在更新使用 v-for 渲染的元素列表时,它默认使用“就地更新”的策略。如果数据项的顺序被改变,Vue 将不会移动 DOM 元素来匹配数据项的顺序,而是就地更新每个元素,并且确保它们在每个索引位置正确渲染。 这个默认的模式是高效的,但是只适用于不依赖子组件状态或临时 D 阅读全文
posted @ 2020-06-15 10:32 Peterer~王勇 阅读(353) 评论(0) 推荐(0)
摘要:super关键词 JS中super关键词是用来调用原型对象的属性和方法的,本文分析使用super关键词的必要性 this指向导致的原型调用问题 JS中存在多种”this绑定“方式,最核心的就是”调用绑定“,即xxx.show(),那么show方法中的this就指向xxx。 如果直接show(),那么 阅读全文
posted @ 2020-06-11 14:43 Peterer~王勇 阅读(612) 评论(0) 推荐(0)
摘要:简介 Express是基于NodeJS开发的Web框架。 # npm i -S express # 创建应用对象 const express = require('express') const app = express() # 注册各种中间件 app.use(...) app.use(...) 阅读全文
posted @ 2020-06-03 19:09 Peterer~王勇 阅读(427) 评论(0) 推荐(0)
摘要:场景 现在的JS异步编程,通常都会使用async/await模式,但要支持这个模式,await后面必须是一个Promise对象。 因而对于现存的很多基于回调模式的API,我们需要将其Promise化来实现“类同步”调用。 举例 比如我们要将SetTimeout进行Promise化 function 阅读全文
posted @ 2020-06-01 09:10 Peterer~王勇 阅读(1102) 评论(0) 推荐(0)
摘要:弹性盒子 使用弹性布局,首先要将父盒子定义为弹性盒子。 display: flex display: inline flex 行级弹性盒子,类似inline block 弹性元素 弹性盒子内的元素称为”弹性元素“。 弹性布局实际上就是要对弹性元素的排列做各种设置。 排列方向 flex directi 阅读全文
posted @ 2020-05-02 11:00 Peterer~王勇 阅读(376) 评论(0) 推荐(0)
摘要:核心要点 词法作用域是在写代码或者说定义时确定的,而动态作用域是在运行时确定的。 词法作用域关注函数在何处声明,动态作用域关注函数在何处调用。 词法作用域是基于作用域链查询,动态作用域是基于调用栈查询。 Javascript中只有词法作用域,this绑定很像但不是动态作用域。 词法作用域 Javas 阅读全文
posted @ 2020-01-09 09:56 Peterer~王勇 阅读(189) 评论(0) 推荐(0)
摘要:核心要点 function(){} 和 () = {} 的最大区别在于前者会在运行时绑定this对象,后者不会 由于function(){}在运行时在内部自动绑定this对象,则不会访问外部作用域this 由于() = {}不能自动绑定this对象,则只能访问外部作用域this 如果要使用动态绑定的 阅读全文
posted @ 2020-01-08 19:55 Peterer~王勇 阅读(250) 评论(0) 推荐(0)
摘要:闭包是函数和上下文环境的合体 通常,闭包内部会存在一个“自由变量”,这个变量是在外部作用域定义的,当外部作用域的变量值发生变化,闭包内的“自由变量”也就相应变化。 所以,闭包是函数和上下文环境的合体,通常也称之为“开放函数”,因为实际运行结果部分取决于运行时“自由变量”的取值。 函数作用域下的闭包 阅读全文
posted @ 2019-12-25 13:42 Peterer~王勇 阅读(226) 评论(0) 推荐(0)