语言►JavaScript

JavaScript中的debugger语句

本文作者: jsweibo

本文链接: https://jsweibo.github.io/2020/08/02/JavaScript%E4%B8%AD%E7%9A%84debugger%E8%AF%AD%E5%8F%A5/

摘要

本文主要讲述了：

  1. 作用
  2. 反调试

正文

作用

打开控制台后，当程序执行到debugger语句时，脚本会暂停在这一行

注：

  1. 如果不打开控制台，即使程序执行到debugger语句，什么事也不会发生
  2. 打开控制台后，如果程序没有执行到debugger语句，什么事也不会发生

示例：打开控制台后，用户在页面中点击鼠标，脚本会暂停在debugger这一行

learn_js/index.html

1
2
3
4
5
6
7
8
9
10
11
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <script defer src="js/index.js"></script>
    <title>Document</title>
  </head>
  <body></body>
</html>

learn_js/js/index.js

1
2
3
4
5
window.addEventListener('click', function () {
  console.log('hello, world');
  debugger;
  console.log('hello, jsweibo');
});

反调试

示例：打开控制台后，脚本会不断地暂停在debugger这一行；但用户只要不打开控制台，什么事也不会发生

learn_js/index.html

1
2
3
4
5
6
7
8
9
10
11
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <script defer src="js/index.js"></script>
    <title>Document</title>
  </head>
  <body></body>
</html>

learn_js/js/index.js

1
2
3
setInterval(function () {
  debugger;
}, 1e3);

参考资料

本文作者: jsweibo

本文链接: https://jsweibo.github.io/2020/08/02/JavaScript%E4%B8%AD%E7%9A%84debugger%E8%AF%AD%E5%8F%A5/

本文对你有帮助？请支持我

支付宝
微信