如何学习别人的代码
如何学习别人的代码
佣兵0926 发表于2年前
如何学习别人的代码
  • 发表于 2年前
  • 阅读 391
  • 收藏 4
  • 点赞 0
  • 评论 0

标题:腾讯云 新注册用户域名抢购1元起>>>   

摘要: 看别人用代码实现一个牛逼的效果,自己也想有这种本事,代码已经开源,要怎么学呢?

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

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

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

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

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

共有 人打赏支持
粉丝 4
博文 56
码字总数 28941
×
佣兵0926
如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!
* 金额(元)
¥1 ¥5 ¥10 ¥20 其他金额
打赏人
留言
* 支付类型
微信扫码支付
打赏金额:
已支付成功
打赏金额: