SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Evangelist
    Join Date
    Jul 2007
    Posts
    345
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    The path to closure

    I'd be grateful for any feedback on my attempts to get some JavaScript concepts clear in my head:

    http://www.room51.co.uk/js/index.html

  2. #2
    SitePoint Wizard silver trophy kyberfabrikken's Avatar
    Join Date
    Jun 2004
    Location
    Copenhagen, Denmark
    Posts
    6,157
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    It's a lot of text there, so I only skimmed it through. You seem to have a good grip on how things work. However, what it all boils down to, is really two fundamental features of the language, which are different than most other mainstream languages. If you understand these, most of the seemingly strange behaviour will become quite obvious.

    The first -- and probably the weirdest -- thing, is that functions are values, which can be assigned to variables. In most other languages, code and data live in separate dimensions; Not so in javascript. You can assign a function to a variable and you can pass it around like any other variable. While Javascript doesn't have classes, it has hashmaps (objects) and since you can assign a function to slots in a hashmap, you can effectively get something which superficially looks similar to class-based objects. However, unlike class-based systems, the functions in Javascript aren't bound to a specific class.

    The second feature, is that variables are lexically scoped (Also called static scope). This means that any variables are available to the scope in which they are declared. While this may seem a bit exotic, it's fairly simple once you get used to it. The rules of lexical scoping makes it easier to predict which part of the code has access to a given variable, since there is no runtime rules that come into play; Everything can be deduced from the source-code alone.

    Now, on top of these fundamental concepts, Javascript has a couple of small tricks, that are more there for making the language more fluent. One of these is that if a function is called as an object member, then the variable this is automatically bound to that object. This helps to make objects behave more like they do in class-based systems. Strictly speaking, this isn't an essential requirement. Other languages (From which Javascript was inspired), that have similar semantics, simply have it as a convention that one passes the object as the first member to a member function. If Javascript had done that, it might have looked like this:
    Code:
    var obj = {
      name: "John",
      sayHi: function(self) {
        alert("Hi, my name is " + self.name);
      }
    }
    obj.sayHi(obj);
    this is just an inbuilt convenience mechanism, that does essentially the same thing.

  3. #3
    SitePoint Evangelist
    Join Date
    Jul 2007
    Posts
    345
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I guess learning to control the scope and context rather than being caught out by them is one of the key skills needed to master JavaScript.

    Code:
    function Test() {
       // bind to current instance
       this.property = "My Property";
    
       (function() {
          // going global
          this.property = "Window Property";
       })();
    }

  4. #4
    SitePoint Evangelist
    Join Date
    Jul 2007
    Posts
    345
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Dustin Diaz has just posted on this topic:
    http://www.dustindiaz.com/scoping-anonymous-functions/

  5. #5
    SitePoint Wizard stereofrog's Avatar
    Join Date
    Apr 2004
    Location
    germany
    Posts
    4,324
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    From my experience the hardest thing to understand for beginners is that "this" actually behaves as a function, not a variable.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •