控制台（Console） 在使用JavaScript做开发的时候，控制台非常有用。...当使用C, C++, Java开发的时候，我们可以使用终端(terminal)来debug，控制台拥有和终端相似的功能。 错误 控制台显示JavaScript错误。 ?...同时，也显示了错误在源代码中的位置。点击(index):150就可以跳转到源代码去。 ?...如果想查看变量的值，可以选中并把鼠标放在上面： ? 你可以敲击ESC键来快速打开控制台，再次敲击ESC，控制台消失。 ? 你可以手动在代码的某一行添加断点来暂停执行。...在第31行的左侧鼠标单击，会出现一个断点符号。 ? 库和压缩代码 有时候，为了debug，你可能需要查看库函数的源代码。但是，一般线上的代码都是经过压缩的，很难看懂。比如jQuery： ?
更快更高效地调试你的 JavaScript 了解你的工具在完成任务时有很重要的意义。 尽管 JavaScript 是出了名的难以调试，但是如果你掌握了一些小技巧，错误和 bug 解决起来就会快多了。..."debugger;" 除了 console.log， “debugger;” 是我最喜欢的临时应急调试工具。一旦它在你的代码中出现，Chrome 会自动地在执行到它所在位置时停下。...Chrome Inspector 会保存最后 5 个元素在其历史记录中，所以最后标记的元素可以用 $0 来显示，倒数第二个被标记的元素为 $1 ，以此类推。...不相关的黑盒脚本 我们经常会在我们的网页应用中用到一些库和框架。他们中大部分都经过良好的测试且相对来说错误较少。但是，调试器在执行调试任务时还是会进入这些不相关的文件。...如果代码中没有对这种情况进行处理，可能会导致 bug。 12. 在 console 中快速查询元素 在 console 中执行 querySelector 的一个更快的办法是使用 $ 符号。
Node.js 是一种流行的 JavaScript 运行时，与谷歌 Chrome 浏览器使用相同的 V8 引擎。它是跨平台的，在创建 Web 服务器、构建工具、命令行工具等方面越来越受欢迎。...但是，在我们编写代码并运行它之后，如果出现问题，事情就不会那么清楚了。如果幸运的话，你的代码可能会崩溃并显示一条明显的错误消息。如果你不走运，你的应用程序还是能运行的，但是最后的结果就不尽人意了。...语法错误 当你的代码没有遵循语言的规则时，就会导致错误。通常，它可能是语句拼写错误或缺少括号。...VS Code extension 会更容易，它会在你编码时验证代码： 逻辑错误 逻辑错误意味着你的代码可以正常运行但没有按预期工作。...在 Chrome 中设置条件断点 假设你有一个运行 1700 次迭代的循环，但你对最后一次的状态感兴趣： for (let i = 0; i < 1700; i++) { // set breakpoint
我们会告诉你什么原因导致了这些错误，以及如何防止这些错误发生。如果你能够避免落入这些 “陷阱”，你将会成为一个更好的开发者。...如果我们只查看每个错误发生的总次数，那么客户量大的的项目产生的错误可能会压倒其他错误，导致实际收集到的是与大多数读者无关的错误数据集。 以下是 JavaScript 错误 Top 10： ?...当你读取一个未定义的对象的属性或调用其方法时，这个错误会在 Chrome 中出现。 您可以很容易的在 Chrome 开发者控制台中进行测试（尝试）。 ?...TypeError: Cannot read property ‘length’ 这是 Chrome 中发生的错误，因为读取未定义变量的长度属性。 您可以在 Chrome 开发者控制台中进行测试。...尽管如此，即使有最佳实践，生产中也会出现意想不到的错误。能够查看影响用户的错误，并拥有快速解决问题的好工具，这一点非常重要。推荐 Rollbar。 觉得本文对你有帮助？请分享给更多人。
为了回馈我们的开发者社区，我们查看了数千个项目的数据库，发现了 JavaScript 中频度最高的 10 种错误。我们会告诉你什么原因导致了这些错误，以及如何防止这些错误发生。...如果我们只查看每个错误发生的总次数，那么客户量大的的项目产生的错误可能会压倒其他错误，导致实际收集到的是与大多数读者无关的错误数据集。...以下是 JavaScript 错误 Top 10： 为了便于阅读，我们将每个错误描述都缩短了。接下来，让我们深入到每一个错误，来确定什么会导致它，以及如何避免创建它。 1....当你读取一个未定义的对象的属性或调用其方法时，这个错误会在 Chrome 中出现。 您可以很容易的在 Chrome 开发者控制台中进行测试（尝试）。...您可以在 Chrome 开发者控制台中进行测试。 您通常会在数组中找到定义的长度，但是如果数组未初始化或者变量名称在另一个上下文中隐藏，则可能会遇到此错误。
查找未使用的 JavaScript Chrome 的 Coverage 面板可以让你能够快速找到 JavaScript 有没有被使用。...黑盒脚本 有时，你没必要确切地知道 JavaScript 错误是何时或在何处发生的。...输入一个表达式，例如 "The value of x is", x 每当执行该行代码时，消息就会出现在 DevTools 控制台中。logpoints 通常将在页面刷新之间保持不变。 10....停止无限循环 触发无限循环是程序里很常见的 bug，它可能导致浏览器崩溃。要在 Chrome DevTools 中停止无限循环，可以打开 Sources 面板，然后单击调试暂停图标以停止脚本。...在左侧窗口中打开 Overrides 选项卡，单击 + Select folder for overrides ，然后选择你创建的目录。系统将提示你允许文件在本地保存，并且目录将出现： ?
假如开发人员修改了 HTTP 重定向，而忘记修改 HTML 页面的重定向，那么二者就会不一致，最终结果或者出现无限循环，或者导致其他噩梦的发生。...在通用服务器中配置重定向 Apache 重定向可以在服务器的配置文件中设置，也可以在每一个文件目录的 .htaccess 文件中设置。...重定向死锁（循环） 当后续的重定向路径重复之前的路径的时候，重定向循环就产生了。换句话说，就是陷入了无限循环当中，不会有一个最终的页面返回。 大多数情况下，这属于服务器端错误。...假如你在修改了服务器配置不久就出现了这个问题，八成是遇到了重定向循环。 有时候，服务器端无法对其进行检测：重定向循环发生于多台服务器之间，对于每一台服务器来说，都无法获得一个全景图。...在这种情况下，浏览器会负责进行检测，然后返回错误信息。Firefox 会呈现如下信息： Firefox 检测到该服务器正在将指向此网址的请求无限循环重定向。
如： egret run -a -port 3333 -serverOnly 2.2 VSCode Chrome Debugger 在 Chrome 浏览器中，虽然我们可以直接通过 Sources 面板来对...所以，我们需要修改项目根目录的 tsconfig.json 文件，在 CompilerOptions 中加入 SourceMap 的配置。...在使用时，需要注意两个问题： Egret 虚拟画布节点通常不会自动刷新，需要手动点击“选中点击对象”后的刷新按钮来强制刷新； 控制台偶尔会报错 Uncaught TypeError: this.addChild...content-type 设置为 javascript，解决类型嗅探错误 /injectEgretApiDoc\\.js/ resType://js ` 我们运行 w2 add 命令后，将会在 Whistle...以上配置完成后，当你在 VSCode 中修改游戏代码时，egret run -a 进程会实时监听项目文件的变化，自动编译新的代码到项目的 bin-debug 目录。
Console（控制台面板）：在开发期间，可以使用控制台面板记录诊断信息，或者使用它作为 shell，在页面上与 JavaScript 交互。...Lighthouse（诊断面板）：对当前网页进行网络利用情况、网页性能方面的诊断，并给出一些优化 建议。 [02.png]（元素选择）：可以直接点击页面的元素，会自动跳转到对应的源代码。...[21.png]：不要在出现异常时暂停。 Breakpoints：可以看到已经埋下的断点。 Scope：可以看到当前局部或者全局变量的值，可对值进行修改。...，编写规则，遇到此 JS，就替换成我们本地经过修改过的 JS，替换后无限 debugger 就不存在了： [28.png] [29.png] 方法置空 直接在 Console 中将无限 debugger...也就是这个技术提供了一个入口，能够针对不同的消息或者 api 在执行前，先执行我的操作。“我的操作”就是钩子函数。在开发者工具中以 chrome 插件的方式，在匹配到关键词处插入断点。
代码编辑器具有以下元素（如图 1 所示）： JavaScript 代码编辑器 用于可视化地理空间数据集的地图显示 API 参考文档（文档选项卡） 基于Git的脚本管理器（脚本选项卡） 控制台输出（控制台选项卡...JavaScript 编辑器 JavaScript 编辑器将： 键入时格式化并突出显示代码 在有问题的代码下划线，提供修复和其他提示以获得正确的语法 自动补全引号、方括号和圆括号对 为地球引擎功能提供代码完成提示...例如，图显示了在Inspector选项卡中单击地图的结果 。光标位置和缩放级别与像素值和地图上的对象列表一起显示。对象列表是交互式的。要查看更多信息，请展开检查器选项卡中的对象。...Inspector 选项卡显示有关光标位置和光标下层值的信息。 控制台选项卡 当您print()从脚本中获取某些内容时，例如文本、对象或图表，结果将显示在Console 中。...当前内存 此列仅在由于脚本使用过多内存而出现错误时出现。它显示发生错误时任何单个计算节点上正在使用的内存量。 峰值内存 任何单个计算节点上用于该操作的最大内存。
如果出现(HTTP/1.1 500) 错误，请仔细检查 chdir，module，socket，wsgi-file 这几项配置是否正确！...#open_file_cache指令中的inactive参数时间内文件的最少使用次数 open_file_cache_min_uses 2; #指定是否在搜索一个文件是记录cache错误...jquery-3.3.1.min.js 将jquery-3.3.1.min.js放到js目录 修改django相关文件 修改urls.py，增加路径userInfo vim /www/mysite1...--告诉IE使用最新的引擎渲染网页，chrome=1则可以激活Chrome Frame--> <title
，a对象的引用数为0，两个对象都可以被回收了 引用计数的一个缺点就是可能会出现循环引用的情况。...而y中的a属性又引用了x。 从而导致循环引用的情况，最终导致内存泄露。 在实际的应用中，IE6 和IE7 对DOM对象使用的就是引用计数的垃圾回收算法，所以可能会出现内存泄露的情况。...最后垃圾回收器会找到所有的可达的对象和不可达的对象。 使用不可达来标记不再被使用的对象可以有效的解决引用计数法中出现的循环引用的问题。...在chrome中输入chrome://inspect： 我们可看到chrome inspect的界面，如果你本地已经有开启inspect的nodejs程序的话，在Remote Target中就可以直接看到...这样最终导致循环引用，造成内存泄露。 怎么解决这个问题呢？
，a对象的引用数为0，两个对象都可以被回收了 引用计数的一个缺点就是可能会出现循环引用的情况。...而y中的a属性又引用了x。 从而导致循环引用的情况，最终导致内存泄露。 在实际的应用中，IE6 和IE7 对DOM对象使用的就是引用计数的垃圾回收算法，所以可能会出现内存泄露的情况。...最后垃圾回收器会找到所有的可达的对象和不可达的对象。 使用不可达来标记不再被使用的对象可以有效的解决引用计数法中出现的循环引用的问题。...这样最终导致循环引用，造成内存泄露。 怎么解决这个问题呢？...一个简单的办法就是在使用完obj之后，将其赋值为null，从而中断循环引用的关系： document.write
但是这样有一个问题，我需要用鼠标copy时，会带有减号。复制之后，就是一个错误的数据！！！...默认json格式化的数据中，key是没有带双引号的，我需要默认勾选它，因此要修改js代码。 二、修改插件代码 基于上面的2点需求，下载jq22.com 提供的插件后，解压代码。...创建静态目录 在项目根目录创建 static 文件夹，在static 文件夹里面，创建 plugins 文件夹。 将上面修改好的插件，复制到此目录。...将index.html中的 http引用资源，下载到本地 wget http://www.jq22.com/jquery/bootstrap-3.3.4.css wget http://www.jq22...另外我提供了一个demo，更换bootstrap版本，去除了多余的静态文件。 github地址如下： https://github.com/py3study/json_view_demo
2 React 就开源许可证风波进行回复 数周前，Apache 基金会决定禁止旗下项目使用 React，因为其在标准的 BSD 许可证之外添加了专利声明；此举引发了社区的广泛讨论，希望 React 能够更新其开源许可证...3 Bootstrap 4 Beta 发布： 经过两年的开发，Bootstrap 4 Beta 版本终于发布；该版本中值得注意的变化包括，从 Less 迁移到了 Sass、布局系统几乎全部迁移到了 Flexbox...、优化了卡片的使用体验、自定义了 Normalize.css、放弃了对于 IE8 与 IE9 的支持、复写了几乎所有的 JavaScript 插件、提升了 Tooltip 等使用体验等。...4 Node.js 8.4.0 发布： 本周 Node.js 8.4.0 版本发布，其重要的特性变化包括，引入内建的 http2 实验支持、允许在 inspector 控制台中查看 require()、...8 Google Puppeteer加入到headless Chrome的工具行列 Chrome DevTools团队发布了Puppeteer，一个基于Node API的headless Chrome工具
: ", details); }, {urls: [""]} ); 连接错误事件： 你可以通过监听 chrome.webRequest.onErrorOccurred...注意，修改CSP策略应谨慎处理，因为过于宽松的CSP策略可能会带来安全风险。...更多关于CSP的信息，可以参考 Chrome 插件开发官方文档 。 深入了解Chrome API 在开发Chrome插件时，我们会频繁地使用Chrome API。...在发布和更新插件时，需要确保插件的完整性、安全性，并遵守Chrome Web Store的规定和政策。 插件的版本管理与错误处理 在插件的开发和维护过程中，版本管理和错误处理是非常重要的。...可以使用try...catch语句来捕获并处理可能出现的错误，以及使用console.error()方法将错误信息输出到控制台。
代码（浏览器控制台Console）： text='javascript is more fun than java or javabeans!'...5.如果需要对示例中的组件进行修改，就在自定义的属性后面加上：！...Django实现用户登录： 1.创建app名为cmdb（自定义随便起） 2.将medb名加入settings中的INSTALLED_APPS列表中 3.在urls文件中引入app...'),) #千万不要忘了加, 10.访问127.0.0.1:8000来到登录界面，点提交时会报403错误 11.将settings文件中的MIDDLEWARE内的第四行暂时注释掉，就不会有...403错误了 12.用户验证： 将views代码修改为： from django.shortcuts import render,redirect # Create your
在占用内存与程序执行速度间取得平衡 使用rrdtool查看heap堆大小的变化情况 最开始我使用node-inspector查看node进程的heap内存占用情况。...port=5858，在chrome的开发者工具里可以对node进程Heap进行dump。 但发现使用node-inspector每次抓取heap快照时会引起GC。...在我的场景里本身就是一个死循环，不停有promise对象加入到这个串里，最终导致进程OOM退出。...--trace_gc_verbose之类的参数，但在控制台上看到的数字不太直观，也可采用生成rrd文件的方式，改明我也写一下npm库，供大家更直观的查看NodeJS的GC状况。...抽空要再看看rrdtool的文档 参考 https://blog.eood.cn/node-js_gc https://developer.chrome.com/devtools/docs/javascript-memory-profiling
File: deno/runtime/inspector_server.rs 在Deno项目的源代码中，deno/runtime/inspector_server.rs文件的作用是实现了一个用于与Chrome...InspectorInfo是一个结构体，它代表一个连接到调试器服务器的Inspector实例。每个Inspector实例都表示一次与Chrome开发者工具的通信会话。...它接收来自Chrome开发者工具的请求，解析这些请求，并将它们发送给相应的Inspector实例进行处理。...同时，InspectorServer负责维护所有已连接的Inspector实例的状态，并将相应的响应返回给Chrome开发者工具。...bootstrap()函数是Deno运行时的入口点，它负责初始化运行时环境，并加载和执行指定的JavaScript文件。
越来越多的前端开发人员喜欢在Chrome里开发调试代码，Chrome有许多优秀的插件可以帮助前端开发人员极大的提高工作效率。...YSlow YSlow可以分析网页，并为改善网页性能提出修改建议，这些功能基于高性能网页的规则集。YSlow可以根据预定义的三个规则集或用户自定义规则集来对网页进行分级。...JavaScript Errors Notifier 安装该扩展后，会在Chrome地址栏中以图标形式提示JavaScript错误，因为Chrome默认只有打开console才会显示错误。...如果是在Chrome的控制台里的资源选项里查看代码则推荐使用Chrome自带的"pretty print"功能，也就是点击"{ }"图标。...IE Tab 在Chrome中打开IE浏览器标签页，你可以打开一个标签来运行Internet Explorer，让你看到的网页在IE浏览器看起来如何。
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
即时通信 IM
ICP备案
对象存储
实时音视频
