this, call, apply, bind 知多少

this, call, apply, bind 知多少

前言:关于this关键词的指向✨* this永远指向最后调用它的那个对象 * 一、call、apply、bind的用途二、手写call、apply、bind

节流与防抖

前端/ javascript/ 基础
节流与防抖

问题引入问题1: 如果要实现dom节点的拖拽功能,但是在绑定拖拽事件的时候发现每当元素稍微移动一点点就会触发大量的回调函数,导致浏览器直接卡死,这个时候,我们应咋整呢? 问题2: 如果给一个按钮绑定了表单提交的post事件,但用户有时候在网络比较差的情况下多次点击按钮造成表单重复提交,如果防止多次提交事件的发生? 为了应对上述场景,变出现了函数防抖和函数节流两个概念,总...

回流与重绘

html
回流与重绘

写在前面 在讨论回流与重绘之前,我们需要知道浏览器的渲染过程 从上面这个图我们可以看出,浏览器的渲染过程如下: 解析HTML,生成DOM树,解析CSS,生成CSSOM树; 将DOM树与CSSOM树结合,生成渲染树(Render Tree); Layout(回流):根据生成的渲染树,进行回流(Layout),得到节点的几何信息(位置,大小); Painting(重绘):...

vue指令v-model的理解与使用

开发框架/ vue/ 指令
vue指令v-model的理解与使用

自定义Vue中的v-model双向绑定v-model双向绑定实际上就是通过自组件中的$emit方法转发input事件,父组件监听input事件中传递的value值,并存储在父组件data中,然后父组件通过prop的形式将value传递给子组件的value值,再由子组件绑定input的value属性即可。 v-model的本质就是语法糖,即 1<input type=...

vue插槽的使用

开发框架/ vue/ 组件
vue插槽的使用

前言slot通俗一点的理解就是”占坑”,在组件模版中占好了位置,当使用该组件标签的时候,组件标签里面的内容就会自动填坑(替换组件模版中的slot位置) 在vue2.6.0中,具名插槽和作用域插槽引入了一个新的统一的语法(v-slot的指令),它取代了slot和slot-scope。官方的文档对插槽的描述已经足够详细,我们这边主要是来深入这个作用域插槽,加深对作用域插槽的...

vue自定义组件库

开发框架/ vue
vue自定义组件库

一、前言针对目前实际开发过程中,企业团队内部经常会使用一些功能一样的组件,不想到处复制粘贴,又不能将组件提交到公共的npm上,毕竟是公司的隐私信息,想像iView/ElementUI这些开发框架一样,使用到公司内部的所有系统中,因此,需要搭建公司内部的npm,npm如何搭建就不再描述了,可以参考另外一篇博客文章,这里主要是讲解下如何搭建自定义的组件库,并提供给到各个业务系...

js运行机制

前端/ javascript
js运行机制

一、前言JS是单线程,单线程,单线程的,为毛是单线程的,这里的单线程是指的在浏览器环境下JS执行引擎是单线程的。 单线程意味着同一时间内只能做一件事,为毛不能有多线程的,这样子可以提高效率啊。 JS的单线程,与它的用途有关。作为浏览器脚本语言,JS的主要用户就是与用户互动,以及操作DOM。这就决定了它必须只能是单线程的,否则会带来很复杂的同步问题。比如假设同时有两个线程...

立即执行的js函数有毛用?

前端/ javascript
立即执行的js函数有毛用?

js立即执行的函数可以让函数在创建之后立马执行,这种编写模式本质上就是函数表达式(命名的或者匿名的),在创建之后立即执行 一、立即执行函数的写法 一般立即执行的函数,都是正常写一js函数(命名或者匿名的),然后用一()将整个函数包括函数给括起来,然后再加一()紧跟随其后,有需要的就对应传递相关函数调用参数 1234567// 匿名函数第一种写法:匿名函数包裹在一个括号运算...

玩转CSS

前端/ css
玩转CSS

关于CSS学习的路线架构图,长期维护更新,每次添加的文章,都会已这个作为文章的目录 一、准备篇二、基础篇三、进阶篇四、技巧篇五、实战篇六、总结篇

setTimeout与setInterval

前端/ javascript
setTimeout与setInterval

一、setTimeout和setInterval的基本用法 setTimeout指定延迟XX秒后执行函数; setInterval指定周期来执行函数; 当我们设置定时器(setTimeout/setInterval),都会有一个返回值,这个返回值是一个数字,代表当前是在浏览器中设置的第几个定时器(返回的是定时器序号) 12345let timer1 = setTime...

javascript数据类型

前端/ javascript/ 基础
javascript数据类型

请注意:JS的数据类型有8种 一、JS数据类型的结构在ES5的时候,我们所知晓的数据类型有6种:Number、String、Boolean、undefined、Null、object。ES6中新增一种Symbol,这种类型的对象永不相等,即使创建的时候传入相同的值,可以用来解决属性名冲突的问题,作为标记。谷歌67版本还出现了一种bigInt,是指安全存储、操作大整数。 根...

编码规范

积累与沉淀/ 编码与管理
编码规范

一、css规范1.1 css命名规则1. class 必须单词全字母小写,单词间以 - 分隔。 2. class 必须代表相应模块或部件的内容或功能,不得以样式信息进行命名。 1.2 属性顺序 位置属性(position、top、right、z-index、display、float等); 大小(width, height, padding, margin等); 文...

通过verdaccio服务搭建内部npm管理

积累与沉淀/ 自定义服务
通过verdaccio服务搭建内部npm管理

关于如何要共享组件?目前公司的前端项目比较多,涉及到中后台业务系统,有存在不少组件,在不同的业务系统中使用的,为了避免疯狂的ctrl +C > ctrl + V,一堆的维护工作,这边搭建了内部的私有源,又不能将公司的一个资源扔到公共的npm上,因此这边利用verdaccio + gitlab来搭建以及维护蜘点前端公共的组件服务,通过verdaccio来管理组件的上传...

Hexo + github + netlify搭建自己的博客系统

积累与沉淀/ 自定义服务
Hexo + github + netlify搭建自己的博客系统

一、开始使用1.1简介根据Hexo官方描述,Hexo是一个快速、简介且高效的博客框架,使用markdown解析文章,在几秒内,即可利用靓丽的主题生成静态网页。 1.2安装1.2.1环境需求 Node.js(版本不得低于10.13,建议使用Node.js12.0及以上) Git 以上两个就不在描述具体如何安装了,度娘一大把 1.3 Hexo安装1npm install -...

×
  • {title}
  • 这句一言出处是 『青之驱魔师』, 是 FGHRSH 在 2015.09.23 23:05:17 收藏的!