1. 什么是前端路由路由的概念来源于服务端，在服务端中路由描述的是URL与处理函数之间的映射关系。在web前端单页面应用中，路由描述的是 URL 和 UI 之间的映射关系，这种映射关系是单向的，即 URL 变化引起 UI 更新。2. 如何实现前端路由要实现前端路由，需要解决两个核心：如何改变URL 却不引起页面刷新如何检测URL 变...

前段时间学习了关于vue中响应式数据的原理，（并作了学习笔记vue响应式原理），其实是通过Object.defineProperty控制getter和setter，并利用观察者模式完成的响应式设计。那么数组有一系列的操作方法，这些方法并不会触发数组的getter和setter方法。那么vue中针对数组的响应式设计是如何实现的呢...那么我们一起去学习下吧~

提到vue，大家肯定会想到双向数据绑定，数据驱动视图，虚拟DOM，diff算法等等这些概念。在使用vue的时候，会感觉到它的数据双向绑定真的很爽啊。会不会在你用了很长时间后，会好奇到，这个是如何实现的？或者在遇到问题的时候，会不会想到，为啥这个数据并没有响应式的发生改变，视图怎么没有变化...当你抱着这些疑问的...

应公司要求准备弄一个cli，那就暂定为win-cli吧~然而发现有很多不了解的东西，学习的东西也挺多的，那就慢慢啃吧(慢慢吭是不阔能的...)~哈哈首先就是commander了。

Tip: React v16.8.0已经支持Hooks。当我们进行更新时，别忘了更新其他相关依赖包，包括React DOM等。React Native将会在下一个稳定版本支持Hooks。

If you want your application to be stable, don't use context. It is an experimental API and it is likely to break in future releases of React. If you aren't familiar with state management libraries like Redux or MobX, don't use context. If you aren't an experienced React developer, don't use cont...

diff并非React首创，只是React针对diff算法进行了优化。在React中diff算法和Virtual Dom的完美结合可以让我们不需要关心页面的变化导致的性能问题。因为diff会帮助我们计算出Virtual Dom变化的部分，然后只对该部分进行原生DOM操作，而非重新渲染整个页面，从而保证每次操作更新后页面的高效渲染。

在React中是通过this.setState()来更新state。当调用this.setState()的时候，React会重新调用render方法来重新渲染UI。

组件的挂载是最基本过程，这个过程主要做初始化。在这初始化个过程中componentWillMount会在render方法之前执行，而componentDidMount方法会在render方法之后执行。分别代表了渲染前后时刻。写一个简单的例子：

做过前端的童鞋应该都知道lodash这个强大的使用工具库。为什么要写这篇文章呢，主要今天遇到一个问题，socket推送消息太频繁，导致saga频繁更新，页面有所卡顿，需要通过函数节流控制，发现自己突然不会写这样的代码，而且模糊了节流和抖动的区别。简单实现一下，源码其实复杂的多。

简介 以下仅为个人粗略总结和代码，看不懂的稍加理解，本文主要用做个人记录。 先大致总结一下 1.从哪里开始：webpack根据入口模块开始。 2.如何进行：递归读取每个文件，会形成一个依赖列表，依赖列表的，依赖列表是一个以文件相对路径为key，文件内容为value的对象。 3.如何处理：对于每个文件会通过AST解析语法树，返...

首先了解下createStore.js。通过调用createStore创建唯一的store，store中暴露出getState，dispatch，subscribe，replaceReducer这几个方法。通常我们用到的主要是前三个方法，这里作为主要介绍内容。如下是createStore的主要内容：

一般在团队开发中每个人的代码习惯都不太一样，这样就会导致代码风格不一致，以致于维护和修改bug的时候看别人的代码成为一种痛苦...这种情况尤其在前端开发中尤为明显。因为关于前端的开发规范貌似也没有行业权威标准。这几天在网上看了下，基本上在开发中通过eslint进行约束，airbnb的标准貌似颇为推崇，今天稍微整理...

如上是vue官网的例子，你会注意到如果你选择一篇文章，切换到Archive标签，然后切回Posts， 是不会继续展示你之前选择的文章的。因为你每次切换新标签的时候，Vue都会创建一个新的currentTabComponent实例。

插槽内容 Vue实现一套内容分发的API， 这套API基于当前的web组件规范草案，将<slot>元素作为承载分发内容的出口。 {代码...} 然后在<navigation-link>的模板中可能会写为： {代码...} 当组件渲染的时候，这个<slot>元素将会被"Yourt Profile"替换。插槽可以包括任何模板代码，包括HTML: {代码...} 甚...

你可以用v-model指令在表单input，textarea以及select元素上创建双向数据绑定。它会根据控件类型自动选取正确的方法来更新元素。尽管有些神奇，但是v-model本质上不过是语法糖。它负责监听用户的输入事件以更新数据。

监听事件 可以使用v-on指令监听DOM事件，并在触发的时候运行一些JavaScript代码。 {代码...} 事件处理方法 因为事件处理逻辑会更为复杂，所以直接把JavaScript代码写在v-on指令中是不可行的，因此v-on还可以接受一个需要调用的方法名称。 {代码...} 内联处理器中的方法 除了直接绑定到一个方法，也可以在内联JavaScript...

用v-for把一个数组对应为一个组件元素 我们用v-for指令根据一组数组的选项列表进行渲染。v-for指令需要使用item in items形式的语法： {代码...} 在v-for块中，我们拥有对父作用域属性的完全访问权限。v-for还支持一个可选的第二个参数为当前项的索引。 {代码...} 也可以用of替代in作为分隔符，因为它是最接近JavaScript...

(1)在<template>元素上使用v-if条件渲染分组因为v-if是一个指令，所以必须将它添加到一个元素上，如果想切换多个元素呢？可以使用<template>元素当做不可见的包裹元素。并在上面使用v-if。最终渲染结果将不包含<template>

操作元素的class列表和内联样式是数据绑定的一个常见需求。因为它们都是属性，所以我们可以使用v-bind处理它们：只需要通过表达式计算出字符串结果即可。不过拼接字符串比较麻烦，因此在v-bind用于class和style时，vue做了专门的增强，表达式结果的类型除了字符串之外，还可以是对象和数组。

我们可以在表达式中调用方法来达到和计算属性相同的作用。但是计算属性是基于它们的依赖缓存的。只有在相关依赖改变的时候才会重新求值。这就意味着只要message没有改变，多次访问reverseMsg还是返回同样的值，而不是执行函数。

在底层的实现上，Vue将模板编译成虚拟DOM渲染函数。结合响应系统，Vue能够智能的计算出最少需要重新渲染多少组件，并把DOM操作次数减少到最少。

当一个Vue实例被创建时，它向Vue的响应式系统中加入了其data对象中能找到的所有属性。当这个属性的值发生变化时，视图将产生"响应"，即匹配更新后的值。

1.直接<script>标签引用， Vue会被注册成为一个全局变量。2.npm注：开发版本下不要使用压缩版本，不然会失去一些错误相关的警告。

redux是什么？在Redux中文指南中是这样描述的：Redux是JavaScript状态容器，提供可预测的状态管理。为什么开始分析redux的源码呢？第一让自己更加深入的了解一波redux的原理和实现机制。第二就是redux源码比较少，比较容易理解。其他难的源码我也看不懂，嘻嘻。

React是通过管理状态来实现对组件的管理。react通过this.state来访问state，通过this.setState()方法来更新state。当this.setState()被调用的时候，react会重新调用render方法来重新渲染UI。

Virtual Dom实际上是在浏览器端用JavaScript实现的DOM API，它之与React就类似一个虚拟空间，包括一套整体的virtual DOM模型，生命周期的维护和管理，性能高效的diff算法和将virtual DOM展示为原生DOM的Patch方法。

React主要思想是通过构建可复用组件来构建用户界面。所谓组件就是有限状态机。通过状态渲染对应的界面，且每个组件都有自己的生命周期，它规定了组件的状态和方法需要在哪个阶段改变和执行。

浏览器从服务器访问网页时获取的JavaScript，css资源都是文本形式的，文件越大网页加载时间越长。 为了提升网页加速速度和减少网络传输流量， 可以对这些资源进行压缩。 压缩的方法除了可以通过GIZP算法对文件压缩外，还可以对文本本身压缩。

为什么要区分环境 在开发网页的时候，一般都会有多套运行环境，例如： 在开发过程中方便开发调试的环境。 发布到线上给用户使用的运行环境。 这两套不同的环境虽然都是由同一套代码编译而来，但是代码内容却不一样，差异包括： 线上代码经过压缩处理开发用的代码包含一些用于提示开发者的提示日志，这些日志普通用户不可...