小兴
BFC 就是块级格式上下文，是页面盒模型布局中的一种 CSS 渲染模式，相当于一个独立的容器，里面的元素和外部的元素相互不影响。创建 BFC 的方式有： 1. html 根元素 2. float 浮动 3. 绝对定位 4. overflow 不为 visiable 5. display 为表格布局或者弹性布局 BFC 主要的作用是： 1. 清除浮动 2. 防止同一 BFC 容器中的相邻元素间的外边距重叠问题
弹层组件的content参数，只能支持传入jQuery对象，不支持DOM对象，所以做了些修改，兼容了DOM对象的传参形式。
最近在整理面试资源的时候，发现一道有意思的题目，所以就记录下来。 ### 题目 如何实现 multi(2)(3)(4)=24? 首先来分析下这道题，实现一个 multi 函数并依次传入参数执行，得到最终的结果。通过题目很容易得到的结论是，把传入的参数相乘就能够得到需要的结果，也就是 2X3X4 = 24。 ### 简单的实现 那么如何实现 multi 函数去计算出结果值呢？脑海中首先浮现的解决方案是，闭包。 ```javascript function multi(a) { return function(b) { return function(c) { return a * b...
## 简介 AlloyFinger 是由腾讯前端团队 AlloyTeam 出品的一个小巧轻量级的移动端手势库，整个手势库的代码不超过400行，却支持绝大多数的手势操作，能够满足日常的开发需求。AlloyFinger传送门： [AlloyFinger](https://github.com/AlloyTeam/AlloyFinger)。 ## JavaScript 移动端触摸事件 手机移动端浏览器提供了4种触摸事件：touchstart，touchmove，touchend，touchcancel，分别对应的是手指触点刚接触屏幕时触发事件，手指触点在屏幕上移动时触发事件，手指触点移开屏幕时触发事件以及被系统中断时触发事件（按 Home 键返回主屏等操作）。 这里要说明下，移动端浏览器也支持部分 PC 端带有的事件，比如 click 事件。但是在移动端上，click 事件会存在延时触发的情况，大概延时300ms。 ### 移动端300ms延时触发 click 事件 在移动端为什么click事件会存在延时触发的情况呢？究其原因，是因为苹果公司在早期发布iphone的时候，采用了双击缩放网页的设计。当用户手指点击一次屏幕时，浏览器不能立即判定用户操作是单击操作还是双击操作，而是延迟了300ms，以判断用户是否再次点击了屏幕，如果300ms之内没有再次点击屏幕就判定为单击事件，才会去触发click事件。 ## 源码分析 AlloyTeam 团队为 AlloyFinger 打造了多个能够适用不同技术栈中的手势库版本，能够方便的使用在...
最近在整理面试资源的时候，发现一道有意思的题目，所以就记录下来。 ### 题目 如何实现 multi(2)(3)(4)=24? 首先来分析下这道题，实现一个 multi 函数并依次传入参数执行，得到最终的结果。通过题目很容易得到的结论是，把传入的参数相乘就能够得到需要的结果，也就是 2X3X4 = 24。 ### 简单的实现 那么如何实现 multi 函数去计算出结果值呢？脑海中首先浮现的解决方案是，闭包。 ```javascript function multi(a) { return function(b) { return function(c) { return a * b...
# Vue源码系列--初始化 最近在看 Vue 的源码架构，打算在公司组织 Vue 源码的分享会，所以准备做一系列关于 Vue 源码的技术输出。 ## 目录结构 先来大致看下 vue 目录结构，这里只列出 src 目录下的文件结构。 ``` ├── src ├── compiler -------------------------------- 编译器代码，将 template 模板编译成 render 函数 ├── core ------------------------------------...
先来明白些概念性内容。 ## 进程、线程 * 进程是系统分配的独立资源，是 CPU 资源分配的基本单位，进程是由一个或者多个线程组成的。 * 线程是进程的执行流，是CPU调度和分派的基本单位，同个进程之中的多个线程之间是共享该进程的资源的。 ## 浏览器内核 * 浏览器是多进程的，浏览器每一个 tab 标签都代表一个独立的进程（也不一定，因为多个空白 tab 标签会合并成一个进程），浏览器内核（浏览器渲染进程）属于浏览器多进程中的一种。 * 浏览器内核有多种线程在工作。 * GUI 渲染线程: * 负责渲染页面，解析 HTML，CSS 构成 DOM 树等，当页面重绘或者由于某种操作引起回流都会调起该线程。 * 和...
在上篇文章中，遗留了两个问题： * arguments 存在性能问题 * call 比 apply 速度更快 本篇文章将会对这两个问题进行详细的分析。 ### arguments 存在性能问题 arguments 是存在于函数内部用于存储传递给函数的参数的类数组对象，在函数被调用时创建。arguments 是类数组对象，只拥有 length 属性，但是可以在函数内部转换为数组。 ```javascript function test() { var args = Array.prototype.slice.call(arguments); console.log(args); // ["白展堂", "吕秀才"]...
### 前言 经常会看到这样的面试题，让面试者手动实现一个 map 函数之类的，嗯，貌似并没有什么实际意义。但是对于知识探索的步伐不能停止，现在就来分析下如何实现 map 函数。 PS: 关于 underscore 源码解读注释，详见：[underscore 源码解读](https://github.com/webproblem/Blog/blob/master/源码解读/underscore/Underscore.1.8.3.analysis.js)。 ### Array.prototype.map 先来了解下原生 map 函数。 map 函数用于对数组元素进行迭代遍历，返回一个新函数并不影响原函数的值。map 函数接受一个 callback 函数以及执行上下文参数，callback 函数带有三个参数，分别是迭代的当前值，迭代当前值的索引下标以及迭代数组自身。map 函数会给数组中的每一个元素按照顺序执行一次 callback 函数。 ```javascript var arr =...
 ### 前言 前段时间看到过一道实现数组乱序的面试题，也在《如何轻松拿到淘宝前端 offer》一文中看到作者提到数组乱序的问题，竟然还涉及到 v8 引擎方面的知识，正好近期在拜读 underscore 的源码，自己也没有了解过这方面的知识点，在此就总结下关于数组乱序的知识。 ### 面试题 看到的面试题大致是这样的：```var arr = ['a', 'b', 'c', 'd', 'c']; 实现数组乱序``` 。 首先，通过题目可以看出，可能存在一个小陷阱，数组中存在两个 'c' 元素，我想这并不是面试官或者出题人无意打错字，可能是想顺便考察下面试者对数组去重的掌握情况。当然了，这个小细节也可以忽略直接进入实现乱序功能。 对于有代码洁癖的开发人员来说，是不允许自己的程序中出现相同的元素数组值的，所以我们先把数组去重好了。 ```javascript arr = [...new Set(arr)];...