前端
Smail~Every
这个作者很懒,什么都没留下…
展开
-
常用样式汇总
title: 常用样式汇总cover: /img/6.jpg1.小手样式cursor: pointer2.垂直居中使用flex布局<div class="outer"> <div class="inner"></div></div>.outer { width: 300px; height: 300px;...原创 2019-03-01 10:09:54 · 287 阅读 · 0 评论 -
React源码解析----createElement + Component + PureComponent
title: React源码解析----createElement + Component + PureComponenttags:- 源码- React上一篇介绍了React的Api,今天介绍createElement和React的Component相关操作。看了很多其他人的博客,对于React16的fiber架构还是无法了解,尽管我知道他很牛逼。发现了解React的源码还是需要从渲...原创 2019-09-27 22:05:02 · 426 阅读 · 1 评论 -
[email protected]源码解析---从 ReactDOM.render 到页面渲染(2)instantiateReactComponent
title: [email protected]源码解析—从 ReactDOM.render 到页面渲染(2)instantiateReactComponenttags:- js- reactinstantiateReactComponent 方法是React中的一个很重要的方法,主要作用是根据给定的node(ReactElement类型)对象,实例化出一个将被挂载的实例。实例化出的实例大体有三...原创 2019-09-27 22:04:27 · 314 阅读 · 0 评论 -
[email protected]源码解析---从 ReactDOM.render 到页面渲染(1)ReactMount
title: [email protected]源码解析—从 ReactDOM.render 到页面渲染(1)ReactMounttags:- js- react之前介绍了React16.8版本的React公用API,本着学习最新版的React的想法,但是败在了Fiber的阵下,还有回过头来写搞明白React15的源码,毕竟从15到16是一次重大的更新。本文中React源码版本为 15.6.2 ...原创 2019-09-27 22:03:56 · 346 阅读 · 0 评论 -
Axios二次封装
axios是一个基于Promise的http库,可以用在浏览器和node.js中。同时也是对原生浏览器请求XMLHttpRequest的封装,支持Promise的APi请求,避免了回掉地狱问题,可以对请求进行拦截,在发出请求前对请求参数进行修改,接受服务器响应时,也可以根据返回的code进行统一的处理,且客户端支持防御XSRF。可以开箱即用,但是在实际项目时,需要对axios进行二次封装实...原创 2019-08-19 20:47:09 · 343 阅读 · 0 评论 -
正则表达式学习
正则表达式博大精深,作为一名开发人员不能不会正则,效率好使用方便,写起来还干净利落简直就是神器。使用场景也很多,webpack中的loader配置,devServer中的historyFallBack中的路由匹配,表单验证等等使用正则及其方便。创建一个正则创建一个正则有两种方式和我们创建正常的变量一样。字面量 var test = /a+/ 使用两个/包裹创建RegExp对象, va...原创 2019-08-19 20:46:03 · 131 阅读 · 0 评论 -
解决行内元素之间的间隙
今天写demo,用行内元素的时候,发现了一个小问题,行内元素之间尽然会有一个小空隙,但是我没有加左右的margin真的是神奇。突然明白为什么每次面试问我行内元素和块级元素的区别时,面试官脸上的失望是从哪里来的。上代码: .main{ margin: 100px; } span{ background: blue; col...原创 2019-08-13 14:14:38 · 253 阅读 · 0 评论 -
css 实现三角形、梯形、平行四边形、爱心等形状
css 是一门很高深的学问,是前端页面是否好看的支柱。之前一直小看了css的力量,最近看其他博主的书才明白自己的css是多么的菜,以为会点布局就是css了有点贻笑大方了。这篇博客利用css 实现各种形状的编写。完整代码:https://github.com/shenweizheng110/study/blob/master/demo/cssShape.htmlcss 要想实现三角形、梯...原创 2019-08-13 13:34:04 · 626 阅读 · 0 评论 -
原型链 与 继承的理解
原型链 与 继承的理解原型链是前端面试几乎必问的东西,原型链实现了js中的继承。在看完阮一峰老师的博客后,理解了原型链的作用。new 的由来关于new的由来大家可以借阅阮一峰老师的博客Javascript继承机制的设计思想构造函数在es5之前还没有类的时候,js都是 new 一个构造函数来生成一个构造函数的对象,这边的构造函数相当于java中的class,在es6之后,为了方便js也...原创 2019-07-26 20:48:24 · 392 阅读 · 0 评论 -
js 微任务 宏任务的执行顺序解释
js 微任务 宏任务的执行顺序解释js 是单线程执行的,js中的任务按顺序一个一个的执行,但是一个任务耗时太长,那么后面的任务就需要等待,为了解决这种情况,将任务分为了同步任务和异步任务,而异步任务又可以分为微任务和宏任务。首先第一段示例代码console.log('script start');setTimeout(function() { console.log('setT...原创 2019-07-26 09:23:51 · 8945 阅读 · 5 评论 -
BFC的触发条件、布局规则、使用场景
BFC的触发条件、布局规则、使用场景BFC指的是块级格式化上下文,简单的来说,BFC就是创建一个盒子,盒子内部的元素布局不影响盒子外部的元素。html根元素就是一个BFCBFC 的触发条件html根元素 <html>float 不为 none绝对定位元素 也就是 position 为 absolute 和 fixed行内快元素 display 为 inline-bl...原创 2019-07-31 09:37:59 · 842 阅读 · 0 评论 -
对 js 中 this 指向的理解
对 js 中的this 的理解this 指针一直都是一个很玄学的东西,它是函数运行时,函数内部自动生成的对象,只能在函数体内部使用。一下示例都是测试过的,对于答案请放心。如有疑问欢迎评论纯粹的函数调用这是函数通常的用法,属于全局性的调用,所以this指向全局。最简单的示例var x = 1;function test() { console.log(this.x);}...原创 2019-07-25 22:13:27 · 205 阅读 · 0 评论 -
19年校招前端面经(阿里-小米-字节跳动)
加个小前提,本人投的是web前端,如果分方向的话,是React方向。俗话说,金三银四,在这充满了刺激的三月,我也拿着我的一页纸的简历投了好几家公司,下面记录着我参加了面试的几家公司以及近期整理出的题目。很尴尬,没有拿到任何一家的offer,经过这几次的面试也发现自己的基础确实很差,打算歇息一阵子好好补一补自己的基础,准备开始秋招或者明年的春招,毕竟我还是很向往大公司的待遇的。不过我也发现了一点,...原创 2019-03-25 20:55:44 · 1194 阅读 · 1 评论 -
Git基本操作
title: Git基本操作cover: /img/8.jpg1.查看分支git branch 查看本地分支git branch -a 查看所有分支前面带有 * 号的表示当前分支。git branch xxx 添加本地分支git branch -d xxx 删除分支git pull 拉取代码git pull origin xxx 拉取远程分支git push xx...原创 2019-03-01 10:11:38 · 108 阅读 · 0 评论 -
webpack配置及踩过的那些坑
title: webpack配置及踩过的那些坑cover: img/8.jpg最近学习了一波webpack打包部署,作为一名前端,不会一个打包的工具可真的是丢人啊。不过,用webpack又要接触到了配置文件,这个当初当我放弃写后端的东西,不过以后还是要全面发展的。好了,话不多说,这篇文章用的是webpack4.x版本的,下面将细数当初才过的坑。1.基础准备创建一个文件夹webpackDe...原创 2019-03-01 10:11:17 · 855 阅读 · 0 评论 -
react应用中mobx未检测到数组的更新
title: react应用中mobx未检测到数组的更新cover: /img/5.jpg在mobx中定义一个可观察的数组class Store{ @observable testArray = [];}在组件里面引用这个storetestArray.map(item=>( <span>{item}</span>))这个打印这个t...原创 2019-03-01 10:10:54 · 3223 阅读 · 0 评论 -
window.open被拦截解决
title: window.open被拦截解决cover: /img/4.jpg项目开发中遇到window.open写在回调里被浏览器拦截.解决办法是在请求时新开一个tab页,然后再请求的回调里修改这个tab页的地址.let newWindow = window.open('about:blank'); // 新开一个tab页返回一个window对象axios.post(url})...原创 2019-03-01 10:10:30 · 770 阅读 · 0 评论 -
void (0) ??? undefined ???
title: void (0) ??? undefined ???tag:- js- magic今天看React的源码,发现了一个很有意思的写法,在ReactChildren.js中看见了这么一行代码var child = void 0,这个是出现在React编译之后的cjs/react.development.js中。在我的认知里,void是用来表示一个函数没有返回值的。尽然还有这种...原创 2019-09-27 22:05:59 · 385 阅读 · 0 评论