blog
blog copied to clipboard
biaochenxuying
大前端技术为主，读书笔记、随笔、理财为辅，做个终身学习者。
 **前言** 本文内容讲解的内容：**一张思维导图辅助你深入了解 Vue | Vue-Router | Vuex 源码架构**。 项目地址：[https://github.com/biaochenxuying/vue-family-mindmap](https://github.com/biaochenxuying/vue-family-mindmap) [markdown 文字版](https://github.com/biaochenxuying/vue-family-mindmap/blob/master/Vue-family.md) [pdf 版](https://github.com/biaochenxuying/vue-family-mindmap/blob/master/Vue-family.pdf) 先来张 Vue 全家桶 总图：  ## 1. 项目目录  scripts: 构建相关的文件，一般情况下我们不需要动。 - git-hooks：存放git钩子的目录 - alias.js：别名配置 -...
## 1. 需求 如果要你实现一个前端路由，应该如何实现浏览器的前进与后退 ？ ## 2. 问题 首先浏览器中主要有这几个限制，让前端不能随意的操作浏览器的浏览纪录： - 没有提供监听前进后退的事件。 - 不允许开发者读取浏览纪录，也就是 js 读取不了浏览纪录。 - 用户可以手动输入地址，或使用浏览器提供的前进后退来改变 url。 所以要实现一个自定义路由，解决方案是**自己维护一份路由历史的记录**，从而区分 前进、刷新、回退。 下面介绍具体的方法。 ## 3. 方法 目前笔者知道的方法有两种，一种是 **在数组后面进行增加与删除**，另外一种是 **利用栈的后进先出原理**。 ### 3.1 在数组最后进行...
 ## 1. 前言 > 算法为王。 **想学好前端，先练好内功，只有内功深厚者，前端之路才会走得更远**。 笔者写的 **JavaScript 数据结构与算法之美** 系列用的语言是 **JavaScript** ，旨在入门数据结构与算法和方便以后复习。 之所以把`归并排序、快速排序、希尔排序、堆排序`放在一起比较，是因为它们的平均时间复杂度都为 **O(nlogn)**。 请大家带着问题：`快排和归并用的都是分治思想，递推公式和递归代码也非常相似，那它们的区别在哪里呢 ?` 来阅读下文。 ## 2. 归并排序（Merge Sort） **思想** 排序一个数组，我们先把数组从中间分成前后两部分，然后对前后两部分分别排序，再将排好序的两部分合并在一起，这样整个数组就都有序了。 归并排序采用的是`分治思想`。 分治，顾名思义，就是分而治之，将一个大问题分解成小的子问题来解决。小的子问题解决了，大问题也就解决了。  > 注：x...
> “如果你没找到一个当你睡觉时还能挣钱的方法，你将工作到死。” ——巴菲特  上图是北京早上 8 点钟挤地铁上班的人们。不知图上有没有你的缩写。 ## 前言 **金钱是有规律的，只要掌握了一定的规律，虽说不能一夜暴富，但是把掌握的规律用于生活中，至少是可以让挣钱变得轻松一些。** 不知道他们有没有想过：**生活中，单靠增加工时获得的收入永远无法让你摆脱贫穷。用青春来换钱的交易也绝对不可取。** **绝大多数的人**，都是非常勤奋的，不然也不能坚持每天定时去上班，但又是懒惰的，从来没有想过学习掌握金钱的规律。 ## 要点 最近笔者在看作者博多·令费尔写的一篇小作《小狗钱钱》，这本《小狗钱钱》是根据作者根据他写的《财务自由之路》，把其中的方法与策略编成这么一个小故事的。《小狗钱钱》讲的是一个 11 岁的小女孩捡到一条会说人话的狗（名为 钱钱），然后钱钱教会了这个小女孩与钱打交道的方法，怎样理解钱与一步步轻松地挣钱，最后小姑娘不仅自己掌提了钱的使用方法，而且还帮助自己的父母走出了财务危机的故事。 看完这篇小作，做点笔记与写自己下看完后的一些感悟。 里面讲到一个故事： “从前有一个农家小伙儿，他每天的愿望就是从鹅笼里拣一个鹅蛋当早饭。有一天，他竟然在鹅笼里发现了一只金蛋。一开始他当然不敢相信自己的眼睛。他想，也许是有人在捉弄他。为了谨慎起见，他把金蛋拿去让金匠辨别，可是金匠向他保证说，这只蛋完完全全是金子铸成的。于是，这个农家小伙儿就卖了这只金蛋，举行了一个盛大的庆祝会。” “第二天清晨，他起了一个大早，赶到鹅笼里一看，那里果真又放着一个金蛋，这样的情况延续了好几天。可是这个农家小伙儿是一个贪婪的人，他抱怨自己的鹅，因为鹅没法向他解释是怎么下出这个蛋的，否则他也许自己就可以制造金蛋了。他还气乎乎地想，这只懒惰的鹅每天至少应该下两只金蛋。他觉得现在这样的速度太慢了。他的怒火越来越大，最后，他终于怒不可遏地把鹅揪出笼子劈成了两半。自那以后，他再也得不到金蛋了。” > 假如我没有了我的“鹅”，我就总是得为了赚钱而工作，但是一旦我有了属于自己的“鹅”，我的钱就会自动为我工作了。 > 金钱有一些秘密和规律，要想了解这些秘密和规律，前提条件是，你自己必须真的有这个愿望。 必须真的有这个愿望的意义在于，如果足够的动力，没有足够的决心去做某些事情，终究很难成事。 > 如果你只是带着试试看的心态，那么你最后只会以失败而告终，你会一事无成。尝试纯粹是一种借口，你还没有做，就已经给自己想好退路了。不能试验。你只有两个选择: **做，或者不做**。...
 ## 1. 前言 > 算法为王。 **想学好前端，先练好内功，只有内功深厚者，前端之路才会走得更远**。 笔者写的 **JavaScript 数据结构与算法之美** 系列用的语言是 **JavaScript** ，旨在入门数据结构与算法和方便以后复习。 之所以把 **计数排序、桶排序、基数排序** 放在一起比较，是因为它们的平均时间复杂度都为 **O(n)**。 因为这三个排序算法的时间复杂度是线性的，所以我们把这类排序算法叫作 **线性排序**（Linear sort）。 之所以能做到线性的时间复杂度，主要原因是，这三个算法不是基于比较的排序算法，都不涉及元素之间的比较操作。 另外，请大家带着问题来阅读下文，问题：如何根据年龄给 100 万用户排序 ？ ## 2. 桶排序（Bucket Sort）...
 ## 前言 > 想写好前端，先练好内功。 栈内存与堆内存 、浅拷贝与深拷贝，可以说是前端程序员的内功，要知其然，知其所以然。 笔者写的 **JavaScript 数据结构与算法之美** 系列用的语言是 **JavaScript** ，旨在入门数据结构与算法和方便以后复习。 ## 栈  **定义** 1. 后进者先出，先进者后出，简称 **后进先出**（LIFO），这就是典型的`栈`结构。 2. 新添加的或待删除的元素都保存在栈的末尾，称作`栈顶`，另一端就叫`栈底`。 3. 在栈里，新元素都靠近栈顶，旧元素都接近栈底。 4. 从栈的操作特性来看，是一种 `操作受限`的线性表，只允许在一端插入和删除数据。 5. 不包含任何元素的栈称为`空栈`。...
 # 前言 只有深入学精一门语言，学其他语言才能更好地举一反三，触类旁听。 从接触前端开发到现在已经将近 2 年了，最近又看了阮一锋写的： [《JavaScript 语言入门教程》](https://wangdoc.com/javascript/index.html) 一书，重温 JavaScript 。 小汪将工作和面试遇到过的，没多少人知道的 JavaScript 技巧，却十分实用的技巧都总结在这里面，分享给大家 。 温故而知新，我们对技术应该有的态度是： Stay hungry ! Stay young ！ # 1. 标签（label） JavaScript 语言允许，语句的前面有标签（label），相当于定位符，用于跳转到程序的任意位置，标签的格式如下。 ``` label:...
 # 前言 需求：获取当前日期的前一个月份 **当月有 31 天时，JS 日期对象 setMonth 问题** ## 1. 一般做法 当前日期如果不是 31 号, 是没问题的，是 31 号就会有问题： ``` // 比如今天是 2018-09-30 号，前一个月应该是 2018-08-30 let now = new Date(new...
 # 前言 此项目是用于构建博客网站的，由三部分组成，包含前台展示、管理后台和后端。 此项目是基于 react + node + express + ant + mongodb 的，项目已经开源，项目地址在 github 上，喜欢的，欢迎给个 star 。 **项目地址：** > [前台展示: https://github.com/biaochenxuying/blog-react](https://github.com/biaochenxuying/blog-react) > [管理后台：https://github.com/biaochenxuying/blog-react-admin](https://github.com/biaochenxuying/blog-react-admin) > [后端：https://github.com/biaochenxuying/blog-node](https://github.com/biaochenxuying/blog-node) # 1. 效果图...
 # 前言 此 blog 项目是基于 react 全家桶 + Ant Design 的，项目已经开源，项目地址在 github 上。 # 1. 效果  完整效果请看：[http://biaochenxuying.cn/main.html](http://biaochenxuying.cn/main.html) # 2. 功能描述 ## 2.1 已经实现功能 - [x] 登录 - [x]...