# 如何学编程，JUST DO IT！

- 作者：积木
- 发布时间：2013-03-29 08:19
- 分类：公司
- 原文：https://www.ifanr.com/269922

[![Talent](https://s3.ifanr.com/wp-content/uploads/2013/03/Talent.jpg)](http://www.ifanr.com/269922/talent)

在不知道什么是回调函数之前，Michelle Bu 做出了自己的第一个网页。她在[个人博客](http://blog.michellebu.com/2013/03/21-nested-callbacks/)分享了这段有趣的经历。

Michelle 有一个笔记本上涂鸦的习惯。某次夏季旅行中，她画了一系列的三角形，觉得很酷。然后，她决定做成网页，或许能够让自己在 Tumblr 上显得很酷。

她开始向学习计算机的朋友求教。他们的建议可以总结为一句话 : “去 Google 它”。当她说找不到答案的时候，朋友说去 Google “CSS triangle”。

“抱歉……CSS 和三角形有啥关系？”

谈话通常会突然结束，或者是“CSS 简单的说，就是你给 HTML 设定风格”。

每次谈话都让她感到自己很无能。不过，她还是发现了用 div 和一些 CSS 代码做出三角形的方法。最初的代码是这样的：

[![21 nested callbacks&#95;1](https://s3.ifanr.com/wp-content/uploads/2013/03/21-nested-callbacks_1.jpg)](http://www.ifanr.com/269922/21-nested-callbacks_1)

这样的代码还要持续 165 行。

然后，她了解到有个叫 jQuery 的东西，能够使用名为“Animate”的 API 来改变三角形的属性。比如，如果使用 $(‘#something’).animate({ ‘opacity’: ‘0’ })，就能使某个三角形消失。她想到的是，如果想要 20 行三角形接连消失的话，需要 20 行一样的代码。

于是，她把 jQuery 中的代码贴到了自己的 JavaScript 文件里。后来的代码成了这个样子：

[![21 nested callbacks&#95;2](https://s3.ifanr.com/wp-content/uploads/2013/03/21-nested-callbacks_2.jpg)](http://www.ifanr.com/269922/21-nested-callbacks_2)

她很高兴的发现，代码发挥了作用，三角形按照设想消失和再现。她把代码给一个真正的软件工程师看。出乎预料的是，工程师没有讽刺，“没有程序员会做出这种事情”。然后，这位工程师说，“没有人会写出这样的代码，因为他们不会有这样的耐心”。

这逐渐成为了一个愚蠢的破冰话题，“hey，你花了两个小时解决 CoffeeScript 中的空格问题么？看看我，花了一天的时间， 写了 21 层函数和 200 行一模一样的 HTML 代码。”

如今，Michelle 要从伯克利大学毕业了，恐怕也不会再去写什么代码。不过，她觉得自己从这件事情中领悟到一个道理。

> 编程是困难的。不要因为你不如身边的人擅长‘Google 它’而感到难过。永远不要让参加黑客马拉松的势利眼阻止你为猫做 Twtter或者做公厕 Yelp。即使是最傻的主意（比如试图去做个可以消失和再现的几何动画）也能提升你的编程能力。学习编程更多是学会去学习——而学习的最好方法是‘做’。
> 
> 到最后，要做一个合格的程序员，不仅仅是你赢了多少场黑客马拉松，或者你想出了多少新花样，而是执行力、关注细节、不妥协的专注，以及构建和破坏的激情。
> 
> 如果你对自己的代码感到害羞，我同意你去嘲笑一下我做三角形时的 21 层回调函数。

题图来自：[wired](http://www.google.com.hk/imgres?imgurl=http://cdni.wired.co.uk/620x413/s_v/Talent.jpg&imgrefurl=http://www.wired.co.uk/news/silicon-europe%3Fpage%3D9&usg=__k3wJEPSwv3u7li4JODO2twwW1pk=&h=413&w=620&sz=44&hl=zh-CN&start=1&zoom=1&tbnid=hwY-5vvbwruBgM:&tbnh=178&tbnw=276&ei=Q91UUajeNsWk0AXe-IC4BQ&prev=/search%3Fq%3Dlearn%2Bto%2Bcode%26hl%3Dzh-CN%26newwindow%3D1%26safe%3Dstrict%26biw%3D1228%26bih%3D432%26tbs%3Dsimg:CAQSEglvHymI3SwTaCGk3dgltKAfiQ%26tbm%3Disch&itbs=1&iact=rc&dur=1319&page=1&ved=1t:429,r:0,s:0&tx=173&ty=67)
