摘要：
css翻牌效果在一些活动页面使用的还是比较多的，目前网上大部分的方案都是使用 backface-visibility 等复杂且兼容性差的方案，本文介绍一种非常简单的方案。以扑克牌的翻转为例,如果事先准备好下面的两张图片 实现图片的翻转很简单,沿Y轴翻转180度的同时更换背景图片即可 但是直接翻转18 阅读全文
摘要：
一、RxJS是什么？官方文档使用了一句话总结RxJS: Think of RxJS as Lodash for events。那么Lodash主要解决了什么问题？Lodash主要集成了一系列关于数组、对象、字符串等集合操作,极大的方便了对这些集合数据进行衍生。举个简单的例子:求数组偶数元素的平方和const { pipe, filter, map, reduce } = require('loda... 阅读全文
摘要：
本文删改自Node.js 8 the Right Way Part I Chapter 3npm 使用语义版本控制(SemVer)来寻找包的最佳可用兼容版本。 以安装测试框架mocha为例$ npm install --save-dev --save-exact mocha@3.4.2-- save-exact (或-e)标志告诉 npm 我们希望指定特定的包... 阅读全文
摘要：
原文地址 Writing multiple Vue components in a single file在一个文件中编写多个组件是React的模式，其中一些文件包含多个组件。走开发过程中，有些组件对文件/导出组件是“私有的”，因为没有其他组件需要使用它们。这个时候我们倾向于把它们写到一个文件中。一. 使用render函数二. 使用Vue.component和template三. 仅使用templ... 阅读全文
摘要：
最近又把烂尾的开源项目alfred-femine拾起来了,这个项目旨在开发一系列前端常用的alfred workflow,提供前端开发的查询效率.时隔这么久，再次搞起，希望自己能够一直维护下去，也欢迎志同道合的同学一起完善这个工具链。为了便于项目的维护，我觉得用上传说中的“持续集成”的思想，本人不才，虽然看过很多持续集成的文章，但是连这种npm发包这种简单的“持续集成”都没实践过,这次下定决心要... 阅读全文
摘要：
原文地址 https://flaviocopes.com/graphql/中译文地址什么是GraphQLGraphQL的原则GraphQL vs RESTRest是一个概念单个端点根据你的需求量身定制GraphQL可以轻松监控字段的使用情况访问嵌套数据资源类型哪一个更好？GraphQL查询字段和参数别名片段GraphQL变量必选变量指定变量的默认值GraphQL指令@include（if：Bool... 阅读全文
摘要：
最近的一个活动配置需求，有一个非常奇葩的配置字段，可以配置活动在每天的某些时间段上线，如下图中“每日限时”，尽管已经是傻瓜操作了，但是考虑到严谨性，（实际上是为了防止产品手抖），如果两个时间段之间有重叠，应该合并两个时间段，比如下图两个时间段按道理应该合并成20:49~22:49。那么从代码层面该如何合并这两个时间段呢？首先需要判断两个时间段是否重叠，两个时间段如果有重叠的话，从正面考虑的话，... 阅读全文
摘要：
JS复制文本基本分为两步-First: 选中需要复制的节点,及选区；Second: 执行document.execCommand('copy')命令复制对于选区，属于HTMLInputElement 的 和元素支持element.select()方法 点击复制文字 // 复制输入框文字const target1 = document.querySelector('#test1>inpu... 阅读全文
摘要：
我在开发中使用canvas的机会不是很多，但是第一次实际使用中就遇到了问题，“很久很久以前，我自己画了一个雷达图，线宽都是1像素,但是显示效果不如期望，这才发现canvas中的画线还是有坑的”，对比一下两个图，可以发现下图比较清晰。我们先画一个线宽为1像素的线，代码和显示效果如下： const ctx = document.getElementById(canvas).getContext(... 阅读全文
摘要：
Fisher-Yates shuffle 是一种生成有限序列的随机排列的算法——简单地说，该算法可以对序列进行混排.本人能力有限,且懒.不会扒论文去研究该算法在数学上的证明,只能抄袭网上的博客总结一遍的算法的步骤,并分析一下Lodash对该方法的简单实现.1.原始算法步骤Fisher–Yates shuffle 算法之所以有这个👻命名,当然是由Fisher和Yates这两个人的发明的,一开始只是... 阅读全文
摘要：
很久以前,有面试官问过我如何实现"🎲"六面的布局,要求不能有多余的标签,不能使用定位,可以使用flex,当时觉得不添加标签的情况下不可能实现,今天心血来潮,试了一下,发现骰子每面长宽固定,点的大小固定的情况下,还是能实现的. ... 阅读全文
摘要：
Long, long, long ago,CSS3就支持了flex布局,现在各家浏览器都支持标准的语法了,这里推荐一篇比较全面的图文化教程A Complete Guide to Flexbox.关于Flex布局,刚开始学习CSS的时候就"复习"了好几遍,不是我吹,下面的代码也是信手拈来.div { display: flex; justify-content: space-evenly... 阅读全文
摘要：
这篇文章用来记录Web(包括PC和移动端)开发过程中遇到的一些疑难问题的解决方案。P1、 '1像素边框'问题P2、只读输入框在ios上的莫名表现P3、自适应高度的textareaP4、 CSS3实现翻牌特效P5.IOS 10 以上Safari手机浏览器禁止缩放P6 检测浏览器是否为IEP7 去掉input[type='number']后面浏览器默认的角标P8 将window.location.re... 阅读全文
摘要：
在ES6模块解决方案出现之前,工具库或包常用三种解决方案提供对外使用的接口,最早是直接暴露给全局变量,比如我们熟知的Jquery暴露的全局变量是$,Lodash对外暴露的全局变量是_,后来出现了AMD和CommonJS(CMD的一种实现)两种常用的模块解决方案.全局变量// MyDependency is in your global scopevar MyModule = function()... 阅读全文
摘要：
函数防抖与节流是日常开发中经常用到的技巧，也是前端面试中的常客，但是发现自己工作一年多了，要么直接复用已有的代码或工具，要么抄袭《JS高级程序设计》书中所述“函数节流”,（实际上红宝书上的实现类似是函数防抖而不是函数节流）,还没有认真的总结和亲自实现这两个方法，实在是一件蛮丢脸的事。网上关于这方面的资料简直就像是中国知网上的“水论文”,又多又杂，难觅精品，当然，本文也是一篇很水的文章，只当是个人理... 阅读全文