最近会陆续分享我在使用React的过程总结的一些比较高阶的使用方法，这些方法可以提升代码的可复用性，也让代码看起来更加简洁明晰。今天要讲的是Render Props，很多人可能都知道react的这个特性，但在实际项目中不知道如何用起来。刚好这两天的一个项目中用到了它，所以借机分享一下。

这两天被临时抽调到别的项目组去做一个小项目的迭代。这个项目前端是用React，只是个小型项目所以并没有使用Redux等状态管理的库。刚好遇到了一个小问题：两个不太相关的组件到底该怎么进行通信。我觉得这个问题还挺有趣的，所以把我的思考过程写下来，大家也可以一起讨论讨论。

上篇我们讲解了构造函数和原型等前端概念的原理，知道了实例之间如何通过构造函数的prototype来共享方法，下篇我们主要看下用es6的class怎么来实现，以及class的继承等。同上篇一样，重点在于背后的原理，只有懂得了为什么要这么设计，我们才能真正的说【精通】。

最近面试了很多前端同学，发现有不少同学的前端基础很薄弱，会使用react/vue等库或框架，但对一些前端最核心的概念，如原型，继承，作用域，事件循环等却掌握的模棱两可。所以很多时候你问深入点的问题，或者涉及到原理时，就支支吾吾答不出来。

你还在为该使用无状态组件（Function）还是有状态组件（Class）而烦恼吗？ ——拥有了hooks，你再也不需要写Class了，你的所有组件都将是Function。

这两天手头的一个任务是给一个五六年的老项目添加多语言。这个项目庞大且复杂，早期是用jQuery实现的，两年前引入Vue并逐渐用组件替换了之前的Mustache风格模板。要添加多语言，不可避免存在很多文本替换的工作，这么庞杂的一个项目，怎么才能使文本替换变得高效且不会引入bug是这篇文章主要要写的东西。

这时候产品经理开始加需求了，网页上展现五张猫咪图片，分别有自己的点赞次数，点击猫咪图片，相对应的点赞次数加一。这时候你想怎么改写自己的程序呢？你的程序现在看起来是否逻辑清楚，结构清晰，可拓展性强呢？

上集我们实现了首次渲染从JSX=>Hyperscript=>VDOM=>DOM的过程，今天我们来看一下当数据变动的时候怎么更新DOM，也就是下图的右半边部分。

从零开始手把手教你实现一个Virtual DOM（一）上一集我们介绍了什么是VDOM，为什么要用VDOM，以及我们要怎样来实现一个VDOM。我们再来看一下这张蓝图，今天我们要实现的是这张图的左半部分。

假如你的项目使用了React，你知道怎么做性能优化吗？你知道为什么React让你写shouldComponentUpdate或者React.PureComponent吗？你知道为什么React让你写Immutable Data Structures吗？你知道为什么React让你在渲染列表时，一定要给每个子项加一个key吗？你知道为什么React让你在条件渲染时，不写if而写&&操作符...

刚开始写前端的时候，处理异步请求经常用callback，简单又顺手。后来写着写着就抛弃了callback，开始用promise来处理异步问题。promise写起来确实更加优美，但由于缺乏对它内部结构的深刻认识，每次在遇到一些复杂的情况时，promise用起来总是不那么得心应手，debug也得搞半天。

对大部分人来说，掌握Vue.js基本的几个API后就已经能够正常地开发前端网站。但如果你想更加高效地使用Vue来开发，成为Vue.js大师，那下面我要传授的这五招你一定得认真学习一下了。

后来机缘巧合去做了一家互联网创业公司的HR，阅了上千份程序员的简历，面了上百个不同水平不同领域的程序员。跟程序员接触得越多，我越觉得编程是一件很有挑战、很有趣的事情。尤其是前端这一块，结识了好几位前端大牛。其中一位告诉我，如果你真的感兴趣，那就先去写几个HTML静态页面吧。

在 30分钟掌握ES6/ES2015核心内容（上）我们讲解了es6最常用的一些语法：let, const, class, extends, super, arrow functions, template string, destructuring, default, rest arguments

ECMAScript 6（以下简称ES6）是JavaScript语言的下一代标准。因为当前版本的ES6是在2015年发布的，所以又称ECMAScript 2015。