+ JavaScript is a language often mocked for its quirky behaviors, like how 3 + '3' equals '33' or how 0.1 + 0.2 doesn't quite equal 0.3. Th..."><meta name="twitter:card" content="summary"><meta name="twitter:creator" content="@AustinJS"><title>JavaScript's Quirks: Understanding the 'Why' Behind the 'What'•Austin JavaScript</title><link rel="alternate" type="application/atom+xml" href="https://austinjavascript.com/feed.xml" title="Austin JavaScript Atom feed"><link rel="stylesheet" href="/assets/css/main.css"></head><body><svg display="none"><g id="logo-github"><path d="M256,32C132.3,32,32,134.9,32,261.7c0,101.5,64.2,187.5,153.2,217.9a17.56,17.56,0,0,0,3.8.4c8.3,0,11.5-6.1,11.5-11.4,0-5.5-.2-19.9-.3-39.1a102.4,102.4,0,0,1-22.6,2.7c-43.1,0-52.9-33.5-52.9-33.5-10.2-26.5-24.9-33.6-24.9-33.6-19.5-13.7-.1-14.1,1.4-14.1h.1c22.5,2,34.3,23.8,34.3,23.8,11.2,19.6,26.2,25.1,39.6,25.1a63,63,0,0,0,25.6-6c2-14.8,7.8-24.9,14.2-30.7-49.7-5.8-102-25.5-102-113.5,0-25.1,8.7-45.6,23-61.6-2.3-5.8-10-29.2,2.2-60.8a18.64,18.64,0,0,1,5-.5c8.1,0,26.4,3.1,56.6,24.1a208.21,208.21,0,0,1,112.2,0c30.2-21,48.5-24.1,56.6-24.1a18.64,18.64,0,0,1,5,.5c12.2,31.6,4.5,55,2.2,60.8,14.3,16.1,23,36.6,23,61.6,0,88.2-52.4,107.6-102.3,113.3,8,7.1,15.2,21.1,15.2,42.5,0,30.7-.3,55.5-.3,63,0,5.4,3.1,11.5,11.4,11.5a19.35,19.35,0,0,0,4-.4C415.9,449.2,480,363.1,480,261.7,480,134.9,379.7,32,256,32Z"/></g><g id="logo-slack"><path d="M126.12,315.1A47.06,47.06,0,1,1,79.06,268h47.06Z"/><path d="M149.84,315.1a47.06,47.06,0,0,1,94.12,0V432.94a47.06,47.06,0,1,1-94.12,0Z"/><path d="M196.9,126.12A47.06,47.06,0,1,1,244,79.06v47.06Z"/><path d="M196.9,149.84a47.06,47.06,0,0,1,0,94.12H79.06a47.06,47.06,0,0,1,0-94.12Z"/><path d="M385.88,196.9A47.06,47.06,0,1,1,432.94,244H385.88Z"/><path d="M362.16,196.9a47.06,47.06,0,0,1-94.12,0V79.06a47.06,47.06,0,1,1,94.12,0Z"/><path d="M315.1,385.88A47.06,47.06,0,1,1,268,432.94V385.88Z"/><path d="M315.1,362.16a47.06,47.06,0,0,1,0-94.12H432.94a47.06,47.06,0,1,1,0,94.12Z"/></g><g id="logo-twitter"><path d="M496,109.5a201.8,201.8,0,0,1-56.55,15.3,97.51,97.51,0,0,0,43.33-53.6,197.74,197.74,0,0,1-62.56,23.5A99.14,99.14,0,0,0,348.31,64c-54.42,0-98.46,43.4-98.46,96.9a93.21,93.21,0,0,0,2.54,22.1,280.7,280.7,0,0,1-203-101.3A95.69,95.69,0,0,0,36,130.4C36,164,53.53,193.7,80,211.1A97.5,97.5,0,0,1,35.22,199v1.2c0,47,34,86.1,79,95a100.76,100.76,0,0,1-25.94,3.4,94.38,94.38,0,0,1-18.51-1.8c12.51,38.5,48.92,66.5,92.05,67.3A199.59,199.59,0,0,1,39.5,405.6,203,203,0,0,1,16,404.2,278.68,278.68,0,0,0,166.74,448c181.36,0,280.44-147.7,280.44-275.8,0-4.2-.11-8.4-.31-12.5A198.48,198.48,0,0,0,496,109.5Z"/></g></svg><header class="page-header hero"><div class="hero-body is-primary is-paddingless"><div class="container"><div class="navbar" role="navigation" aria-label="main navigation"><div class="navbar-brand"><figure class="image is-96x96 logo"><img src="/assets/icon/logo.svg" alt="logo"></figure><a href="/" class="navbar-item title has-text-white is-size-1-tablet">Austin JavaScript</a></div><div class="navbar-menu is-size-4"><div class="navbar-end"><a class="navbar-item" href="/">Home </a><a class="navbar-item" href="/posts/meetups/">Meetups</a></div></div></div></div></div></header><main class="page-main section has-background-white"><div class="container"><div class="columns is-variable is-8-desktop"><div class="column is-two-thirds flex-container"><h1 class="title flex-item">JavaScript's Quirks: Understanding the 'Why' Behind the 'What'</h1><div class="content flex-item"><p>JavaScript is a language often mocked for its quirky behaviors, like how 3 + '3' equals '33' or how 0.1 + 0.2 doesn't quite equal 0.3. These peculiarities can be confusing and frustrating, especially for beginners. However, most of these behaviors aren't random or senseless—they stem from historical decisions, compromises, and attempts to handle various use cases. In this talk, we'll explore some of JavaScript's most notorious quirks, exploring their reasoning. We'll cover topics like type coercion, truthy/falsy values, equality comparisons, variable scope and hoisting, the typeof operator, and prototypal inheritance. If you understand the 'why' behind the 'what,' you will be better equipped to write clean, predictable JavaScript code and avoid common pitfalls. Whether you're a JavaScript beginner or an experienced developer, you'll walk away with valuable insights into the language's inner workings.</p></div><div class="message flex-item flex-item-0"><svg display="none"><g id="alarm"><path d="M153.59,110.46A21.41,21.41,0,0,0,152.48,79h0A62.67,62.67,0,0,0,112,64l-3.27.09-.48,0C74.4,66.15,48,95.55,48.07,131c0,19,8,29.06,14.32,37.11a20.61,20.61,0,0,0,14.7,7.8c.26,0,.7.05,2,.05a19.06,19.06,0,0,0,13.75-5.89Z"/><path d="M403.79,64.11l-3.27-.1H400a62.67,62.67,0,0,0-40.52,15,21.41,21.41,0,0,0-1.11,31.44l60.77,59.65A19.06,19.06,0,0,0,432.93,176c1.28,0,1.72,0,2-.05a20.61,20.61,0,0,0,14.69-7.8c6.36-8.05,14.28-18.08,14.32-37.11C464,95.55,437.6,66.15,403.79,64.11Z"/><path d="M256.07,96c-97,0-176,78.95-176,176a175.23,175.23,0,0,0,40.81,112.56L84.76,420.69a16,16,0,1,0,22.63,22.62l36.12-36.12a175.63,175.63,0,0,0,225.12,0l36.13,36.12a16,16,0,1,0,22.63-22.62l-36.13-36.13A175.17,175.17,0,0,0,432.07,272C432.07,175,353.12,96,256.07,96Zm16,176a16,16,0,0,1-16,16h-80a16,16,0,0,1,0-32h64V160a16,16,0,0,1,32,0Z"/></g><g id="calendar"><path d="M416,64H400V48.45c0-8.61-6.62-16-15.23-16.43A16,16,0,0,0,368,48V64H144V48.45c0-8.61-6.62-16-15.23-16.43A16,16,0,0,0,112,48V64H96a64,64,0,0,0-64,64V416a64,64,0,0,0,64,64H416a64,64,0,0,0,64-64V128A64,64,0,0,0,416,64ZM136,416a24,24,0,1,1,24-24A24,24,0,0,1,136,416Zm0-80a24,24,0,1,1,24-24A24,24,0,0,1,136,336Zm80,80a24,24,0,1,1,24-24A24,24,0,0,1,216,416Zm0-80a24,24,0,1,1,24-24A24,24,0,0,1,216,336Zm80,80a24,24,0,1,1,24-24A24,24,0,0,1,296,416Zm0-80a24,24,0,1,1,24-24A24,24,0,0,1,296,336Zm0-80a24,24,0,1,1,24-24A24,24,0,0,1,296,256Zm80,80a24,24,0,1,1,24-24A24,24,0,0,1,376,336Zm0-80a24,24,0,1,1,24-24A24,24,0,0,1,376,256Zm72-120v16a8,8,0,0,1-8,8H72a8,8,0,0,1-8-8V128A32.09,32.09,0,0,1,96,96H416a32.09,32.09,0,0,1,32,32Z"/></g><g id="location-sharp"><path d="M256,32C167.67,32,96,96.51,96,176c0,128,160,304,160,304S416,304,416,176C416,96.51,344.33,32,256,32Zm0,224a64,64,0,1,1,64-64A64.07,64.07,0,0,1,256,256Z"/></g></svg><div class="message-header">Meetup details</div><div class="message-body"><div>DATE <span class="icon has-text-grey-dark"><svg class="icon-item" viewBox="0 0 512 512"><use xlink:href="#calendar"></use></svg> </span><time class="has-text-primary has-text-weight-bold" datetime="2024-06-18">June 18, 2024</time></div><div>TIME <span class="icon has-text-grey-dark"><svg class="icon-item" viewBox="0 0 512 512"><use xlink:href="#alarm"></use></svg> </span><time class="has-text-primary has-text-weight-bold" datetime="15:30">7:30PM</time> - <time class="has-text-primary has-text-weight-bold" datetime="21:00">9:00PM</time></div><div>LOCATION <span class="icon has-text-grey-dark"><svg class="icon-item" viewBox="0 0 512 512"><use xlink:href="#location-sharp"></use></svg> </span><strong class="has-text-primary">Cloudflare Austin</strong> <em>(405 Comal St. Austin, TX 78702)</em></div><small>(Check back here or on <a href="https://twitter.com/search?q=austinjavascript.com%2Fposts%2Fmeetups%2F2024%2F06%2F18%2F">Twitter</a> for updates.)</small><p class="mt-4">Afterwards, the discussion carries on at <strong><a href="https://www.lazarusbrewing.com/">Lazarus Brewing Co.</a></strong> (1902 E 6th St, Austin, TX 78702).</p><div class="mt-4">Help <a href="https://twitter.com/intent/tweet?text=Meetup%3A%20%22JavaScript's%20Quirks%3A%20Understanding%20the%20'Why'%20Behind%20the%20'What'%22&url=austinjavascript.com%2Fposts%2Fmeetups%2F2024%2F06%2F18%2F&via=AustinJS">spread the word on Twitter</a>.</div></div></div></div><div class="column mt-5"><h2 class="title is-sr-only">Speaker</h2><div class="mt-4"><div class="card"><div class="card-content"><div class="media"><div class="media-left"><figure class="image is-96x96 has-background-grey-lighter"><img src="/assets/avatar/FZgr7vsBWt-96.jpeg" alt="David Bowman" loading="lazy" decoding="async"></figure></div><div class="media-content"><p class="title is-size-5">David Bowman</p><div class="subtitle is-6 has-text-weight-semibold is-marginless-bottom"></div><div><svg display="none"><g id="at-circle"><path d="M255.46,48.74c-114.84,0-208,93.11-208,208s93.12,208,208,208,208-93.12,208-208S370.31,48.74,255.46,48.74ZM380.28,252c-2.85,32.63-16.79,49.7-28,58.26S327.61,322.58,316,320.5a41.61,41.61,0,0,1-26.82-17.19,62.06,62.06,0,0,1-44,17.57,51.66,51.66,0,0,1-38.55-16.83c-11.38-12.42-17-30.36-15.32-49.23,3-35,30.91-57.39,56.87-61.48,27.2-4.29,52.23,6.54,62.9,19.46l3.85,4.66-6.34,50.38c-1.19,14.34,3.28,23.48,12.29,25.1,2.39.42,8.1-.13,14.37-4.93,6.72-5.15,15.14-16,17.1-38.47C354.7,223,348,200.35,333.1,184.05c-15.49-16.9-39.09-25.84-68.23-25.84-54,0-101.81,44.43-106.58,99-2.28,26.2,5.67,50.68,22.4,68.93C197.05,344,220,353.88,245.35,353.88c19,0,30.61-2.05,49.48-8.78a14,14,0,0,1,9.4,26.38c-21.82,7.77-36.68,10.4-58.88,10.4-33.28,0-63.57-13.06-85.3-36.77C138,321,127.42,288.94,130.4,254.82c2.91-33.33,18.45-64.63,43.77-88.12s57.57-36.49,90.7-36.49c37.2,0,67.93,12.08,88.87,34.93C373.83,187.05,383.25,217.89,380.28,252Z"/><path d="M252.57,221c-14.83,2.33-31.56,15.84-33.34,36.26-1,11.06,2,21.22,8.07,27.87a23.65,23.65,0,0,0,17.91,7.75c20.31,0,34.73-14.94,36.75-38.06a14,14,0,0,1,.34-2.07l3.2-25.45a49.61,49.61,0,0,0-32.93-6.3Z"/></g><g id="home"><path d="M261.56,101.28a8,8,0,0,0-11.06,0L66.4,277.15a8,8,0,0,0-2.47,5.79L63.9,448a32,32,0,0,0,32,32H192a16,16,0,0,0,16-16V328a8,8,0,0,1,8-8h80a8,8,0,0,1,8,8l0,136a16,16,0,0,0,16,16h96.06a32,32,0,0,0,32-32l0-165.06a8,8,0,0,0-2.47-5.79Z"/><path d="M490.91,244.15l-74.8-71.56,0-108.59a16,16,0,0,0-16-16h-48a16,16,0,0,0-16,16l0,32L278.19,40.62C272.77,35.14,264.71,32,256,32h0c-8.68,0-16.72,3.14-22.14,8.63L21.16,244.13c-6.22,6-7,15.87-1.34,22.37A16,16,0,0,0,43,267.56L250.5,69.28a8,8,0,0,1,11.06,0L469.08,267.56a16,16,0,0,0,22.59-.44C497.81,260.76,497.3,250.26,490.91,244.15Z"/></g><g id="logo-linkedin"><path d="M444.17,32H70.28C49.85,32,32,46.7,32,66.89V441.61C32,461.91,49.85,480,70.28,480H444.06C464.6,480,480,461.79,480,441.61V66.89C480.12,46.7,464.6,32,444.17,32ZM170.87,405.43H106.69V205.88h64.18ZM141,175.54h-.46c-20.54,0-33.84-15.29-33.84-34.43,0-19.49,13.65-34.42,34.65-34.42s33.85,14.82,34.31,34.42C175.65,160.25,162.35,175.54,141,175.54ZM405.43,405.43H341.25V296.32c0-26.14-9.34-44-32.56-44-17.74,0-28.24,12-32.91,23.69-1.75,4.2-2.22,9.92-2.22,15.76V405.43H209.38V205.88h64.18v27.77c9.34-13.3,23.93-32.44,57.88-32.44,42.13,0,74,27.77,74,87.64Z"/></g></svg> <a class="icon tooltip" href="https://www.theinnovationlab.dev/" aria-label="Home: https://www.theinnovationlab.dev/"><svg class="icon-item" viewBox="0 0 512 512"><use xlink:href="#home"></use></svg> </a><a class="icon tooltip" href="https://twitter.com/davidlbowman" aria-label="Twitter: davidlbowman"><svg class="icon-item" viewBox="0 0 512 512"><use xlink:href="#logo-twitter"></use></svg> </a><a class="icon tooltip" href="https://github.com/davidlbowman" aria-label="GitHub: davidlbowman"><svg class="icon-item" viewBox="0 0 512 512"><use xlink:href="#logo-github"></use></svg> </a><a class="icon tooltip" href="https://www.linkedin.com/in/davidlbowman" aria-label="LinkedIn: davidlbowman"><svg class="icon-item" viewBox="0 0 512 512"><use xlink:href="#logo-linkedin"></use></svg></a></div></div></div></div></div></div></div></div><div class="columns is-variable is-8-desktop"><div class="column is-two-thirds"><div class="box is-8 content"><h3>Sponsor</h3><figure class="image sponsor-logo"><img src="https://blog.cloudflare.com/content/images/2016/09/cf-blog-logo-crop.png" alt="Sponsored by: Cloudflare Austin"></figure><p>Austin JavaScript is <strong>sponsored this month by <a href="https://www.cloudflare.com/">Cloudflare Austin</a></strong>. Please thank them for their gracious gifts of pizza and drinks and for their support of the local JavaScript community.Ask them about their <a href="https://www.cloudflare.com/careers/">job opportunities</a>!</p></div></div></div><div class="columns is-variable is-8 mt-6"><div class="column"><a class="arrow-left" href="/posts/meetups/2024/05/21/">Making Mobile And Desktop Apps From Your JS Frontend With Tauri</a></div><div class="column has-text-right"><a class="arrow-right" href="/posts/meetups/2024/07/16/">Getting Started with Passkeys and WebAuthn</a></div></div><p class="edit-page content has-text-right-desktop"><a href="https://github.com/austinjavascript/austinjavascript.com/blob/master/./_meetups/2024-06-18-meetup.md">Edit this page</a></p></div></main><footer class="page-footer footer mt-4 pt-4"><div class="container"><div class="navbar"><div class="navbar-menu is-active"><div class="navbar-start"><a class="navbar-item" href="/">© 2024 Austin JavaScript </a><a class="navbar-item" href="/about/">About </a><a class="navbar-item" href="/code-of-conduct/">Code of Conduct </a><a class="navbar-item" href="/contributing/">Contributing </a><a class="navbar-item" href="/posts/">Posts </a><a class="navbar-item is-hidden-desktop" href="/posts/meetups/">Meetups</a></div><div class="navbar-end"><a class="navbar-item is-inline-block-tablet" href="https://twitter.com/AustinJS"><span class="icon tooltip" role="link" aria-label="@AustinJS on Twitter"><svg class="icon-item" viewBox="0 0 512 512"><use xlink:href="#logo-twitter"></use></svg> </span><span class="is-sr-only-desktop">Twitter: @AustinJS</span> </a><a class="navbar-item is-inline-block-tablet" href="https://austinjavascript.slack.com"><span class="icon tooltip" role="link" aria-label="austinjavascript on Slack"><svg class="icon-item" viewBox="0 0 512 512"><use xlink:href="#logo-slack"></use></svg> </span><span class="is-hidden-desktop">Slack: austinjavascript</span> </a><a class="navbar-item is-inline-block-tablet" href="https://github.com/austinjavascript"><span class="icon tooltip" role="link" aria-label="austinjavascript on GitHub"><svg class="icon-item" viewBox="0 0 512 512"><use xlink:href="#logo-github"></use></svg> </span><span class="is-hidden-desktop">GitHub: austinjavascript</span></a></div></div></div></div></footer><script>!function(e,a,t,n,g,c){e.GoogleAnalyticsObject=n,e.ga=e.ga||function(){(e.ga.q=e.ga.q||[]).push(arguments)},e.ga.l=+new Date,g=a.createElement(t),c=a.getElementsByTagName(t)[0],g.async=1,g.src="//www.google-analytics.com/analytics.js",c.parentNode.insertBefore(g,c)}(window,document,"script","ga"),ga("create","UA-45308206-4","auto"),ga("send","pageview")</script></body></html>
0 commit comments