搭建本地 mock 服务器 —为了更好的前端开发工作中，有时候前端的很多工作需要后端的支持，但是可能后端的接口还没有开发完，或者有些时候在联调阶段，修复某个 bug 的时候，环境挂了。。。 那么这个时候，我们的很多工作无法顺利的进行下去。于是萌生了搭建本地服务器的想法。首先粗略的说一下它的好处前端更加独立，在开发阶段对于后端的依赖性大大降低。联调和开发截断，对于新增加的接口，只需要后端提供接口文档就好，不需要等到他们真正的开发完成，前端就可以自己进入联调。修复和定位 bug 更加便捷，自测阶段中对于某些极端的边界条件，我们自己就可以实现构造数据，模拟边界条件。mock 数据的方式（这里我提供了 ...

原型概念在构造函数创建的时候，系统默认的帮构造函数创建并关联一个对象 这个对象就是原型作用在原型中的所有属性和方法，都可以被和其关联的构造函数创建出来的所有的对象共享访问原型构造函数名.prototype 实例化的对象.proto原型的简单使用利用对象的动态特性为原型对象增加成员直接替换原型对象（jq核心方法的实现 就是使用原型替换的思想）12345678910111213141516function Person (name) { this.name = name } Person.prototype.fn = function () { ...

无状态函数式组件创建纯展示组件，无法使用State，也无法使用组件的生命周期方法，只负责根据传入的props来展示，不涉及到要state状态的操作，是一个只带有一个render方法的组件类创建形式：123456789101112import React from 'react'function NoStatusComp (props) { console.log(props) return ( <div> <h1>我是无状态组件</h1> </div> )}export default NoStat ...

picker-extend.js一款多功能的移动端滚动选择器，支持单选到多选、支持多级级联、提供自定义回调函数、提供update函数二次渲染、重定位函数、兼容pc端拖拽等等..特性原生js移动端选择控件，不依赖任何库可传入普通数组或者json数组可根据传入的参数长度，自动渲染出对应的列数，支持单项到多项选择自动识别是否级联选择成功后，提供自定义回调函数callback() 返回当前选择索引位置、以及选择的数据（数组/json）每次手势滑动结束后，也提供一个回调函数transitionEnd() 返回当前选择索引位置、以及选择的数据（数组/json）能够在已经实例化控件后，提供update函数再 ...

前端构造桌面级音乐播放器（nw与electron）最近研究前端如何构造桌面级应用，看了一下nw和ecectron。于是自己使用vue写了一个pc版本的qq音乐播放器。由于时间太紧，做的功能很有限。但是本片文章主要是介绍nw与electron这两个工具。前端的代码已经开源，感兴趣的同学可以自己下载下来，添加一些比较有趣的功能以及进行代码的优化项目预览图分为首页、歌手列表页、歌手详情页、排行榜。排行榜详情页以及播放器页面，排行榜与歌手页基本一致 不做赘述首页歌手列表页歌手详情页歌手搜索功能播放器页面技术栈前端 vue、vue-router、webpack后端（代理） node+express做代理 ...

本文主要介绍redux的react-redux的原理redux原理github地址：https://github.com/majunchang/miniRedux总体流程图！！！原生react的调用和常用方法react流程图展示redux中有一个reducer函数和action 通过dispatch(action)来触发reducer的对应的case提供一个createStore方法 传入reducer 返回的对象中包含getState和subscribe和dispatch方法调用示例：redux 原生版的调用 getState()获取状态 subscribe()进行监听 dispatch() ...

createStore(reducer, [preloadedState], enhancer)创建一个 Redux store 来以存放应用中所有的 state。应用中应有且仅有一个 store。参数：reducer (Function): 接收两个参数，分别是当前的 state 树和要处理的 action，返回新的 state 树。[preloadedState] (any): 初始时的 state。 在同构应用中，你可以决定是否把服务端传来的 state 水合（hydrate）后传给它，或者从之前保存的用户会话中恢复一个传给它。如果你使用 combineReducers 创建 reduc ...

👉 GitHub: https://github.com/majunchang/reachChatApp基于==React(16.x)== 全家桶制作的一款实时聊天app，采用组件化，模块化的开发方式，用到了==react-redux==等插件，使用==antd-mobile==的ui框架。技术栈【前端】React: 用于搭建用户界面的javascript库，特点是声明式渲染和组件化开发Redux: Redux 是 JavaScript 状态容器，提供可预测化的状态管理。让你构建一致化的应用，运行与不同的环境，并且易于测试。React-redux: 核心在于provieder，connect ...

我们要明确页面在文档加载完成之后到完全显示中间的过程是根据文档生成DOM树（包括display:none的节点）在DOM树基础上根据节点的几何属性（margin/padding/width/height等)生成render树（不包括display:none、head节点但会包含visibility:hidden节点）在render树基础上进行进一步渲染包括color,outline等样式reflow:当render树中的一部分或者全部因为大小边距等问题发生改变而需要重建的过程叫做回流repaint:当元素的一部分属性发生变化，如外观背景色不会引起布局变化而需要重新渲染的过程叫做重绘回流一定会引 ...

本文采用了比较特殊的input和v-model指令 实际上vue的指令解析模板很复杂，本文重点是理解数据更新的思想几种实现双向绑定的做法目前几种主流的mvc(vm)框架都实现了单向数据绑定，而我所理解的双向数据绑定无非就是在单向绑定的基础上给可输入元素（input、textare等）添加了change(input)事件，来动态修改model和 view，并没有多高深。所以无需太过介怀是实现的单向或双向绑定。实现数据绑定的做法有大致如下几种：发布者-订阅者模式（backbone.js）脏值检查（angular.js）数据劫持（vue.js）发布者-订阅者模式:一般通过sub, pub的方式实现数 ...