cobish
cobish
2014 年是一个转站点，前半个学期我还是以一个学生的身份上课考试，后半个学期则转变成一个求职者四处求职。我想通过某种方式记录一下这一年我的经历，于是便有了这篇文章。 从 2013 年的 11 月份开始，我便跟随着研究生师兄团队创业。当时负责做校园资讯类的苹果 App，大家没有接触过苹果方面的开发，于是一边摸索一边实践。经过了一个寒假的时间，我们开发出来的应用终于上了 App Store，现在搜“鸽子信”还能搜到，遗憾的是一打开应用就奔溃了。后来由于实习等种种原因，我离开的师兄的团队。 3 月份的时候，我和同学一起报名学车，也庆幸这时候报了名，再晚了话就没有那么多自由的时间拿来练车了。5 月份我通过的科目一，然后期间练车了一个月，大概 7 月份的时候通过了科目二和长训。炎热的夏天、幽默的教练、不同的学员，至今依然历历在目。 大三的最后一个暑假里，我去了中北明夷公司（兔展）实习。公司那时候才刚起步，暂时还没有自己的项目，都是外包接单做项目。开始学习了 Python 和 Django 去满足外包项目的需求。后来跟着别人一起学习 Grunt、Less、Git 等知识，第一次接触到前端那么多未知的东西，以至于后来的半年内都还未真正了解到它们的优势。 离开实习公司之后，我开始四处面试不同的公司。遗憾的是百度三面没过，深信服一面没过。哈哈大家都在自己的博客写面试成功的经历，而我却没什么好写的。后来在 12 月意外地拿到了深圳报业集团的 offer，没什么好说的，连我自己都不知道怎么就通过面试的。 自从接触了《小狗钱钱》和《富爸爸穷爸爸》一系列书籍之后，我便一发不可收拾地喜欢上的读书。这一年阅读的非技术书籍比以前阅读的书籍还要多。希望能够继续保持这一个习惯。 大家都会在新来的一年里定下自己新奋斗的目标，我也不例外，管它能不能实现。新的一年里我希望自己能够顺顺利利毕业，认认真真工作，进一步提高自己的专业技能，提高自己的竞争力。
## 前言 Promise 是 ES6 新增的一个内置对象， 它是用来避免回调地狱的一种解决方案。 从以前一直嵌套传回调函数，到使用 Promise 来链式异步回调。Promise 究竟是怎么实现，从而达到回调函数“扁平化”？ 接下来就来一步步实现一个简单的 Promise。开始发车了... ## 执行步骤 先来看一个使用 Promise 的简单例子： ``` js var p = new Promise(function a (resolve) { console.log(1); setTimeout(function...
## 前言 在学习 vue-router 的代码之前，先来简单了解一下前端路由。 前端路由主要有两种实现方法： 1. Hash 路由 2. History 路由 先来看看这两种方法的实现原理。 接着我们将用它们来简单实现一个自己的前端路由。 ## 前端路由 ### Hash 路由 url 的 ``hash`` 是以 ``#`` 开头，原本是用来作为锚点，从而定位到页面的特定区域。当 ``hash`` 改变时，页面不会因此刷新，浏览器也不会向服务器发送请求。 ``` js http://www.xxx.com/#/home...
## 前言 本打算开始深入源码，跟原来阅读源码的方式一样。 但是总觉得这样有哪里不对劲，是的，一味的看着源码也只能猜测代码的思路，并不能证明这思路就是正确的。 于是我打算换一种方式阅读源码，于是想到了**打断点调试**。 然而在尝试调试 vue 的源码期间，我遇到了不少问题，所以干脆就总结成这篇文章，给大家分享分享。 ## 安装环境 先是 clone 整个项目，我选择的是 [[email protected]](https://github.com/vuejs/vue/tree/v2.0.1)。 进入目录，执行命令 ``npm install`` 安装 node_modules。 打开文件 ``build/config.js``，找到 ``genConfig`` 函数，添加上 sourceMap。  然后执行命令 ``npm run dev`` 后即可调试。...
## 初衷 也许你日常中经常使用到 ``new Vue()`` 来实例化一个 Vue 对象，但你却不知道它到底做了什么操作。你想知道，于是你打开 Vue 的源码，但被庞大的代码吓跑了。你不是一个人，我也一样。 来来去去我也打开过很多次 Vue 的源码，到现在依旧会有点抵抗。但我觉得还是需要先把我理解的先记录下来，日后再逐步完善。 Vue 的源码文章在网上有很多，我也阅读了不少。而我接下来记录的文章也是茫茫大海中的一滴水。不求比其他文章更加优秀，只希望能够给和我一样的你一丝丝帮助。 接下来看看 ``new Vue()`` 的一个大体流程吧。 ## 大体流程 再多的文字解释也没有一张清晰的流程图更加容易理解。是时候祭出 @zhouweicsu 的这一张清晰又易理解的流程图。 在还没有打开 Vue 的源码之前，我们只需要有个大概的印象即可。可以将 Vue 分成两个过程，分别是 ``DOM...
## 前言 首先我们需要知道为何要使用 vuex。父子组件通信用 prop 和自定义事件可以搞定，简单的非父子组件通信用 bus（一个空的 Vue 实例）。那么使用 vuex 就是为了解决复杂的非父子组件通信。 仅仅会使用 vuex 没什么，看过文档敲敲代码大家都会。难道你就不想知道 vuex 是如何实现的？！ 抛开 vuex 的源码，我们先来想想如何实现一个简单的 "vuex"。有多简单呢，我不要 getter、mutation、action 等，我只要 state 就行了。 ## 非父子组件通信 在实现之前，我们得来温故一下 ``bus`` 的实现，借用官网的例子： ```...
## 开头 最后来了解了解 vue-router 的两个组件 ```` 和 ````。 这两个组件的使用方式如下： ``` html Hello App! Go to Foo Go to Bar ``` 在打开源码之前，先来简单思考一下，组件可以怎样去实现。 ```` 可以是一个 ```` 标签，to 是它的 props，然后绑定一个点击事件。 还记得 [编程式的导航](https://router.vuejs.org/zh/guide/essentials/navigation.html) 吗？在之前的源码中，我们也看到...
## 回顾 Router 调用构造函数时，保存了一个 ``match`` 属性。 ``` js constructor (options: RouterOptions = {}) { this.match = createMatcher(options.routes || []) // ... } ``` 然后在执行 transitionTo 时，就用到了这个属性（函数）。 ``` js transitionTo (location:...
## 前言 在看 HashHistory 和 HTML5History 的实现时，涉及到父类 ``History`` 与其 ``transitionTo`` 方法。 在路由发生跳转的时候，需要调用 ``transitionTo`` 方法，其中里面便实现了**导航守卫**。 ## History HashHistory 和 HTML5History 都是继承于 History。在调用它们构造函数的时候通过 super 也调用了 History 的构造函数，同时也用到了父类的一些方法，比如 listen 和 transitionTo。 主要来看构造函数 ``constructor``...
## 前言 前端的路由模式包括了 Hash 模式和 History 模式。 vue-router 在初始化的时候，会根据 ``mode`` 来判断使用不同的路由模式，从而 new 出了不同的对象实例。例如 history 模式就用 ``HTML5History``，hash 模式就用 ``HashHistory``。 ``` js init (app: any /* Vue component instance */) { this.app...