一周前端文章推荐（2019/09/22）
给 「前端开发博客」 加星标，每天打卡学习
长按二维码即可识别“进入网页”查看哟~
1、用 JS 写游戏自动脚本是什么体验？
我是从写游戏脚本入的编程这行 今天翻看老照片，翻到了下面这张：故事要从 2012 年说起，那时候我大二，梦想是去迪信通卖手机，业余爱好是捣鼓手机，就是刷系统，美化主题，逛论坛啊这些，也加了一些奇奇怪怪的 QQ 群。某天下午，看到群里有人说：“有会写自动脚本的吗？求合作，一起搞 DNF！” DNF...
https://zhuanlan.zhihu.com/p/82350262
2、从promise到asycn/await
在MDN中，定义promise的只有一句话：promise对象用于表示一个异步操作的最终完成（或失败），及其结果值。从这句话的定义我们可以抓住几个关键词：promise是对象、异步操作、最终状态及结果值。在真正了解promise是什么前，我们不得不思考，promise的出现究竟是为了解决什么问题。背景 javascript是单线程语言：...
https://juejin.im/post/5d7de1cc6fb9a06af471f1a7
3、【面试高频知识点】promise的理解（通俗易懂）
前一段时间找工作，面试了大大小小十几家公司，其中也包含了腾讯、blue等知名公司。总结面试经历，发现自己还有很多不足的地方，许多知识点都知其然不知其所以然。趁着最近事比较少，会陆陆续续总结一些面试的高频知识点，提升自己知识的深度和广度。本文是系列文章之一：promise的理解。一、何为promise，我们为何要...
https://juejin.im/post/5d42970bf265da03c34bdb95
4、TypeScript 疑难杂症
本文会定期更新，我遇到的觉得值得分享的 TypeScript 问题都会优先更新在 TypeScript 疑难杂症 里 ------- 别光顾着收藏，给孩子赏几个赞吧！------- 限制传入对象必须包含某些字段 用于给某个处理特定对象的函数来限制传入参数，尤其是当对象的某些字段是可选项的时候，比如说：test函数接受的参数...
https://zhuanlan.zhihu.com/p/82459341
5、前端经典面试题(60道前端面试题包含JS、CSS、React、网络、浏览器、程序题等)
(以下所有答案仅供参考) 简答题 1、什么是防抖和节流？有什么区别？如何实现？参考答案 防抖 触发高频事件后n秒内函数只会执行一次，如果n秒内高频事件再次被触发，则重新计算时间 思路：每次触发事件时都取消...
https://segmentfault.com/a/1190000020391424
6、Vue自定义防抖指令
最近项目中经常出现由于用户多次点击导致的问题，防抖/节流使用的很多，因此，想通过vue自定义指令的方式来实现。后面有需要使用防抖的地方只要使用改指令即可。原代码 复制代码 sayHello() { console.log('Hello!') } 复制代码 我想达到的...
https://juejin.im/post/5d790255f265da03c34c284e
7、vue-router的原理
前端三大框架Vue,React,Angular,他们都是单页面应用开发的，所以利用路由的跳转非常有必要的，vue-router,react-router,angular-router都是基于前端路由原理进行封装实现的，所以我们使用起来非常方便，只会使用还不行，刚上手的小白，给他随便说两句就会使用路由， 但是我们也需要了解路由的原理，知己知彼，才能百战百...
https://juejin.im/post/5d7e3fe5e51d4561d044cd74
8、基于vueCli2发布一个vue组件的npm包
这篇文章主要记录了从零发布一个vue的npm包（包含一个简单的指令和一个vue组件）的实践过程及些许心得。初始化项目 这里我们通过@vue/cli拉取简单配置的模板来初始化一个2.X的项目，不了解的同学可以看下 vueCli3官方文档 vue init webpack-simple vue-directive-kit 初始化的项目目录如下 ├── REA...
https://segmentfault.com/a/1190000020406048
9、探索如何使用 JSON.stringify() 去序列化一个 Error
最近在做 Node 服务端需求的时候，遇到了几次服务端报错的问题。打 log 发现均是一些 Error，但是它们都没法很好地透传给前端浏览器，出现问题只能查看服务端机器的日志，调试起来非常不方便。思考了一下，服务端...
https://segmentfault.com/a/1190000020422195
10、用 JavaScript 实现一个简单的状态机
使用状态机可以构建健壮的 UI，其好处已有详细的描述—— 例如你可以参见Edward J. Pring 的文章和 David Khourshid 的视频。另外Krasimir Tsonev 描述了 JavaScript 中状态机的一些常用方法。一些比较流行的 Java...
https://segmentfault.com/a/1190000020395145
11、如何优雅的使用javascript递归画一棵结构树
递归和尾递归 简单的说，递归就是函数自己调用自己，它做为一种算法在程序设计语言中广泛应用。其核心思想是把一个大型复杂的问题层层转化为一个与原问题相似的规模较小的问题来求解。一般来说，递归需要有边界条件、递归前进阶段和递归返回阶段。当边界条件不满足时，递归前进；当边界条件满足时，递归返回。但是...
https://juejin.im/post/5d7f2ddde51d4561ba48fe8c
12、HTTP请求之gzip压缩知多少
什么是gzip压缩，gzip压缩是基于deflate中的算法进行压缩的，gzip会产生自己的数据格式，gzip压缩对于所需要压缩的文件，首先使用LZ77算法进行压缩，再对得到的结果进行huffman编码，根据实际情况判断是要用动态h...
https://segmentfault.com/a/1190000020386580
13、【2019/09/18】前端面试
1）设计理念上的区别：Vue使用的是可变数据，而React更强调数据的不可变。所以应该说没有好坏之分，Vue更加简单，而React构建大型应用的时候更加棒 2）数据流的不同：Vue2.x 已经不鼓励组件对自己的 props 进行任何修改了。所以现在我们只有 组件 <--> DOM 之间的双向绑定这一种。React 从...
https://juejin.im/post/5d823dc0e51d4561f777e274
14、webpack4知识点总结归纳
webpack 是一个现代JavaScript 应用程序的静态模块打包器(module bundler)，webpack4是webpack当前最新的主版本。当 webpack 处理应用程序时，它会递归地构建一个依赖关系图(dependency graph)，其中包含应用程序需要的每个模块，然后将所有这些模块打包成一个或多个 bundle。。在我们做vue的项目时，对webpack一定不陌...
https://www.leixuesong.com/3574
15、学习至今的css，我掌握了什么？
常见写法：translateX（
https://segmentfault.com/a/1190000020425407
16、每日优鲜供应链前端团队微前端改造
我所在团队是做toB业务的，技术栈是Vue，团队目前有十多个典型的toB业务（菜单+内容布局），这些业务都是服务于一个大平台的，因为历史原因，每个业务都是独立的，都有一个html入口，所以当用户在这个大平台上使用这十多个业务的时候，每当切换系统时，页面都会刷新，体验很差；在开发层面，这十多个业务又有太多共同之...
https://juejin.im/post/5d7f702ce51d4561f777e258
17、浅析Vue编译原理
在上一篇里，我们主要聊了下Vue数据绑定简析，明白了其观察者模式的基本原理。我们知道在观察者中有一种属于 渲染函数观察者 ( vm._watcher )，通过对渲染函数的求值计算来触发依赖收集，进而进行响应式的数据绑定，但是对于渲染函数如何编译，我们知之甚少。这一篇我们将从 template 编译 AST 语法树， 再 generate 转...
https://juejin.im/post/5cd7bdfd51882548ff0aa3d4
18、理解vue-router中(router-link router-view $router $route)实现原理
关于 vue-router 实现原理的问题是非常重要的，并且经常会在面试中提问 本章简单讲解一下 vue-router 中 router-link 、 router-view 、 $router 、 $route 的实现原理 里面的注释可能会有点多，但是还是本着 走一步测一步 的原则，慢慢看，慢慢来 路由模式 说到前端路由，不得不说路由的两种模式：...
https://juejin.im/post/5d7e2f43f265da0391354593
19、透过现象看本质: 常见的前端架构风格和案例
所谓软件架构风格，是指描述某个特定应用领域中系统组织方式的惯用模式。架构风格定义一个词汇表和一组约束，词汇表中包含一些组件及连接器，约束则指出系统如何将构建和连接器组合起来。软件架构风格反映了领域中众多系统所共有的结构和语义特性，并指导如何将系统中的各个模块和子系统有机的结合为一个完整的系统 ...
https://juejin.im/post/5d7ffad551882545ff173083
20、用 js 写卡牌游戏（四）
前言 又过了三个月，咳咳咳…… 这次我决定录一个视频，如果不想看文字的朋友，可以翻到最下面看视频，内容和文字差不多。正文 首先来做攻击效果，也就是卡牌冲过去，再回来。这属于动画效果，我这里就不造轮子了，直接找一个现成的好用点的动画库，这里我...
https://www.xiejingyang.com/2019/09/16/js-write-card-game-4/
21、前端开发日报存档
看得不过瘾，网站有过去几年的每日前端好文章日报存档，关注收藏起来不迷路。
http://caibaojian.com/c/news
22、掘金小册全网八折
热门前端掘金小册，全网八折：前端面试之道、Vue组件精讲、使用WebPack定制前端开发环境、重学前端（极客时间）、前端开发核心知识（GitChat）等，阅读原文浏览全网教程！
http://caibaojian.com/goods
加入微信群????，每日分享全网好文章！
