• JavaScript 56 JavaScript 调试

    JavaScript

    文章目录

    56 JavaScript 调试

    错误总会发生，每当您写一些新的计算机代码时。

    56.1 JavaScript 调试

    在没有调试器的情况下写 JavaScript 是有难度的。

    您的代码中也许包含了语法错误，或者逻辑错误，这些都难以诊断。

    通常，如果 JavaScript 代码包含错误，也不会发生任何事情。不会有错误消息，并且不会有任何可供查找错误的指示信息。

    通常，每当你尝试编写新的 JavaScript 代码，就可能发生错误。

    56.2 JavaScript 调试器

    查找编程代码中的错误被称为代码调试。

    调试并不简单。但幸运地是，所有现代浏览器都有内置的调试器。

    内置的调试器可打开或关闭，强制将错误报告给用户。

    通过调试器，您也可以设置断点（代码执行被中断的位置），并在代码执行时检查变量。

    通常通过 F12 键启动浏览器中的调试器，然后在调试器菜单中选择“控制台”。

    56.3 console.log() 方法

    可以使用 console.log() 在调试窗口中显示 JavaScript 的值：

    在这里插入图片描述

    56.4 设置断点

    在调试窗口中，您可在 JavaScript 代码中设置断点。

    在每个断点中，JavaScript 将停止执行，以使您能够检查 JavaScript 的值。

    在检查值之后，您可以恢复代码执行。

    DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JS 调试title>
head>
<body>

<script>
    a = 5;
    b = 6;
    c = a + b;
    console.log(c);
script>

body>
html>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17

    在这里插入图片描述

    添加断点

    在这里插入图片描述

    56.5 debugger 关键词

    debugger 关键词会停止 JavaScript 的执行，并调用（如果有）调试函数。

    这与在调试器中设置断点的功能是一样的。

    如果调试器不可用，debugger 语句没有效果。

    如果调试器已打开，此代码会在执行第三行之前停止运行。

    var x = 15 * 5;
debugger;
document.getElementbyId("demo").innerHTML = x; 

    • 1
    • 2
    • 3

    在这里插入图片描述

    这个好用

    56.6 主流浏览器的调试工具

    通常，在浏览器中通过 F12 键启用调试，并在调试器菜单中选择“控制台”。

    否则请按照以下步骤：

    56.6.1 Chrome
    • 打开浏览器
    • 从菜单中选择工具
    • 从工具中选择开发者工具
    • 最后，选择控制台
    56.6.2 Firefox Firebug
    • 打开浏览器
    • 前往网页：http://www.getfirebug.com
    • 根据如下指令：如何安装 Firebug
    56.6.3 Internet Explorer
    • 打开浏览器
    • 从菜单选择工具
    • 从工具选择开发者工具
    • 最后，选择控制台
    56.6.4 Opera
    • 打开浏览器
    • 请前往网页：http://dev.opera.com
    • 根据如下指令：如何安装 Firebug Lite
    56.6.5 Safari Develop Menu
    • 点击 Safari 菜单，偏好设置，高级
    • 选中“在菜单栏中启用开发菜单”
    • 当菜单中出现新选项“开发”时，选择“显示错误控制台”

    调试是测试、找到并减少计算机程序中 bug（错误）的过程。

    历史上首个已知的计算机 bug 是一只卡在电子器件中的真实的虫子（一种昆虫）。

  • 相关阅读:
    读懂：“消费报销”模式新零售打法，适用连锁门店加盟的营销方案
    halcon脚本-机器学习【OCR】【附源码】
    OpenSSF安全计划：SBOM将驱动软件供应链安全
    in(...) 可能会让你排查Bug到崩溃,哈哈哈
    vue环境搭建
    java 字节流向文件中写入指定内容
    抖音账号矩阵系统开发源码----技术研发
    kafka的java客户端-生产者
    docker 部署redis报错内存分配过度
    C++数据类型范围
  • 原文地址：https://blog.csdn.net/weixin_44226181/article/details/127645056