github.com/hpoenixf

背景

之前我分享了文章大厂前端面试考什么?,你们一定很想看答案吧？说实话，答案我是有，在准备面试的时候会时不时翻看，但内容比较多，比较凌乱，不能指望我在一篇文章中写完。

我是从非计算机专业自学前端的，到现在（2018年4月）有两年半的时间。中间经历了不少迷茫，技术也止步不前，怀疑自己可能只是一辈子这样写写页面。然而在最近的面试中通过学习和思考，找到了前进的方向，也得到一些大公司(BATJ中的两家)的录用机会。算是从初级前端毕业，进阶了吧。

我打算写一系列文章来进行解答面试中碰到的问题以及自己觉得需要补充和遗漏的地方，该系列文章适用于有一年以上前端开发经验的同学，不会讲太基础的东西。希望可以帮助大家走出迷茫，提升技术水平。

之前面试的过程中，一个比较让我在意的评价是知识较全面但深度不够。希望这次写的文章可以深入一点，跟大家一起成长。系列的范围比较广，同时还希望有深度，因此更新的速度不会太快。在这里先写个目录。

赶时间的同学可以按照我的目录中的关键词先自行准备提升，希望推荐文章和交流。欢迎关注和 star 本博客或是关注我的 github

背景

最近需要使用react技术栈，需要掌握react，redux和redux-saga，然而我只是简单的写过react。刷了几遍文档还是一头雾水，决定写过小demo练手加深下印象。

就不详细介绍上面的技术了，简单来说redux就是管理状态的，但是对于异步的处理不是很完善，这里就需要用到redux-saga了。redux-saga的异步处理用到了生成器和迭代器的相关知识，不熟悉的同学可以了解下我之前的文章

这次的demo打算写一个输入框，输入拼音会返回对应的城市列表。并尽可能多的使用redux-saga的特性

任务队列

js是单线程的，因为js可以操作DOM，如果多线程的话，会造成冲突的问题。

js的任务分为同步任务和异步任务。同步任务是指在主线程上依次执行的任务，形成一个执行栈。而异步任务不在主线程，在任务队列中，如网络请求，定时器等。在执行栈的任务执行完毕之后，系统会检查任务队列，看是否有可以执行的异步任务。-

而任务队列分为两种，一种是mircotask，另一种是marcotask。按照我的理解，mircotask和marcotask的区别在于mircotask的任务可以在本次循环/页面刷新前被加入到任务队列，而marcotask不可以

迭代器

什么是迭代器

js迭代器是一个对象，具有next方法，可以返回序列中的带有done和value两个属性的下一项。

1
2
3
4
5
6
7
8
9
10
11

function makeIterator(array){
    var nextIndex = 0;4
    return {
       next: function(){
           return nextIndex < array.length ?
               {value: array[nextIndex++], done: false} :
               {done: true};
       }
    };
}

什么是promise

promise是es6的一个重要特性，用于实现异步。promise对象拥有一个叫做状态的属性，该属性不受外界影响，修改后不能再次变化。而Promise是一个构造函数，可以生成promise对象。
常见用法是

1
2
3
4
5
6
7
8
9
10
11
12

var a = new Promise(function (res, rej) {
  console.log('1')
  if (1) {
    res(3)
  } else {
    rej()
  }
})
a.then(function (val) {
  console.log(val)
})
console.log(2)

面向对象有三个特点，一个个来说

封装

私有变量

利用闭包实现对象的私有变量。

1
2
3
4
5
6
7
8
9
10

function Animal (age) {
  this.getAge = function () {
    return age
  }
}
var dog = new Animal(3)
console.log(dog.age) // undefined
console.log(dog.getAge()) // 3

前端除了JS,HTML,CSS三板斧，还要懂些什么？有什么东西对我们提升自己前端水平有帮助？

技术社区

分享一些我常会访问的技术社区

1. 掘金,很活跃的技术社区

2. 博客园, 不少大牛

3. segmentfault.com,类似startoverflow的问答社区，也有不少专栏文章
4. cnode，关于nodejs的
5. medium，不少外文优质技术文章

工具网站

1. mdn
2. caniuse

书籍

看完入门类的书籍应该对js有些基础的了解，可以上手干活了。

入门类

1. js DOM编程艺术
2. js 高级程序设计
3. js 编程艺术
4. effective js

前端很容易碰到瓶颈和迷茫，看下下面的书可能有帮助。

提升类

1. HTTP权威指南，还不了解网站从url到网页的过程吗？
2. webkit技术内幕，不了解一下浏览器？
3. 深入浅出nodejs，几年前的书，仍然经典
4. 编译器设计，造轮子必看
5. 你不了解的js，深入了解js
6. 算法，这年头不懂快排不好找工作…

最后

本文章会持续更新，希望大家也可以推荐一下自己常去的社区和觉得有帮助的书籍

本文章为前端进阶系列的一部分,
欢迎关注和star本博客或是关注我的github