{"id":10,"date":"2006-12-09T00:57:00","date_gmt":"2006-12-08T23:57:00","guid":{"rendered":"http:\/\/www.tapper-ware.net\/blog\/?p=10"},"modified":"2010-07-11T12:03:18","modified_gmt":"2010-07-11T10:03:18","slug":"a-few-words-about-javascript","status":"publish","type":"post","link":"https:\/\/www.tapper-ware.net\/blog\/a-few-words-about-javascript\/","title":{"rendered":"A few words about Javascript"},"content":{"rendered":"<p>I&#8217;m a bit of a Javascript fan and since I don&#8217;t have anything better to do right now I though I could tell you about a few typical errors that even the guys over at Google, along with 99% of all pages I know, make.<\/p>\n<p>The problem is that people learn Javascript as well, a Script language, not a proper programming language&#8230; which is a shame because Javascript itself is probably one of the most comfortable languages I know. And because they don&#8217;t see it as a proper programming language they just hack their code until it works&#8230; for now.<\/p>\n<p>The worst abomination onto JS is probably browser sniffing: It&#8217;s a pretty simple technique that&#8217;s easy to understand which is probably why beginners tend to use it, however it&#8217;s also a technique that a) requires a lot of testing, b) requires a lot of updates and c) goes completely bonkers when new browsers are released.<\/p>\n<p>What browser sniffing (a.k.a. useragant sniffing) does is &#8220;ask&#8221; the browser about itself and then taking appropriate measures. Seems simple, right?<\/p>\n<p>Well if it is so simple, then what would happen if you ask a browser if it is a &#8220;Mozilla&#8221;&#8230; Surprise! Pretty much all major browsers (including Internet Explorer) claim to be Mozilla. So let&#8217;s ask about MSIE to make sure which Mozillas are actually Internet Explorer. Oops, Opera and a few others report that too. OK, then how about finding out which ones are really Mozilla by looking for &#8220;Gecko&#8221;. Oh, Safari says it&#8217;s &#8220;like Gecko&#8221;. If you want an almost complete list, have a a look <a href=\"http:\/\/www.zytrax.com\/tech\/web\/browser_ids.htm\">here<\/a>.<\/p>\n<p>You see: it doesn&#8217;t work and it&#8217;s really a shame that people still use this first-grader technique if there&#8217;s a much easier alternative: Method sniffing.<\/p>\n<p>In Javascript, every function or method that does not exist has the value &#8220;undefined&#8221;. So if you want to use something that you are afraid isn&#8217;t available everywhere, you just ask if the browser supports it directly, instead of asking for the browser and then assuming that a certain browser supports this or that.<\/p>\n<p>For example, lets say we want to use the addEventListener method and as a fallback the attachEvent method, then we simply create a wrapper function:<\/p>\n<p><span style=\"font-size:85%;\"><span style=\"font-family: courier new; font-weight: bold;\">function wrapperAddEventListener(obj,type,callback){<\/span><br \/>\n<span style=\"font-family: courier new; font-weight: bold;\">   if(obj.addEventListener!=undefined) obj.addEventListener(type,callback,false);<\/span><br \/>\n<span style=\"font-family: courier new; font-weight: bold;\">   else if(obj.attachEvent!=undefined) obj.attachEvent(&#8220;on&#8221;+type,callback);<\/span><br \/>\n<span style=\"font-family: courier new; font-weight: bold;\">   else alert(&#8220;Sorry, your browser is not supported&#8221;);<\/span><br \/>\n<span style=\"font-family: courier new; font-weight: bold;\">}<\/span><\/span><\/p>\n<p>And that&#8217;s it. And it works for pretty much everything, except for some strange HTML behaviours. Now my minions: Spread the word.<\/p>\n<p>The next time I&#8217;ll be looking at the scope of Variables in JS&#8230; a topic that isn&#8217;t understood by more than a handfull of people, eventhough it&#8217;s not <span style=\"font-style: italic;\">that<\/span>  difficult. See you next time.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>I&#8217;m a bit of a Javascript fan and since I don&#8217;t have anything better to do right now I though I could tell you about a few typical errors that even the guys over at Google, along with 99% of all pages I know, make. The problem is that people learn Javascript as well, a &hellip; <a href=\"https:\/\/www.tapper-ware.net\/blog\/a-few-words-about-javascript\/\" class=\"more-link\">Continue reading <span class=\"screen-reader-text\">A few words about Javascript<\/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":[1],"tags":[],"_links":{"self":[{"href":"https:\/\/www.tapper-ware.net\/blog\/wp-json\/wp\/v2\/posts\/10"}],"collection":[{"href":"https:\/\/www.tapper-ware.net\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.tapper-ware.net\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.tapper-ware.net\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.tapper-ware.net\/blog\/wp-json\/wp\/v2\/comments?post=10"}],"version-history":[{"count":2,"href":"https:\/\/www.tapper-ware.net\/blog\/wp-json\/wp\/v2\/posts\/10\/revisions"}],"predecessor-version":[{"id":151,"href":"https:\/\/www.tapper-ware.net\/blog\/wp-json\/wp\/v2\/posts\/10\/revisions\/151"}],"wp:attachment":[{"href":"https:\/\/www.tapper-ware.net\/blog\/wp-json\/wp\/v2\/media?parent=10"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.tapper-ware.net\/blog\/wp-json\/wp\/v2\/categories?post=10"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.tapper-ware.net\/blog\/wp-json\/wp\/v2\/tags?post=10"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}