{"id":4391,"date":"2018-06-20T21:22:22","date_gmt":"2018-06-20T19:22:22","guid":{"rendered":"https:\/\/monodes.com\/predaelli\/?p=4391"},"modified":"2018-06-20T10:22:30","modified_gmt":"2018-06-20T08:22:30","slug":"how-you-can-improve-your-workflow-using-the-javascript-console","status":"publish","type":"post","link":"https:\/\/monodes.com\/predaelli\/2018\/06\/20\/how-you-can-improve-your-workflow-using-the-javascript-console\/","title":{"rendered":"How you can improve your workflow using the JavaScript console"},"content":{"rendered":"<p>&nbsp;<\/p>\n<blockquote><p>As a web developer, you know very well the need to debug your code. We often use external libraries for logs, and to format and\/or display\u2026<\/p><\/blockquote>\n<p><em><a href=\"https:\/\/medium.freecodecamp.org\/how-you-can-improve-your-workflow-using-the-javascript-console-bdd7823a9472\">How you can improve your workflow using the JavaScript console<\/a><\/em><\/p>\n<p>Please meet:<\/p>\n<ul>\n<li><code class=\"\" data-line=\"\">console.group()<\/code> (or <code class=\"\" data-line=\"\">console.groupCollapsed()<\/code> if we want it to be closed by default). Then add a <code class=\"\" data-line=\"\">console.groupEnd()<\/code><\/li>\n<li>The <code class=\"\" data-line=\"\">console.table<\/code> allows us to visualize these structures inside a beautiful table where we can name the columns and pass them as parameters.<\/li>\n<li>\n<h4 id=\"76e2\" class=\"graf graf--h4 graf-after--figure\">Console.count, Console.time and Console.timeEnd<\/h4>\n<p id=\"dd1f\" class=\"graf graf--p graf-after--h4\">These three methods are the Swiss army knife for every developer who needs to debug. The <code class=\"\" data-line=\"\">console.count<\/code> counts and outputs the number of times that <code class=\"\" data-line=\"\">count()<\/code> has been invoked on the same line and with the same label. The <code class=\"\" data-line=\"\">console.time<\/code> starts a timer with a name specified as an input parameter, and can run up to 10,000 simultaneous timers on a given page. Once initiated, we use a call to <code class=\"\" data-line=\"\">console.timeEnd<\/code> to stop the timer and print the elapsed time to the Console.<\/p>\n<\/li>\n<\/ul>\n<p><a href=\"https:\/\/medium.freecodecamp.org\/how-you-can-improve-your-workflow-using-the-javascript-console-bdd7823a9472\"><img data-recalc-dims=\"1\" decoding=\"async\" class=\"alignnone size-full\" src=\"https:\/\/i0.wp.com\/cdn-images-1.medium.com\/max\/1000\/1%2AtSxjLeSthR0iv_R4Ka04UQ.png?w=910&#038;ssl=1\" alt=\"\" \/><\/a><\/p>\n<p><a href=\"https:\/\/medium.freecodecamp.org\/how-you-can-improve-your-workflow-using-the-javascript-console-bdd7823a9472\"><img data-recalc-dims=\"1\" decoding=\"async\" class=\"alignnone size-full\" src=\"https:\/\/i0.wp.com\/cdn-images-1.medium.com\/max\/1000\/1%2A3tF9gd8GOnW7YKZzRPNNEQ.png?w=910&#038;ssl=1\" alt=\"\" \/><\/a><a href=\"https:\/\/medium.freecodecamp.org\/how-you-can-improve-your-workflow-using-the-javascript-console-bdd7823a9472\"><img data-recalc-dims=\"1\" decoding=\"async\" class=\"alignnone size-full\" src=\"https:\/\/i0.wp.com\/cdn-images-1.medium.com\/max\/1600\/1%2AtSxjLeSthR0iv_R4Ka04UQ.png?w=910&#038;ssl=1\" alt=\"\" \/><\/a><a href=\"https:\/\/medium.freecodecamp.org\/how-you-can-improve-your-workflow-using-the-javascript-console-bdd7823a9472\"><img data-recalc-dims=\"1\" decoding=\"async\" class=\"alignnone size-full\" src=\"https:\/\/i0.wp.com\/cdn-images-1.medium.com\/max\/1000\/1%2A-AzaAptxE9n4D9BaLKLsGA.png?w=910&#038;ssl=1\" alt=\"\" \/><\/a><a href=\"https:\/\/medium.freecodecamp.org\/how-you-can-improve-your-workflow-using-the-javascript-console-bdd7823a9472\"><img data-recalc-dims=\"1\" decoding=\"async\" class=\"alignnone size-full\" src=\"https:\/\/i0.wp.com\/cdn-images-1.medium.com\/max\/800\/1%2AFc8jI1oaCE57aB-baawGaw.png?w=910&#038;ssl=1\" alt=\"\" \/><\/a><a href=\"https:\/\/medium.freecodecamp.org\/how-you-can-improve-your-workflow-using-the-javascript-console-bdd7823a9472\"><img data-recalc-dims=\"1\" decoding=\"async\" class=\"alignnone size-full\" src=\"https:\/\/i0.wp.com\/cdn-images-1.medium.com\/max\/800\/1%2AFb2VQtATz3uCH2hw6yVB-w.png?w=910&#038;ssl=1\" alt=\"\" \/><\/a><a href=\"https:\/\/medium.freecodecamp.org\/how-you-can-improve-your-workflow-using-the-javascript-console-bdd7823a9472\"><img data-recalc-dims=\"1\" decoding=\"async\" class=\"alignnone size-full\" src=\"https:\/\/i0.wp.com\/cdn-images-1.medium.com\/max\/1000\/1%2ASjJUsOqXMHJVpa_N9RIDyw.png?w=910&#038;ssl=1\" alt=\"\" \/><\/a><a href=\"https:\/\/medium.freecodecamp.org\/how-you-can-improve-your-workflow-using-the-javascript-console-bdd7823a9472\"><img data-recalc-dims=\"1\" decoding=\"async\" class=\"alignnone size-full\" src=\"https:\/\/i0.wp.com\/cdn-images-1.medium.com\/max\/800\/1%2AoeGhwHWJ0JALyKZMJq_inw.png?w=910&#038;ssl=1\" alt=\"\" \/><\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p class=\"excerpt\">&nbsp; As a web developer, you know very well the need to debug your code. We often use external libraries for logs, and to format and\/or display\u2026 How you can improve your workflow using the JavaScript console Please meet: console.group() (or console.groupCollapsed() if we want it to be closed by default). Then add a console.groupEnd()&hellip;<\/p>\n<p class=\"more-link-p\"><a class=\"more-link\" href=\"https:\/\/monodes.com\/predaelli\/2018\/06\/20\/how-you-can-improve-your-workflow-using-the-javascript-console\/\">Read more &rarr;<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"inline_featured_image":false,"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"activitypub_content_warning":"","activitypub_content_visibility":"","activitypub_max_image_attachments":4,"activitypub_interaction_policy_quote":"anyone","activitypub_status":"","footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2}},"categories":[72,50],"tags":[],"class_list":["post-4391","post","type-post","status-publish","format-standard","hentry","category-documentations","category-javascript"],"jetpack_publicize_connections":[],"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/p6daft-18P","jetpack-related-posts":[{"id":8312,"url":"https:\/\/monodes.com\/predaelli\/2021\/04\/01\/looking-glass\/","url_meta":{"origin":4391,"position":0},"title":"Looking glass","author":"Paolo Redaelli","date":"2021-04-01","format":false,"excerpt":"I've been using Gnome Shell for a long time but I never heard of Looking Glass! Looking Glass is GNOME Shell's integrated inspector tool and JavaScript console useful for debugging. It can be run by typing 'lg' in the Alt+F2 prompt and can then be exited by pressing Esc. More\u2026","rel":"","context":"In &quot;Gnome&quot;","block_context":{"text":"Gnome","link":"https:\/\/monodes.com\/predaelli\/category\/gnome\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":4327,"url":"https:\/\/monodes.com\/predaelli\/2018\/05\/17\/top-10-javascript-errors-from-1000-projects-and-how-to-avoid-them\/","url_meta":{"origin":4391,"position":1},"title":"Top 10 JavaScript errors from 1000+ projects (and how to avoid them)","author":"Paolo Redaelli","date":"2018-05-17","format":false,"excerpt":"From Top 10 JavaScript errors from 1000+ projects (and how to avoid them) Most of them are caught at compile time by strongly-typed languages. Who said Eiffel? Oh, how I want not to be so busy with other issues.... :( To give back to our community of developers, we looked\u2026","rel":"","context":"In &quot;Eiffel&quot;","block_context":{"text":"Eiffel","link":"https:\/\/monodes.com\/predaelli\/category\/eiffel\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":5536,"url":"https:\/\/monodes.com\/predaelli\/2019\/05\/01\/inspecting-one-of-the-most-famous-javascript-bugs-of-all-time\/","url_meta":{"origin":4391,"position":2},"title":"Inspecting one of the most famous JavaScript bugs of all time","author":"Paolo Redaelli","date":"2019-05-01","format":"link","excerpt":"One fine day evening, after writing a handful of beautiful JavaScript code, sipping your coffee, you smile\u200a\u2014\u200athe code looks especially\u2026 After reading Inspecting one of the most famous JavaScript bugs of all time one may wonder how such flaws does not \"explode\" in the face of every developer, subtle as\u2026","rel":"","context":"In &quot;Javascript&quot;","block_context":{"text":"Javascript","link":"https:\/\/monodes.com\/predaelli\/category\/javascript\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":5254,"url":"https:\/\/monodes.com\/predaelli\/2019\/02\/17\/learn-pure-functions-with-javascript-cristi-salcescu-medium\/","url_meta":{"origin":4391,"position":3},"title":"Learn pure functions with JavaScript \u2013 Cristi Salcescu \u2013 Medium","author":"Paolo Redaelli","date":"2019-02-17","format":"link","excerpt":"Pure functions are easier to read, understand, test, debug and munch more. Source: Learn pure functions with JavaScript \u2013 Cristi Salcescu \u2013 Medium Learn pure functions with JavaScript Cristi Salcescu Feb 10 Photo by Ren\u00e9 Reichelt on\u00a0Unsplash Pure functions are easier to read, understand, test, debug and munch more. You\u2026","rel":"","context":"In &quot;Documentations&quot;","block_context":{"text":"Documentations","link":"https:\/\/monodes.com\/predaelli\/category\/documentations\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":3971,"url":"https:\/\/monodes.com\/predaelli\/2018\/04\/01\/sheer-pure-evil\/","url_meta":{"origin":4391,"position":4},"title":"Sheer, pure evil","author":"Paolo Redaelli","date":"2018-04-01","format":false,"excerpt":"JavaScript: Can (a==1 && a==2 && a==3) ever evaluate to true?\u00a0Yes, it can. Understand how in this article! That's pure sheer evil, in my humble opinion as it tricks most people. Eiffel forbids this evilness, but I shall explain it better. Recently, an interesting code snippet has been making the\u2026","rel":"","context":"In &quot;Documentations&quot;","block_context":{"text":"Documentations","link":"https:\/\/monodes.com\/predaelli\/category\/documentations\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":8386,"url":"https:\/\/monodes.com\/predaelli\/2021\/04\/25\/your-source-code-is-public-if-you-dont-know-this-simple-trick-by-shoaib-mehedi-dev-genius-apr-2021-medium\/","url_meta":{"origin":4391,"position":5},"title":"Your source code is public if you don\u2019t know this simple trick. | by Shoaib Mehedi | Dev Genius | Apr, 2021 | Medium","author":"Paolo Redaelli","date":"2021-04-25","format":false,"excerpt":"Please read \u00abYour source code is public if you don\u2019t know this simple trick.\u00bb\u00a0 by Shoaib Mehedi. Read it carefully. Then please someone may feel the urge to explain the concept of \"Software Libero\" to Shoaib Mehedi. Please tell him that obfuscating javascript is not a solution for his needs,\u2026","rel":"","context":"In &quot;Ethics&quot;","block_context":{"text":"Ethics","link":"https:\/\/monodes.com\/predaelli\/category\/ethics\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]}],"jetpack_likes_enabled":true,"_links":{"self":[{"href":"https:\/\/monodes.com\/predaelli\/wp-json\/wp\/v2\/posts\/4391","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/monodes.com\/predaelli\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/monodes.com\/predaelli\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/monodes.com\/predaelli\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/monodes.com\/predaelli\/wp-json\/wp\/v2\/comments?post=4391"}],"version-history":[{"count":0,"href":"https:\/\/monodes.com\/predaelli\/wp-json\/wp\/v2\/posts\/4391\/revisions"}],"wp:attachment":[{"href":"https:\/\/monodes.com\/predaelli\/wp-json\/wp\/v2\/media?parent=4391"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/monodes.com\/predaelli\/wp-json\/wp\/v2\/categories?post=4391"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/monodes.com\/predaelli\/wp-json\/wp\/v2\/tags?post=4391"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}