![](https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端面试系列
@云辰
爱吃瓜瓜
展开
-
JavaScript 红绿灯实现
题目:实现一个红绿灯,红灯3s,黄灯1s,绿灯2s。不断闪烁方案一:嵌套回调写法——setTimeout让每个灯亮起来后,定时一段时间后再去亮灯 setTimeout负值每个light等待的时间 具体: 红灯亮了,设置3s定时 3s后,黄灯亮了,设置定时1s 1s后,绿灯亮,设置定时2s后,红灯亮起 不断重复 const main=()=>{ console.log('红灯'); setTimeout(()=>{ console.l..原创 2020-12-11 10:55:35 · 3164 阅读 · 0 评论 -
Dva 初读文档学习
基于Redux-saga的数据管理方案,Redux-Saga 详见文章《Redux中间件之redux-saga》1、数据流向概念:数据的改变通常是由于用户交互行为或者浏览器行为触发的,利用dispatch发起action(操作),然后通过一系列改变state (1)同步:通过Reducer直接改变state (2)异步:先触发Effects,然后流向Reducer,然后由Reducer最终改变state2、Models (...原创 2020-12-08 19:38:03 · 402 阅读 · 0 评论 -
利用React Hook 实现函数式组件父子通信
需求:前端遇到这样一个功能,一个父组件包裹着一个子组件,父组件内的搜索区域输入搜索参数之后会触发子组件的搜索函数,刷新数据。如图:选择搜索参数之后,点击搜索; 触发子组件获取表单的函数(这里本来想把子组件数据获取放到父组件,但是因为考虑到数据之后会有更多的操作,就尽量减少耦合) 刷新Table于是就希望能在父组件点击搜索的操作函数内,去触发子组件的获取table数据的函数,这样就可以完成功能。这就要用到父子组件的通信。因为这里用到的都是函数式组件(相比Class组件...原创 2020-12-01 11:03:23 · 4543 阅读 · 1 评论 -
前端面试之——this详解
一、this是什么一个函数被调用时候发生的绑定,this指向(内容)取决于函数在哪里执行执行环境(执行上下文)全局执行环境 函数执行环境 eval环境函数调用过程函数被调用,会创建一个函数执行环境(执行上下文) 执行上下文会包含变量对象(函数调用栈,调用方式,参数等属性) this就是用来记录这些的一个属性,在函数调用时候被绑定this指向由函数执行时候确认(和定义时无关)二、绑定规则-》确定this指向1、默认绑定——函数独立调用当我们直接去调用函数的时候.原创 2020-12-01 10:58:56 · 518 阅读 · 0 评论 -
HMR(热模块代替)原理和react实践
手动更新:在以前,当我们一个大型的应用程序在开发过程中,每一次的修改每改动一次就要经历以下步骤:资源重载 网络请求 浏览器渲染 页面刷新这个过程对应工作量很大的应用来说是很难以接受的。想一想,即便你只是给网页添加了一个img,但是却要重新经历等待应用程序资源重新构建,然后手动刷新页面才能看到效果。恐怕再有耐心的程序员也受不了。如果每一次小改动都要经历这些部分,那将是一个开发灾难。自动更新:我们现在的开发工具为我们提供了更加方便的方式,只要检测到代码更新就会自动重新构...原创 2020-12-01 10:55:51 · 709 阅读 · 0 评论 -
前端面试之水平垂直居中——几分钟搞定四种css水平垂直居方案
我们要对元素进行水平居中处理,核心的思想就是改变元素的位置,让元素轴中心处于容器中心即可。为了让我们子元素位于父容器的中心,首先要脱离正常的文档流,相对于我们父元素进行定位。这样我们的移动才是针对父元素的。方案:一、margin负值(子元素操作)absolute是利用margin定位,定位点为左上角原理:绝对定位,相对父元素,且通过自身边界(margin)定位那么我们设置 子元素top:50%和left:50%就实现了 左上角这个点的水平垂直居中设置他的marginTop为高度一半负值原创 2020-11-30 16:16:28 · 425 阅读 · 0 评论