任务 3 已经发布，初级班的任务时间是从 5 月 7 日至 5 月 18 日，中级班为 4 月 30 日至 5 月 10 日。
TASK 0003 内容：https://github.com/baidu-ife/ife/tree/master/task/task0003
我做的：https://github.com/DIYgod/ife-work/tree/master/task0003
在线 Demo： https://www.anotherhome.net/file/ife/task0003/
本次任务累计花费时间 10 天（5.6-5.16 ）
下面是我做 TASK 0003 过程中的一些记录。
1. JavaScript 作用域 （参考 鸟哥：Javascript 作用域原理 理解 JavaScript 作用域和作用域链）
JavaScript 中的函数运行在它们被定义的作用域里，而不是它们被执行的作用域里。
JS 是有预编译的过程的，JS 在执行每一段 JS 代码之前，都会首先处理 var 关键字和 function 定义式 (函数定义式和函数表达式)。
在调用函数执行之前，会首先创建一个活动对象，然后搜寻这个函数中的局部变量定义，和函数定义，将变量名和函数名都做为这个活动对象的同名属性，对于局部变量定义，变量的值会在真正执行的时候才计算，此时只是简单的赋为 undefined。
对代码优化的启示：
从作用域链的结构可以看出，在运行期上下文的作用域链中，标识符所在的位置越深，读写速度就会越慢。因为全局变量总是存在于运行期上下文作用域链的最末端，因此在标识符解析的时候，查找全局变量是最慢的。所以，在编写代码的时候应尽量少使用全局变量，尽可能使用局部变量。一个好的经验法则是：如果一个跨作用域的对象被引用了一次以上，则先把它存储到局部变量里再使用。
例如下面的代码：
这个函数引用了两次全局变量 document，查找该变量必须遍历整个作用域链，直到最后在全局对象中才能找到。这段代码可以重写如下：
这段代码比较简单，重写后不会显示出巨大的性能提升，但是如果程序中有大量的全局变量被从反复访问，那么重写后的代码性能会有显著改善。
2. 高度自适应 （参考 CSS 布局奇淫技巧之 - 高度自适应）
高度自适应不像宽度自适应那样简单，在兼容浏览器方面也稍微复杂一些。
然而直接写 height: 100%; 并没有什么卵用，要这样做：
3. 莫名其妙出现又莫名其妙自己消失的空隙
事情是这样的，昨天（5 月 12 日）页面一切正常，今天早上起床后并没改动代码，刷新了一下页面，页面居然变了，设置 overflow: scroll CSS 属性的元素右侧和下侧都出现了空隙，如图所示：
而如果把 overflow: scroll 属性去掉空隙就消失。测试 Chrome Safari 均出现了这种情况，而且尝试了清空缓存，无解。于是将此时的代码 commit 并 push 到了 github。
到了下午，同一标签页，同一页面，刷新，bug 自己消失了，而此时代码与上午相比只有很少且无关紧要的改动，再次 commit 并 push 到 github（所有改动在 github 有记录），再次截图：
注意：两次出现变化后都尝试测试了 Chrome 和 Safari 浏览器并清空了缓存。
到此为止毫无头绪并无法重现，实在没办法再深究下去。
猜测是 Mac 的 Bug。
4. JavaScript 对象与 JSON 文本的相互转换 （参考 JavaScript 对象与 JSON 字符串的相互转换 JSON 教程 - W3CSCHOOL）
eval 函数：JSON 文本转换为 JavaScript 对象；调用 JavaScript 编辑器；非常快速，但可能会出现安全性问题
使用 JSON 解析器：
JSON.parse 函数：将 JSON 文本转换为 JavaScript 对象
JSON.stringify 函数：将 JavaScript 对象转换为 JSON 文本
5. textarea 和 input 大小比预期大了一些
多谢李胜的帮助
这个问题其实很简单但我没想到，刚开始挺莫名其妙的，如下：
See the Pen RPaJpb by DIYgod (@DIYgod) on CodePen.
问题是 textarea 和 input 比设置的宽度多了 6px，强迫症看了浑身难受。实际上是因为这两个元素有默认的 2px padding 和 1px border，在这两个元素的 CSS 部分加上
或者更优雅一些
就好了。
☆ﾐ(o*･ω･)ﾉ完结散花 等待 review