js调试系列源代码定位与调试【基础】

我们先来处理第一个问题：1。通过在文章的底部推荐这个函数来检查被调用函数的源代码实际上非常简单。只需点击放大镜选择推荐即可。

votePost(cb_entryId，' Digg ')是推荐按钮调用的函数，是不是很简单？

其次，定位函数的文件位置。其实也很简单。当然，不熟悉控制台的朋友可能不知道怎么看。我在控制台中键入votePost，然后按回车键。。

源代码比较粗糙，右下角有一个链接blog-common.js。v=we8o 1 xrgctu 07 qvvwyqerqd 7 aa 8 fdjp _ dgoe-crat 3k 133601这是什么意思？下面的v=we8o 1 xrgctu 07 qvvwyqerqd 7 aa 8 fdjp _ dgoe-crat 3k 1可以直接忽略。

如果你想知道这是什么，ps:其实是一个版本号。至于它的功能，往往是防止缓存。自己在网上搜索。这就是blog-common.js:1的意思。Blog-common.js是这个函数所在的js文件。1是代码所在的行号。

直接单击此链接，您可以跳转到“来源”面板。这是源码面板，是调试最重要的功能，后面会介绍。

但是所有的代码都在一行。我们怎么想？446个字符，全部在一行。Chrome为我们提供了代码格式化功能。单击下面的漂亮打印按钮来格式化代码。

格式化后，它是一个非常漂亮的代码。至于你能不能看懂，那就是另一回事了。有些人不理解。可能代码已经被UglifyJS、Google的Closure等工具编译过了，比如jquery.min.js文件。也有可能是水平太低，暂时看不懂大神写的代码，没办法。你只能振作起来，努力提高自己的实力。如果格式化后找不到函数的位置，不用担心。我在这里。你在恐慌什么？回到刚才的控制台面板。

你很高兴找到那个blog-common.js？v=we8o 1 xrgctu 07 qvvwyqerqd 7 aa 8 fdjp _ dgoe-crat 3k 1336091行号已更改为91。现在，如果你再次点击这个链接，你可以跳转到相应的格式化位置。超级方便吗？

最后一个问题，修改函数使其无效，是最简单的，比刚才简单多了，但是很多人不会操作，我就拿出来说一下。首先我们知道这个函数调用的推荐函数是votePost(cb_entryId，' Digg ')，在html中是直接写的或者onclick绑定的。所以这个函数是一个全局函数，可以到处调用。这是什么意思？这意味着我们可以修改它，就像一个全局变量一样。你可以在任何地方修改它，对吗？全球功能也应该如此。所以我们可以直接把它修改成一个空函数。votePost=function(){ }；或者votePost=$。noop不管怎样？$.noop是jQuery提供的一个空函数，方便我们使用。

VotePost现在是一个空函数，所以如果你点击推荐按钮，什么都不会发生。当然，刷新页面后，会再次生效。我们只是调试和修改页面。不改变博客公园的源代码，是不可能永久生效的。因此，调试意味着发现和消除错误的过程。如果找到了错误源，修改后再测试；如果不正确，刷新后再修改，这样就不需要修改实际文件，导致不可恢复。

今天就到这里。其实现在很少有直接的全局函数供你调试，因为现在流行jQuery，而且绑定了click等各种事件，导致源代码定位繁琐。好的，我之前写过一篇文章，详细分析了这个问题。详见《浅谈 jQuery 事件源码定位问题》。我对其他框架不熟悉，所以没有分析。但是思路其实是相似的，总会有一个事件管理机制。

今天知识点不多，但要自己巩固，不然几秒钟就忘了。

课后练习：1。分析votePost函数如何实现推荐。2.votePost的动态调试和分析。(结合断点知识)

明天我们会讲到断点和动态调试，但是我还没有找到合适的话题，所以先凑合着做吧。如果有适合需要动态调试的东西，请贴出来。