web前端
文章平均质量分 64
codeplay_guo
前端爱好者
展开
-
【动态规划法】解析经典算法题Two eggs problem及其延伸问题
【动态规划法】解析经典算法题Two eggs problem及其延伸问题Two eggs problem可以说是互联网面试中老生常谈的算法题了,经常可以在各大互联网公司的笔试真题中看到它的各类变种(腾讯大厦,球掉落问题,玻璃珠问题等等)。本文将深入探讨此类问题及其延伸问题的通用解法,并给出javascript代码实现。问题描述Two-eggs problem首先看下游戏的定义: 有一幢100层的原创 2017-03-28 12:04:14 · 2782 阅读 · 0 评论 -
阿里前端算法面试题两道
二维数组的全排列组合。 如输入[[1,2],[3,4],[5,6]] 输出: [ 1, 3, 5 ] [ 1, 3, 6 ] [ 1, 4, 5 ] [ 1, 4, 6 ] [ 2, 3, 5 ] [ 2, 3, 6 ] [ 2, 4, 5 ] [ 2, 4, 6 ]代码实现:function printArr(arr,n,res){原创 2017-08-22 14:40:49 · 6157 阅读 · 2 评论 -
用es6语法实现event类
如题,要求可以实现链式操作,具有on,off, emit,once,代码:class EventEmitter{ constructor(){ this._events={} } on(event,callback){ let callbacks = this._events[event] || [] callbacks.pu原创 2017-08-16 13:35:58 · 3782 阅读 · 0 评论 -
react-redux学习笔记
使用action创建函数封装逻辑是react与redux配合的最佳实践: - 当所有的逻辑都被转移到redux之后,react就可以只负责渲染界面并发起action创建函数了 ActionCreator要返回一个action对象,那么它是如何处理复杂的逻辑的呢? —> 中间件发起一个action创建函数,只需要将其返回结果传给dispatch()为什么使用redux thunk?该中间件原创 2017-07-07 11:34:07 · 546 阅读 · 0 评论 -
使用redux-thunk实现异步操作的中止
前端开发中常常会有这样的需求:设计一个select组件,每做一次选择就用ajax异步加载数据到指定页面。实现这个需求并不困难,但是仅仅是这样做,难免会出现一些不太理想的体验:如果用户迅速的切换选项,那么返回的结果不一定是用户最后选择的那个结果。因为请求是异步的,而请求发出到获得响应的过程时间是不可估的,用户很可能临时改变主意或等不及了而去发出一个新的请求。而页面最终呈现的结果是以最后到达的请求为准,原创 2017-07-06 19:51:18 · 1522 阅读 · 0 评论 -
codewars上的一道训练函数式编程思维的编程题
分享codewars上的一道训练函数式编程思维的编程题。 https://www.codewars.com/kata/church-numbers-add-multiply-exponents/train/javascript 这个题目用了大量的篇幅进行思路引导,最后让实现加法,乘法和指数乘法三个函数,这里我就不翻译了,只给出题目给出的条件和所有目标整理一下题目给出的条件:函数chur原创 2017-07-14 19:23:18 · 845 阅读 · 0 评论 -
es5中‘==’与‘===’算法的实现
1 “===“The comparison x === y, where x and y are values, produces true or false. Such a comparison is performed as follows:If Type(x) is different from Type(y), return false.If Type(x) is Undefined,原创 2017-06-21 17:28:31 · 491 阅读 · 0 评论 -
前端页面文件拖拽上传模块html/css/js代码示例
最近给卫生局做一个表格上传/可视化系统,算是小有成果。今天把项目中的文件拖拽上传模块分离出来,做了一个独立的小demo,并把相关代码打包上传到了我的github中,为了其他学习者和开发者提供拙见。gitHub地址:https://github.com/codeplay2015/dragToUpload由于代码中我的注释很详尽,所以具体逻辑实现及不介绍了,大家直接看代码及能明白。现在简单列一个功能清单原创 2017-05-18 18:05:39 · 7862 阅读 · 2 评论 -
前端面试ajax考点汇总
1. 手写一个ajax get方法var xhr=new XMLHttpRequest();xhr.onreadystatechange=function(){ if(xhr.readyState == 4){ if(xhr.status>=200 &&xhr.status<300 || xhr.status == 304){ console.log原创 2017-05-08 22:28:01 · 1580 阅读 · 0 评论 -
通过chrome调试器测试了解浏览器解析和渲染HTML的过程
1.基础知识:了解chrome的Timeline工具仅仅是通过理论知识,很难记住和理解浏览器解析html的原则,因此我动手做了些小实验。而做这个实验,不得不用到一个工具:chrome的Timeline工具。这个工具真的很强大,Timeline工具栏提供了对于在装载Web应用的过程中,时间花费情况的概览,这些应用包括处理DOM事件, 页面布局渲染或者向屏幕绘制元素。Timeline可以通过事件,框架,原创 2017-04-25 18:15:24 · 4345 阅读 · 0 评论 -
node中javascript模块的编译原理
众说周知,Node中的模块是根据CommonJS规范来实现的,但是,Node是实现过程中也对规范进行了一定的取舍。尽管规范中exports,require和module听起来十分简单,但是Node在实现过程中经历了什么,还是值得进一步思考和探索的。本篇博客是本人阅读朴灵的《深入浅出理解NodeJS》一书的一篇读书笔记。主要记录下自己在阅读JS模块编译部分章节的一点心得。Node中,每个文件模块都是原创 2017-05-15 17:57:26 · 1538 阅读 · 0 评论 -
ECMA-262-5 in detail. Chapter 2. Strict Mode.
推荐一个非常棒的深入学习js的网站,叫ds.laboratory,应该是一个国外牛人(name:Dmitry Soshnikov )维护的一个博客 地址:http://dmitrysoshnikov.com/category/ecmascript/ 里面对ECMA规范的解读都比较深刻,截取部分目录 by Dmitry SoshnikovSkip to content About Index原创 2017-05-12 10:56:49 · 429 阅读 · 0 评论 -
【JavaScript】理解所谓的‘寄生组合式继承’
最近又反复阅读了《js高级程序设计》上对js继承的介绍,然后在掘金上也看到篇比较深刻的介绍js类与继承的博文,所以来谈下自己的理解。 先贴下那篇博文:JavaScript 的继承与多态 再贴两篇能够更深刻地帮助理解js对象模型的文章: 1.js运算符instanceof的工作原理 2.JavaScript对象模型-执行模型基本的方法就不说了,原型链啊,借用构造函数啊,组合式啊,寄生(分离)式原创 2017-05-11 12:35:57 · 7699 阅读 · 4 评论 -
由一道js题探讨构造函数、prototype和__proto__之间的关系
今天在牛客上看到这样一个题:var F = function(){};Object.prototype.a = function(){};Function.prototype.b = function(){};var f = new F();问:能否通过f取到方法a,方法b?在git上看到有人画了这么一个图: 你如果理不清prototype,_proto _,construcor这些概念和关原创 2017-05-02 23:12:39 · 4254 阅读 · 0 评论 -
js创建dom节点之最容易被忽略的createDocumentFragment()方法
js常见的创建dom节点的方法有createElement() 创建一个元素节点 => 接收参数为string类型的nodename createTextNode() 创建一个文本节点 => 接收参数为string类型的text内容 createAttribute() 创建一个属性节点 => 接收参数为string类型的属性名称createComment() 创建一个注释节原创 2017-04-16 18:12:29 · 16668 阅读 · 0 评论 -
【web性能优化】使用SVG中的Symbol元素制作Icon,解决图片分辨率适配问题
前言随着大屏幕分辨率的普及以及各种移动设备层出不穷的移动互联网时代的到来,我们在网站设计时更应该关心内容在各种设备上的阅读性和显示效果。我们都希望能在任何时间,任何设备上都能清楚的,高效的传递信息给用户。而随着各种高清视网膜屏幕的出现,现在web设计也需要考虑各种高清屏幕的显示效果,同样前端在代码实现的时候也需要根据屏幕的不同来输出不同分辨率的图片。为了使我们的网页能够适配视网膜屏幕上的高转载 2017-04-16 15:07:32 · 2508 阅读 · 2 评论 -
用原生js实现addClass,removeClass,hasClass方法
其实html5已经扩展了class操作的相关API,其中classList属性就以及实现了class的增删和判断。 classList属性的方法有: add(value) 添加类名,如果有则不添加 contains(value) 判断是否存在类名,返回Boolean值 remove(value) 从列表中删除类名 toggle(value) 切换类名:如果列表中存在则删除原创 2017-04-18 13:24:22 · 24998 阅读 · 1 评论 -
Application Cache 无法加载其他静态资源
今天在自己做的项目中加了Application Cache 功能,把一些js文件放在了列表里。然后第一次加载没问题,我原来是这样写的:把NETWORK和FALLBACK都去掉了。以为这个清单的作用就是 如果查到,就存入本地,下次从本地加载,如果未查到就从服务器上下载:CACHE MANIFEST#需要缓存的列表\assets\js\demo.js\assets\js\bootstrap-noti原创 2017-04-28 17:02:36 · 282 阅读 · 0 评论 -
【美团面试】不开辟新的内存空间实现数组去重
美团内推面试的一道题。如果没有变量限制,方法很多很多,这里面试官要求不要定义新的引用型变量 其实吧,只是不开辟一个对象或数组变量。用splice修改自身:function fn(resArr){ for (var i=0;i<resArr.length;i++){ if(resArr.indexOf(resArr[i])!==i){ resArr.splice(i,1)原创 2017-08-28 15:06:30 · 1471 阅读 · 0 评论