喻小右

Fiddler工具对前端同学来说应该是很熟悉的，他的文件替换功能是大家经常用到的，调式线上问题，线下开发，预览线上效果，都可以使用他的文件替换功能实现，但是，Fiddler不支持mac平台，所以经常的用其他的方法，类似Charles之类的或者chrome插件，但是都不好用，今天推荐一款node工具，可以实现fiddler的文件替换功能。 whistle 使用方法请暂时参考官网以及github上介绍，后续在补充一些常用功能使用方法。 官网地址: https://avwo.github.io/whistle/ github地址： https://github.com/avwo/whistle

异步同步 异步在前端编程中是很常见的概念，那到底异步和同步是指什么？ 异步 异步指的是调用在发出后就立即返回了，也就是调用立即结束了，调用的结果通过信号等机制通知调用者，调用者可以在调用返回结果之前执行其他的操作，常用的处理方式是回调，这种场景大量存在于前端的ajax请求，nodejs的文件调用，网络调用场景当中； $.post('/url', { title: '异步', content: 'xx' }, function() { console.log('收到响应')； }); console.log('发送Ajax结束'); 如上所示的代码，可以看到收到响应是在发送AjaxA结束之后输出的。 同步 同步指的是调用发出后程序将停止运行等待调用结果的返回，

模块化规范 模块系统 requireJs RequireJS 是一个JavaScript模块加载器，采用AMD的模块化规范。它非常适合在浏览器中使用，使用RequireJS加载模块化脚本将提高代码的加载速度和质量。 seaJs seaJS 是一个JavaScript模块加载器，遵循CMD规范。 eslJs ESL是一个浏览器端、符合AMD的标准加载器，适合用于现代Web浏览器端应用的入口与模块管理。 ESL vs RequireJS 体积更小 (Smaller) 性能更高 (Higher performance) 更健壮 (More Robustness) 不支持在非浏览器端使用 (Browser only)

一个数据驱动的组件，为现代化的 Web 界面而生。具有可扩展的数据绑定机制，原生对象即模型，简洁明了的 API 组件化 UI 构建 多个轻量库搭配使用 官网地址：https://github.com/vuejs/vue 安利demo：https://github.com/ustbhuangyi/vue-sell 对vuejs有一定了解之后，就进入正文了，主要推荐两款组件库： 移动端 VUX 基于Vue和WeUI的组件库。

React特点 服务端渲染(首屏加载快，数据请求少，链路来回少) 虚拟DOM(优化前端性能) 专注View 不是完整的前端框架，需要依赖其他模块才能构建完整的前端框架

viewport viewport主要标签用来定义页面的显示，缩放等信息，常用的属性值如下： <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"> 其中width定义展示区域的宽度，一般写成device-width代表占满设备的横向屏幕；minimum-scale、maximum-scale定义最小和最大的放大倍数；user-scalable定义是否运行用户缩放。 format-detection format-detection主要定义一些格式识别，其中有：电话号码、邮箱、

使用Navigator对象 打印出window.navigator对象，可以发现一个字段onLine,官方对这个字段的解释是‘返回指明系统是否处于脱机模式的布尔值’。实测在chrome,firfox,IE9,safari中该字段能真实反应网络的连接状态,具体的兼容情况可以参考http://caniuse.com/#search=online

首先说下，session Storage和localStorage都是HTML提供的本地存储，但是又有一些区别 session Storage 用法 存储：sessionStorage.setItem(name,value); 获取：sessionStorage.getItem(name); local Storage 用法 存储：localStorage.setItem(name,value); 获取：localStorage.getItem(name); 区别 localStorage存储的内容不会随着网页的关闭而销毁

很多都不清楚JavaScript和ECMAScript的关系到底有什么关系，现在ECMAScript6出来之后，ECMAScript这个词渐渐的出现在大家的视野中。 其实JavaScript和ECMAScript是包含关系，ECMAScript是JavaScript的一部分，一个完整的JavaScript应该有下列三个不同的部分组成: 核心(ECMAScript) 文档对象模型(DOM) 浏览器对象模型(BOM) 从上面的结构应该不难看出，我们平常写js代码的时候基础的语法、类型、语句、关键字、操作符、对象等内容是属于我们的核心部分ECMAScript。

最近遇到一个问题，在特定情况下希望禁用掉鼠标事件，或是手机端的touch事件，这种情况下可以使用addEventListener监听需要禁止的事件，然后使用 e.preventDefault(); 方法来阻止事件的执行。但是在另一种情况下又希望此前禁止的事件能够正常使用，所以这时候就需要用到removeEventListener，但是下面的代码无效。 if(情况1){ document.addEventListener('touchmove', function(e) {e.preventDefault(); }, false); } if(情况2){ document.removeEventListener('touchmove', function(e) {e.preventDefault(