简单的说下debug的思路
回复数(4) 浏览数(406)
Aleko 03月02日 19:10 最后回复来自: 青青 答疑
{{topic.upvote_count || 0}} 编辑 回复

今天一位同学在群里问

image.png
image.png

image.png
image.png

image.png
image.png

我以这个问题为例..讲讲最基本的debug思路. 以后同学们遇到问题可以先安装这个思路 自己debug一遍

  1. 发现报错 cannot read property 'classlist' of undefined
  2. 翻译 无法在undefined上读取classlist属性
  3. 报错旁边有个行号的.去到这个报错的地方
  4. 根据2 就是说 nodes[i] 是undefined
    image.png
    image.png

  5. 因为是在循环里 我不确定是哪个 nodes[i] 是undefined . 所以我直接在循环里,报错语句的上面 console.log(i, nodes[i])
    image.png
    image.png

  6. 得到报错之前输出了 0, undefined
  7. 发现第一次就报这个错误了,也就是说 我的nodes连0都没有被赋值
  8. nodes在哪里被赋值的, 发现是在上面的if的循环里
  9. 各种log看看进了哪个if语句 是否进入了循环
  10. 此题发现根本没有走循环
  11. 思考为什么不走循环
  12. 循环的终止条件,或者初始状态不对
  13. 初始状态 i = 0 , 那么终止的条件应该是 当 i < xxxx 为false时
  14. 发现 nodes.length
  15. nodes的length哪来的,看到上面定义的地方 并没有给 nodes.length 赋值 所以他是undefined 即 0 < undefined // false
  16. 故一次都没进入循环是符合逻辑的
  17. 那我为什么要用nodes.length
  18. 原来我写错了 应该是 temp

完~

{{topic.upvote_count || 0}}

今天一位同学在群里问

image.png
image.png

image.png
image.png

image.png
image.png

我以这个问题为例..讲讲最基本的debug思路. 以后同学们遇到问题可以先安装这个思路 自己debug一遍

  1. 发现报错 cannot read property 'classlist' of undefined
  2. 翻译 无法在undefined上读取classlist属性
  3. 报错旁边有个行号的.去到这个报错的地方
  4. 根据2 就是说 nodes[i] 是undefined
    image.png
    image.png

  5. 因为是在循环里 我不确定是哪个 nodes[i] 是undefined . 所以我直接在循环里,报错语句的上面 console.log(i, nodes[i])
    image.png
    image.png

  6. 得到报错之前输出了 0, undefined
  7. 发现第一次就报这个错误了,也就是说 我的nodes连0都没有被赋值
  8. nodes在哪里被赋值的, 发现是在上面的if的循环里
  9. 各种log看看进了哪个if语句 是否进入了循环
  10. 此题发现根本没有走循环
  11. 思考为什么不走循环
  12. 循环的终止条件,或者初始状态不对
  13. 初始状态 i = 0 , 那么终止的条件应该是 当 i < xxxx 为false时
  14. 发现 nodes.length
  15. nodes的length哪来的,看到上面定义的地方 并没有给 nodes.length 赋值 所以他是undefined 即 0 < undefined // false
  16. 故一次都没进入循环是符合逻辑的
  17. 那我为什么要用nodes.length
  18. 原来我写错了 应该是 temp

完~

406
回复 编辑