{"id":337,"date":"2011-03-11T00:03:25","date_gmt":"2011-03-11T06:03:25","guid":{"rendered":"http:\/\/bateru.com\/news\/?p=337"},"modified":"2011-03-11T00:07:54","modified_gmt":"2011-03-11T06:07:54","slug":"best-way-to-prevent-javascript-from-failing","status":"publish","type":"post","link":"https:\/\/bateru.com\/news\/2011\/03\/best-way-to-prevent-javascript-from-failing\/","title":{"rendered":"Best way to prevent Javascript from failing."},"content":{"rendered":"<p>Javascript is a great flexible language but has a major flaw with portability. I call it the &#8220;1 Hit Combo super punchy epic fail&#8221; error, aka Error Object. The Error object has 6 beautiful children that everyone hates to see. Their names are EvalError, RangeError, ReferenceError, SyntaxError, TypeError and URIError, and your task a good professional Frontend programmer is to prevent those 7 object from never stepping foot onto your website. So here are some simple tips to assist you in your struggle.<\/p>\n<p>\n<a href=\"http:\/\/www.funny-potato.com\/blog\/2008\/12\"><img decoding=\"async\" src=\"http:\/\/www.funny-potato.com\/blog\/wp-content\/uploads\/2008\/11\/error-message.jpg\"><\/a><br \/>\n<b>Solution 1:<\/b><br \/>\nFirst off, you should check your code to make sure that you&#8217;re not the one causing the errors message.<br \/>\nSo check your code with code analysis tools like <a href=\"http:\/\/www.jslint.com\" alt=\"jslint code analysis tool\">JSlint<\/a>, <a href=\"https:\/\/addons.mozilla.org\/en-us\/firefox\/addon\/console%C2%B2\/\">console<sup>2<\/sup><\/a> (a firefox addon ) or <a href=\"http:\/\/code.google.com\/closure\/compiler\/docs\/inspector.html\">Google&#8217;s Closure inspector<\/a>.\n<\/p>\n<\/p>\n<p><b>Solution 2:<\/b><br \/>\nIf possible you could also wrap your error prone code in try or catch blocks.<br \/>\nTry and Catch works as follow.<\/p>\n<p>Sends an error message to the browser and further Javascript from executing.<br \/>\n<code><\/p>\n<pre lang=\"javascript\" line=\"1\">\r\nvar obj = [];\r\nobj[0] = globalVar;    \/\/ERROR!\r\n<\/pre>\n<p><\/code><\/p>\n<p>Send the error message to the catch block and let&#8217;s the developer decide what to do.<br \/>\n<code><\/p>\n<pre lang=\"javascript\" line=\"1\">\r\ntry{\r\n    var obj = [];\r\n    obj[0] = globalVar;\r\n}\r\ncatch( err ){\r\n    alert( \"Error Message: \" + err.message ); \/\/You should log the error instead of alert it.\r\n}\r\n<\/pre>\n<p><\/code>\n<\/p>\n<p>\n<b>Solution 3:<\/b><br \/>\nFor a page that requires javascript, you can load that page with a <a href=\"http:\/\/www.w3schools.com\/tags\/tag_iframe.asp\" alt=\"w3schools.com iframe\">iframe<\/a>. With a iframe or frame, even if your main page halts due to an error, your javascript in your iframe will continue to run.<br \/>\n<code><\/p>\n<pre lang=\"html\" line=\"1\">\r\n<iframe loading=\"lazy\" src=\"javascript_page.html\" width=\"100%\" height=\"30\">\r\n  <p>Your browser does not support iframes.<\/p>\r\n<\/iframe>\r\n<\/pre>\n<p><\/code><\/p>\n<p>For something else that might help, check out <a href=\"http:\/\/thechangelog.com\/post\/3011202418\/adsafe-js-lint-powered-safe-javascript-widget-framework\">ADSAFE<\/a> (protection against 3rd party scripts).\n<\/p>\n<p>\n<b>References:<\/b><br \/>\n<a href=\"https:\/\/developer.mozilla.org\/en\/JavaScript\/Reference\/Global_Objects\/Error\">MDN Doc Center: Error<\/a><br \/>\n<a href=\"http:\/\/stackoverflow.com\/questions\/3320363\/is-it-possible-to-sandbox-arbitrary-javascript-to-only-operate-on-one-div-and\">Stackoverflow<\/a> : Is it possible to \u201csandbox\u201d arbitrary JavaScript to only operate on one div and not the whole document?\n<\/p>\n<p><iframe style=\"float:left\" src=\"http:\/\/rcm.amazon.com\/e\/cm?lt1=_blank&#038;bc1=FFFFFF&#038;IS2=1&#038;bg1=FFFFFF&#038;fc1=000000&#038;lc1=0000FF&#038;t=baterucom-20&#038;o=1&#038;p=8&#038;l=as1&#038;m=amazon&#038;f=ifr&#038;ref=tf_til&#038;asins=0596517742\" style=\"width:120px;height:240px;\" scrolling=\"no\" marginwidth=\"0\" marginheight=\"0\" frameborder=\"0\"><\/iframe><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Javascript is a great flexible language but has a major flaw with portability. I call it the &#8220;1 Hit Combo super punchy epic fail&#8221; error, aka Error Object. The Error object has 6 beautiful children that everyone hates to see. Their names are EvalError, RangeError, ReferenceError, SyntaxError, TypeError and URIError, and your task a good &hellip; <a href=\"https:\/\/bateru.com\/news\/2011\/03\/best-way-to-prevent-javascript-from-failing\/\" class=\"more-link\">Continue reading <span class=\"screen-reader-text\">Best way to prevent Javascript from failing.<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[11,10],"tags":[38,36,164,37,16],"class_list":["post-337","post","type-post","status-publish","format-standard","hentry","category-frontend-tech","category-tutorials","tag-error-messages","tag-error-object","tag-javascript","tag-prevent-errors","tag-tutorial"],"_links":{"self":[{"href":"https:\/\/bateru.com\/news\/wp-json\/wp\/v2\/posts\/337","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/bateru.com\/news\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/bateru.com\/news\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/bateru.com\/news\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/bateru.com\/news\/wp-json\/wp\/v2\/comments?post=337"}],"version-history":[{"count":15,"href":"https:\/\/bateru.com\/news\/wp-json\/wp\/v2\/posts\/337\/revisions"}],"predecessor-version":[{"id":352,"href":"https:\/\/bateru.com\/news\/wp-json\/wp\/v2\/posts\/337\/revisions\/352"}],"wp:attachment":[{"href":"https:\/\/bateru.com\/news\/wp-json\/wp\/v2\/media?parent=337"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/bateru.com\/news\/wp-json\/wp\/v2\/categories?post=337"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/bateru.com\/news\/wp-json\/wp\/v2\/tags?post=337"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}