如何学习别人的代码

学习的时候通常会遇到如下阻力：

1、代码量巨大，代码气场首先就把人吓退了！

2、各种没有使用过的，或者很少使用的，生疏的js方法，又是一个下马威！

3、各种代码书写技巧！

判断语句不用if else，用逻辑运算符，闭包不用

(function(){
//......
})()

用

!function

+function

4、各种健壮性判断

5、浏览器兼容性处理

6、为方便扩展或使用，使用了一些规范和模式，比如模块化、面向对象方法等

这些阻力，每一个单独让一个入门者去应对，其实都不是多难的事。

但是当他们一起向一个初级水平的人袭来时，往往给人积极性的打击是较大的。

最重要的是，这些阻力容易埋没一个牛逼交互的核心原理，

一个牛逼交互的核心原理往往与这些实际细节无关

一个交互如果没有真正掌握原理就非常容易忘，就容易出了bug无处找原因。所以，学习他人优秀代码时，要注意有意识忽略那些阻力，因为那些阻力其实不是真正的核心和难点

具体做法就是，参考源码，用自己的代码实现一次交互，在具体书写过程中完全不考虑那些问题，不管任何规范，只要能看到效果，怎么方便怎么来。关注代码的目的，而不是实现细节

举个例子：

源码获取一个dom，可能会专门写一个方法，形如：

//获取ID
var $ = function (id) {return typeof id === "string" ? document.getElementById(id) : id};

//获取tagName
var $$ = function (tagName, oParent) {return (oParent || document).getElementsByTagName(tagName)};

事实上，如果被操作dom有绑定id，你在js中是可以直接就用的，不用再单独去写方法获取，比如html是这样：

<div id="box">...</div>

在js中就可以直接用起：

box.innerHTML = 'xxoo';

你的目的是获取dom元素，那么你只要能获取到就行，用最简单粗暴的方法，不去考虑其他，因为这不是你的重点和目标，你的目标是整个插件的原理，不要让代码细节阻碍你

实现的代码可能会非常粗陋不堪，甚至只能在你的指定浏览器的指定版本里正常显示，但是它会更突出原理，突出你要学习的重点

掌握了原理，剩下那些问题，都是你可以各个击破，逐步迭代去优化的，都是百度可以轻易找到解决方法的

强调一下：这里所说的方法，是学习方法，不是工作方法和生产方法，实际工作中，一定要尽量规范，考虑全面，否则一定焦头烂额