小呀嘛小二郎唷-CSDN博客

原创 webpack css-loader style-loader 打包错误

Module build failed (from ./node_modules/css-loader/dist/cjs.js):CssSyntaxError报错得很莫名其妙，这些unknown word不知道是从哪里冒出来的，百度了一下发现是webpack.config.js中css-loader与style-loader顺序反了，执行顺序是从右至左，所以应该是...

2019-11-04 22:45:56 601

原创原型链、继承

prototype 与 _proto_//实现一个instanceoffunction instance_of(L,R){ L = L.__proto__; while(L !== null){ if(L === R.prototype) return true; L = L.__proto__; } ret...

2019-09-07 11:59:03 155

原创 bug

addKey(dataSource) {return dataSource.map(c => {if (c.children) {return this.addKey(c.children);//return 之后就不会执行以下的操作了}let key = c.children ? c.catalogId : c.governId;return ({ ...c, ke...

2019-08-02 21:09:36 108

原创 yck前端面试之道理解

掘金的这本小册子覆盖面挺广的，但是有些解释我看不太懂，可能是默认读者对这些有个大概的了解，所以我上网找了一些相关阅读资料作为知识补充。JS基础考点对象（Object）类型function test(person) { person.age = 26 person = { name: 'yyy', age: 30 } return person}co...

2019-08-02 09:54:41 885

闭包简单地说，就是两个函数嵌套，内部函数可以读取外部函数的变量，并返回出来。变量作用域有局部变量和全局变量，函数内部可以直接访问全局变量，但是函数外部无法访问函数内部的局部变量。所以想在函数外部访问内部的变量时，就可以在函数内部再定义一个函数，使用子函数，把父函数的变量返回出去。函数被调用的时候，会创建一个执行环境和作用域链还有关联的活动对象。正常来说，某个函数执行结束以后，执行环境就被销毁了，...

2019-05-06 11:19:50 142

原创自适应布局

ui要求实现这样的自适应布局，padding不能变。做的过程中发现，在1280px的屏幕上API。。。标题的位置不够，被挤下来了，于是使用媒体查询、rem，在小于1440px的屏幕上，设置html的font-size，使1rem的px值变小，从何标题字号变小不会被挤下来。button要求固定在下方，一开始直接使用position定位，但是发现由于脱离了文档流button不占据空间，又不能设...

2019-04-26 20:24:01 418

原创函数防抖、节流

参考文章：函数节流与函数防抖彻底弄懂函数防抖和函数节流在学习函数防抖、节流的时候遇到一个疑惑var button = document.getElementsByClassName('button')[0];button.addEventListener('click', debounce(() => { console.log('点完了')}))function ...

2019-04-24 11:33:37 168

原创兼容问题

4.1placeholder的样式input::-webkit-input-placeholder{}input:-moz-placeholder { }input:-ms-input-placeholder{ }input 的 placeholder 行高在safari不生效，只要设置该line-height：100%input::-webkit-...

2019-04-02 11:24:25 87

原创不同dpr下的图片问题

今天设计提了个问题，因为mac上是2dpr的，所以需要2倍图。官网banner图使用img标签，不好改成background。于是我自己加了另外一组图片，使用display来控制显示与否。结构如下<ul class="banners banner-1x"> <li></li> <li></li> <...

2019-03-25 20:56:17 406

原创 chrome的问题

初来n公司，这边的一个toC业务还没有前后端分离，采用的是ssr。使用sftp协议将本地代码上传到测试服务器，由服务端渲染。更改的时候，发现无论怎么刷新chrome，都没有变化。换了一个浏览器，发现是chrome的缓存问题，为了开发方便，禁用了缓存。3.25 产品在她电脑发现了一个bug。这是一个联系客服的浮窗，使用@media对大于1440px使用大弹窗，小于1440使用小弹窗。然而在...

2019-03-25 11:21:24 175 1

原创前端常考算法

冒泡排序 function maopao(arr) { for(let i =0; i<arr.length; i++) { for(let j=0; j<arr.length-i; j++){ if(arr[j]>arr[j+1]){ [arr[j],arr[j+1]] = [arr[j+1],arr[j]] ...

2019-03-12 12:20:00 314

原创自适应

实现一个类似这样的功能，浏览器窗口缩小时里面的元素之间的间距也缩小，外面的绿色大框还需要相对页面垂直居中。但是有最大宽度和最小宽度，即在大屏幕时不能占满整屏，小屏幕不能锁成一团。大概结构：<div> <ul> <li></li> <li></li> <li...

2019-03-01 11:18:18 133

原创 button标签回车造成空格问题

<form> <input type="" name=""> <input type="" name=""> <input type="" name=""> </form>```form标签设

2019-02-25 17:36:19 310

原创每天一道前端大厂面试题

跟随木易杨大佬的脚步https://github.com/Advanced-Frontend/Daily-Interview-Question ['1', '2', '3'].map(parseInt) what & why ? map函数有两个参数map(fuction,thisArg),其中function有三个参数function(c,index,arr),parse...

2019-01-23 10:52:02 774

原创懒加载

JS clientHeight,scrollHeight,offsetHeight,scrollTop,offsetTop概念js判断进入可视区域原生 JS 实现最简单的图片懒加载原生JS实现最简单的图片懒加载//是否进入可视区域function isInsight(el) { const bound = el.getBoundingClientRect(); ...

2018-11-29 21:00:38 141

原创前端安全性防御

XSS攻击前端输入过滤，前端输出展示过滤& &amp< &lt> &gt" &quot' &#x27/ &#x2F对于有链接的，比如<a href=""></a> 要对href的内容进行校验，禁止javascrpt:...

2018-11-26 10:23:19 149

原创跨域

1、jsonp 需要目标服务器配合一个callback函数。2、window.name+iframe 需要目标服务器响应window.name。3、window.location.hash+iframe 同样需要目标服务器作处理。4、html5的 postMessage+ifrme 这个也是需要目标服务器或者说是目标页面写一个postMessage，主要侧重于前端通讯。5、CORS...

2018-11-18 17:46:01 128

原创闭包的理解

闭包，其实就是一个作用域的问题。 var a=[]; for(var i=0;i<10;i++){ a[i]=function(){ console.log(i); } a[6](); //10i=0时进行循环，a[0] = function(){ console.log(i) } ,这里的i不等于0，是因为函数只是被定义了，没有被调用，不会沿着作...

2018-10-28 13:23:29 181

原创前端收藏文章

基础前端基础进阶（四）：详细图解作用域链与闭包 ES6之let（理解闭包）和const命令正则表达式不要再问我跨域的问题了前端性能优化：细说浏览器渲染的重排与重绘快速排序算法javascript实现深入理解浏览器的缓存机制原型链与继承 https://blog.csdn.net/haohong5515/a...

2018-10-28 11:54:28 374

原创 react的setState——读《react小书》

调用 setState 的时候，React.js 并不会马上修改 state。而是把这个对象放到一个更新队列里面，稍后才会从队列当中把新的状态提取出来合并到 state 当中，然后再触发组件更新。setState传入参数：一种是对象参数,react会内部优化做批量更新第二种是fn fn的时候会立马调用forceUpdate 所以state立马生效 function(){...

2018-07-17 15:17:42 215

原创受控组件

React.js 认为所有的状态都应该由 React.js 的 state 控制，只要类似于 <input />、<textarea />、<select /> 这样的输入控件被设置了 value值，那么它们的值永远以被设置的值为准。值不变，value 就不会变化类似于 <input />、<select />、<textare...

2018-07-16 20:33:01 737

haohong5515的博客