Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • World
  • Users
  • Groups
Skins
  • Light
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dark
  • Cyborg
  • Darkly
  • Quartz
  • Slate
  • Solar
  • Superhero
  • Vapor

  • Default (No Skin)
  • No Skin
Collapse
Code Project
  1. Home
  2. The Lounge
  3. Explaining JavaScript and this to people.

Explaining JavaScript and this to people.

Scheduled Pinned Locked Moved The Lounge
csharpc++javajavascriptphp
54 Posts 14 Posters 0 Views 1 Watching
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • M Marc Clifton

    Jeremy Falcon wrote:

    Marc's just old. Don't listen to him.

    That's actually what I tell my gf. :)

    Latest Article - Class-less Coding - Minimalist C# and Why F# and Function Programming Has Some Advantages Learning to code with python is like learning to swim with those little arm floaties. It gives you undeserved confidence and will eventually drown you. - DangerBunny Artificial intelligence is the only remedy for natural stupidity. - CDP1802

    J Offline
    J Offline
    Jeremy Falcon
    wrote on last edited by
    #45

    :-D

    Jeremy Falcon

    1 Reply Last reply
    0
    • M Marc Clifton

      Jeremy Falcon wrote:

      Clearly, you're looking at code written by a 5 year old that doesn't know anything about CSS selectors or jQuery.

      You're off by 50 years. :) And this is exactly why Javascript is so hard to learn. There are no (and no good) resources for how to do things other than SO, CP, and dubious forums by 3rd party vendors. Why? Because who the heck is going to write a book on how to do X when, given the multi-dimensional landscape of web development, describing where X is in this trans-dimensional space is pretty much impossible. Granted, all my examples are related to using jQuery and 3rd party frameworks, but it's impossible to disentangle Javascript from those things when doing web development.

      Jeremy Falcon wrote:

      but the whole $($($($($('#omg'))))) thing can be avoided.

      Beats me how to do it. The content of the tree (a jqxwidget) is programatically generated and I haven't figured out a simpler way of getting the text (not to mention the freaking ID) of the parent for a selected node. One option is to represent the tree as a Javascript structure, this would be simple enough to map ID's in the structure to the DOM that jqwidgets creates. And heaven help me if I have to learn one of the Angular/React/etc/ frameworks that jqwidgets claims to support. More obfuscation on top of nebulous indirection. Yup -- I'm an old fart. ;)

      Latest Article - Class-less Coding - Minimalist C# and Why F# and Function Programming Has Some Advantages Learning to code with python is like learning to swim with those little arm floaties. It gives you undeserved confidence and will eventually drown you. - DangerBunny Artificial intelligence is the only remedy for natural stupidity. - CDP1802

      J Offline
      J Offline
      Jeremy Falcon
      wrote on last edited by
      #46

      Marc Clifton wrote:

      You're off by 50 years. :) And this is exactly why Javascript is so hard to learn. There are no (and no good) resources for how to do things other than SO, CP, and dubious forums by 3rd party vendors. Why? Because who the heck is going to write a book on how to do X when, given the multi-dimensional landscape of web development, describing where X is in this trans-dimensional space is pretty much impossible.

      You're absolutely right about that. One of the pain points I have with React learning is simply finding good resources on it. And to top it off, once you find one, it's out-of-date. And to top it off even more, it's not exactly places teach you production ready stuff. It's a royal PITA. The web really is a hodgepodge of kiddie playground crap where nobody wants to agree on anything. About the only reason I was able to even start making any sense of all this crap was a couple years back I pestered a coworker of mine for literally like a year asking him tons of questions.

      Marc Clifton wrote:

      Granted, all my examples are related to using jQuery and 3rd party frameworks, but it's impossible to disentangle Javascript from those things when doing web development.

      Yeah totally. It is getting better at least, but the web is slow to migrate to new stuff. Being so popular and all there's a lot of existing crap to change before we make way for the new crap. And of course, by that time the new crap will be out-dated. :-D

      Marc Clifton wrote:

      The content of the tree (a jqxwidget) is programatically generated and I haven't figured out a simpler way of getting the text (not to mention the freaking ID) of the parent for a selected node.

      Having never used that lib, you'd think they'd expose that somehow. Go figure.

      Marc Clifton wrote:

      And heaven help me if I have to learn one of the Angular/React/etc/ frameworks that jqwidgets claims to support. More obfuscation on top of nebulous indirection.

      But... but... React! :-D

      Marc Clifton wrote:

      Yup -- I'm an old fart.

      At least you can laugh about it. You reach an age where it's ok to laugh at stuff. That's called maturity. And I'd say I'm 39 so I understand, but I'm sure you'd call me a youngin'. :~

      Jeremy Falcon

      M 1 Reply Last reply
      0
      • J Jeremy Falcon

        Yup. Don't get me wrong, C is still a favorite language of mine. Always will be, but it's harder to take down the entire OS in JavaScript. :laugh:

        Jeremy Falcon

        L Offline
        L Offline
        Lost User
        wrote on last edited by
        #47

        Yeah I see just the feature of undefined behavior (in case you are familiar with this term) is a bad feature of those languages IMHO.

        1 Reply Last reply
        0
        • J Jeremy Falcon

          Double check how the project is set up then. Here's a fiddle of it... JSFiddle[^]

          Jeremy Falcon

          T Offline
          T Offline
          Tomz_KV
          wrote on last edited by
          #48

          I tried JSFiddle and it worked. However, when I copied the exact code to a new HTML page, it behaved the same way as it was without "Orange". Here is the complete HTML code:

          //copied from JSFiddle
              var fruit = 'Orange';
              window.fruit = 'Apple';
          
              // unlike other languages, in JavaScript we can invoke this in more ways than one
              function explainThis() {
                  alert(fruit + ' ' + this.fruit);
              }
          
              explainThis(); // shows Orange Apple
              var stuff = new explainThis(); // shows Orange undefined
          

          TOMZ_KV

          J 1 Reply Last reply
          0
          • J Jeremy Falcon

            What browser are you running out of curiosity?

            Jeremy Falcon

            T Offline
            T Offline
            Tomz_KV
            wrote on last edited by
            #49

            Chrome 62.0.3202.94 and IE 11.726.15063.0

            TOMZ_KV

            1 Reply Last reply
            0
            • T Tomz_KV

              I tried JSFiddle and it worked. However, when I copied the exact code to a new HTML page, it behaved the same way as it was without "Orange". Here is the complete HTML code:

              //copied from JSFiddle
                  var fruit = 'Orange';
                  window.fruit = 'Apple';
              
                  // unlike other languages, in JavaScript we can invoke this in more ways than one
                  function explainThis() {
                      alert(fruit + ' ' + this.fruit);
                  }
              
                  explainThis(); // shows Orange Apple
                  var stuff = new explainThis(); // shows Orange undefined
              

              TOMZ_KV

              J Offline
              J Offline
              Jeremy Falcon
              wrote on last edited by
              #50

              Gotcha. It's because stuff ran on JSFiddle is a mock root and not the real root. When using the real root, as in your case, window is the default object, so in the real global scope the first two lines are pretty much the same since window is the default object and so the second assignment overwrites the first. In my original code, it was a fake root so to speak. I probably should've tested it first, but hey where's the fun in that. :) To illustrate...

              // this is the real root in the global space
              var fruitRoot = 'Banana'; // these two lines do the same thing
              window.fruitRoot = 'Pineapple'; // this overwrites the previous line

                function explainThisRoot() {
                   alert(fruitRoot + ' ' + this.fruitRoot);
                }
              
                explainThisRoot(); // shows Pineapple Pineapple
                var stuffRoot = new explainThisRoot(); // shows Pineapple undefined
              
                // this is an IIFE, simply put it's like a namespace
                (function () {
                   // this can be thought of as a fake root, JSFiddle will do something similar to
                   // constrain the user and prevent them from messing around with the entire page
              
                   var fruit = 'Orange'; // not in the global space anymore so this isn't window
                   window.fruit = 'Apple';
              
                   // unlike other languages, in JavaScript we can invoke this in more ways than one
                   function explainThis() {
                      alert(fruit + ' ' + this.fruit);
                   }
              
                   explainThis(); // shows Orange Apple
                   var stuff = new explainThis(); // shows Orange undefined
                })();
              

              Jeremy Falcon

              T 1 Reply Last reply
              0
              • J Jeremy Falcon

                Gotcha. It's because stuff ran on JSFiddle is a mock root and not the real root. When using the real root, as in your case, window is the default object, so in the real global scope the first two lines are pretty much the same since window is the default object and so the second assignment overwrites the first. In my original code, it was a fake root so to speak. I probably should've tested it first, but hey where's the fun in that. :) To illustrate...

                // this is the real root in the global space
                var fruitRoot = 'Banana'; // these two lines do the same thing
                window.fruitRoot = 'Pineapple'; // this overwrites the previous line

                  function explainThisRoot() {
                     alert(fruitRoot + ' ' + this.fruitRoot);
                  }
                
                  explainThisRoot(); // shows Pineapple Pineapple
                  var stuffRoot = new explainThisRoot(); // shows Pineapple undefined
                
                  // this is an IIFE, simply put it's like a namespace
                  (function () {
                     // this can be thought of as a fake root, JSFiddle will do something similar to
                     // constrain the user and prevent them from messing around with the entire page
                
                     var fruit = 'Orange'; // not in the global space anymore so this isn't window
                     window.fruit = 'Apple';
                
                     // unlike other languages, in JavaScript we can invoke this in more ways than one
                     function explainThis() {
                        alert(fruit + ' ' + this.fruit);
                     }
                
                     explainThis(); // shows Orange Apple
                     var stuff = new explainThis(); // shows Orange undefined
                  })();
                

                Jeremy Falcon

                T Offline
                T Offline
                Tomz_KV
                wrote on last edited by
                #51

                That explains it. :thumbsup:

                TOMZ_KV

                1 Reply Last reply
                0
                • J Jeremy Falcon

                  Marc Clifton wrote:

                  You're off by 50 years. :) And this is exactly why Javascript is so hard to learn. There are no (and no good) resources for how to do things other than SO, CP, and dubious forums by 3rd party vendors. Why? Because who the heck is going to write a book on how to do X when, given the multi-dimensional landscape of web development, describing where X is in this trans-dimensional space is pretty much impossible.

                  You're absolutely right about that. One of the pain points I have with React learning is simply finding good resources on it. And to top it off, once you find one, it's out-of-date. And to top it off even more, it's not exactly places teach you production ready stuff. It's a royal PITA. The web really is a hodgepodge of kiddie playground crap where nobody wants to agree on anything. About the only reason I was able to even start making any sense of all this crap was a couple years back I pestered a coworker of mine for literally like a year asking him tons of questions.

                  Marc Clifton wrote:

                  Granted, all my examples are related to using jQuery and 3rd party frameworks, but it's impossible to disentangle Javascript from those things when doing web development.

                  Yeah totally. It is getting better at least, but the web is slow to migrate to new stuff. Being so popular and all there's a lot of existing crap to change before we make way for the new crap. And of course, by that time the new crap will be out-dated. :-D

                  Marc Clifton wrote:

                  The content of the tree (a jqxwidget) is programatically generated and I haven't figured out a simpler way of getting the text (not to mention the freaking ID) of the parent for a selected node.

                  Having never used that lib, you'd think they'd expose that somehow. Go figure.

                  Marc Clifton wrote:

                  And heaven help me if I have to learn one of the Angular/React/etc/ frameworks that jqwidgets claims to support. More obfuscation on top of nebulous indirection.

                  But... but... React! :-D

                  Marc Clifton wrote:

                  Yup -- I'm an old fart.

                  At least you can laugh about it. You reach an age where it's ok to laugh at stuff. That's called maturity. And I'd say I'm 39 so I understand, but I'm sure you'd call me a youngin'. :~

                  Jeremy Falcon

                  M Offline
                  M Offline
                  Marc Clifton
                  wrote on last edited by
                  #52

                  Jeremy Falcon wrote:

                  You reach an age where it's ok to laugh at stuff.

                  Yeah, works well with one's partner too. ;) At the end of the day, I end up treating these technologies like everything else, even C#/.NET: 1) Figure out how to do stuff the hard way 2) Look at how to make it easier and learn from others 3) Create a toolbox that mitigates some of the pain points 4) Liberally sprinkle code with // TODO: Kludge! and // TODO: There has to be a better way! :)

                  Latest Article - Class-less Coding - Minimalist C# and Why F# and Function Programming Has Some Advantages Learning to code with python is like learning to swim with those little arm floaties. It gives you undeserved confidence and will eventually drown you. - DangerBunny Artificial intelligence is the only remedy for natural stupidity. - CDP1802

                  J 1 Reply Last reply
                  0
                  • M Marc Clifton

                    Jeremy Falcon wrote:

                    You reach an age where it's ok to laugh at stuff.

                    Yeah, works well with one's partner too. ;) At the end of the day, I end up treating these technologies like everything else, even C#/.NET: 1) Figure out how to do stuff the hard way 2) Look at how to make it easier and learn from others 3) Create a toolbox that mitigates some of the pain points 4) Liberally sprinkle code with // TODO: Kludge! and // TODO: There has to be a better way! :)

                    Latest Article - Class-less Coding - Minimalist C# and Why F# and Function Programming Has Some Advantages Learning to code with python is like learning to swim with those little arm floaties. It gives you undeserved confidence and will eventually drown you. - DangerBunny Artificial intelligence is the only remedy for natural stupidity. - CDP1802

                    J Offline
                    J Offline
                    Jeremy Falcon
                    wrote on last edited by
                    #53

                    Marc Clifton wrote:

                    Liberally sprinkle code with // TODO: Kludge! and // TODO: There has to be a better way!

                    I do the same thing too. :laugh:

                    Jeremy Falcon

                    1 Reply Last reply
                    0
                    • G GuyThiebaut

                      I am currently writing a road traffic simulator in javascript and both at work and in this project the one thing that makes javascript difficult is scope. Basically the manner in which scope is implemented javascript makes it that much more difficult than it needs to be. That said I have found that programming in javascritpt has made me a better developer because there are so many ways you can do things badly in javascript.

                      “That which can be asserted without evidence, can be dismissed without evidence.”

                      ― Christopher Hitchens

                      G Offline
                      G Offline
                      grolarbear
                      wrote on last edited by
                      #54

                      Personally I find any issues that arise from scope can be resolved by the immutability of objects. I have no idea if this is good practice, but passing object references around or just having a global or high-up object with important stuff is how I like to do it.

                      1 Reply Last reply
                      0
                      Reply
                      • Reply as topic
                      Log in to reply
                      • Oldest to Newest
                      • Newest to Oldest
                      • Most Votes


                      • Login

                      • Don't have an account? Register

                      • Login or register to search.
                      • First post
                        Last post
                      0
                      • Categories
                      • Recent
                      • Tags
                      • Popular
                      • World
                      • Users
                      • Groups