SitePoint Sponsor

User Tag List

Results 1 to 9 of 9
  1. #1
    SitePoint Enthusiast
    Join Date
    Nov 2007
    Posts
    35
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Please explain me this function, I have trouble understanding this keyword

    Code:
    net.CommandQueue = function(id,url, freq) {
    	this.id = id;
    	net.cmdQueues[id] = this;
    	this.url = url;
    	this.queued = new Array();
    	this.sent = new Array();
    	if(freq) {
    		this.repeat(freq);
    	}
    }
    
    net.CommandQueue.prototype.addCommand = function(command) {
    	if(this.isCommand(command)) {
    		this.queue.append(command,true);
    	}
    }
    
    net.CommandQueue.prototype.fireRequest = function() {
    	if (this.queued.length == 0) {
    		return;
    	}
    	
    	var data = "data=";
    	for(var i = 0; i < this.queued.length; i++) {
    		var cmd = this.queued[i];
    		if(this.isCommand(cmd)) {
    			data += cmd.toRequestString();
    			this.sent[cmd.id] = cmd;
    		}
    	}
    	this.queued = new Array();
    	this.loader = new net.ContentLoader(this.url, net.CommandQueue.onload, net.CommandQueue.onerror, "POST",
    	data);
    }
    
    net.CommandQueue.prototype.isCommand = function(obj) {
    	return (
    		obj.implementsProp("id") &&
    		obj.implementsFunc("toRequestString") &&
    		obj.implementsFunc("parseResponse")
    	);
    }
    
    net.CommandQueue.onload = function(loader) {
    	var xmlDoc = net.req.responseXML;
    	var elDocRoot = xmlDoc.getElementsByTagName("commands")[0];
    	if(elDocRoot) {
    		for(i = 0; i < elDocRoot.childNodes.length; i++) {
    			elChild = elDocRoot.childNodes[i];
    			if(elChild.nodeName == "command") {
    				var attrs = elChild.attributes;
    				var id = attrs.getNamedItem("id").value;
    				var command = net.CommandQueue.sent[id];
    				if(command) {
    					command.parseResponse(elChild);
    				}
    			}
    		}
    	}
    }
    I highlighted the lines of codes that I dont understand above.
    I dont understand the code var command = net.CommandQueue.sent[id];. How come this code need to be coded like that? Is it possible to change it like this: var command = this.sent[id];. Since this refers to net.CommandQueue then the code should work right?

    Please explain it to me. Im still a student.

    Thanks!
    Last edited by ScallioXTX; Jun 4, 2010 at 06:37. Reason: made bold text in code block blue for extra emphasis

  2. #2
    I meant that to happen silver trophybronze trophy Raffles's Avatar
    Join Date
    Sep 2005
    Location
    Tanzania
    Posts
    4,662
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    Have you tried changing it to see if it works? I think you're right, and using this should work as well.

  3. #3
    Utopia, Inc. silver trophy
    ScallioXTX's Avatar
    Join Date
    Aug 2008
    Location
    The Netherlands
    Posts
    9,087
    Mentioned
    153 Post(s)
    Tagged
    2 Thread(s)
    It depends where the onload function is called. If it's called from within net.CommandQueue, this would work.
    If it's called from outside the class it won't.

    This article gives a good explanation as to why this is. It's one of the harder things to grasp about javascript IMHO.
    Rémon - Hosting Advisor

    SitePoint forums will switch to Discourse soon! Make sure you're ready for it!

    Minimal Bookmarks Tree
    My Google Chrome extension: browsing bookmarks made easy

  4. #4
    SitePoint Enthusiast
    Join Date
    Nov 2007
    Posts
    35
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by ScallioXTX View Post
    It depends where the onload function is called. If it's called from within net.CommandQueue, this would work.
    If it's called from outside the class it won't.

    This article gives a good explanation as to why this is. It's one of the harder things to grasp about javascript IMHO.
    Hi thanks for the link,

    I found this code in the link that you gave me:

    Code:
    function Person(first, last, age) {
    	this.first = first;
    	this.last = last;
    	this.age = age;
    }
    
    Person.prototype = {
    	getFullName: function() {
    		alert(this.first + ' ' this.last);
    	},
    	greet: function(other) {
    		alert("Hi " + other.first + ", I'm " + this.first + ".");
    	}
    };
    
    var elodie = new Person("Elodie", "Jaubert", 27);
    var christophe = new Person("Christophe", "Porteneuve", 30);
    christophe.greet(elodie);
    Why does other.first works? Should it be just other? Because other does not have a first property right?

  5. #5
    Utopia, Inc. silver trophy
    ScallioXTX's Avatar
    Join Date
    Aug 2008
    Location
    The Netherlands
    Posts
    9,087
    Mentioned
    153 Post(s)
    Tagged
    2 Thread(s)
    Quote Originally Posted by alcatraz678 View Post
    Why does other.first works?
    Because the variable "other" inside the function refers to the variable "elodie" outside the function, since the the "elodie" object is passed to the function as a parameter.

    Quote Originally Posted by alcatraz678 View Post
    Should it be just other?
    No

    Quote Originally Posted by alcatraz678 View Post
    Because other does not have a first property right?
    Yes it does. As I said, "other" refers to "elodie", and "elodie" is an instance of the Person class, and the Person class has a "first" property, therefore the "elodie" Object also has the "first" property, and seeing as "other" refers to "elodie" that also has the "first" property.
    Rémon - Hosting Advisor

    SitePoint forums will switch to Discourse soon! Make sure you're ready for it!

    Minimal Bookmarks Tree
    My Google Chrome extension: browsing bookmarks made easy

  6. #6
    SitePoint Enthusiast
    Join Date
    Nov 2007
    Posts
    35
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by ScallioXTX View Post
    Because the variable "other" inside the function refers to the variable "elodie" outside the function, since the the "elodie" object is passed to the function as a parameter.


    No


    Yes it does. As I said, "other" refers to "elodie", and "elodie" is an instance of the Person class, and the Person class has a "first" property, therefore the "elodie" Object also has the "first" property, and seeing as "other" refers to "elodie" that also has the "first" property.
    Oh okay, I understand now.

    Sir last question,

    Code:
    planets.commands.UpdatePropertyCommand = function(owner, field,value) {
    	this.id = this.owner.id+"_"+field;
    	this.obj = owner;
    	this.field = field;
    	this.value = value;
    }
    
    planets.commands.UpdatePropertyCommand.toRequestString = function() {
    	return {
    		type: "updateProperty",
    		id: this.id,
    		planetId: this.owner.id,
    		field: this.field,
    		value: this.value
    	}.simpleXmlify("command");
    }
    I found this code in the Ajax in Action book. It is for polling the server for updates.

    I just want to clear something up to make sure I understand the this keyword already.

    Why does the this.owner.id needs to have this in the code? Couldn't it be just owner.id? Would it work the same or will it have different behaviour?

    this.field = field;
    this.value = value;

    These two lines of codes doesn't use this at all.
    Why? Would it be different if I use this.field = this.field?

  7. #7
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,718
    Mentioned
    103 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by alcatraz678 View Post
    Code:
    planets.commands.UpdatePropertyCommand = function(owner, field,value) {
    	this.id = this.owner.id+"_"+field;
    	this.obj = owner;
    	this.field = field;
    	this.value = value;
    }
    ...
    Why does the this.owner.id needs to have this in the code? Couldn't it be just owner.id? Would it work the same or will it have different behaviour?
    Both this.owner.id and the owner that's passed in to the function refer to elements on the page. They both can refer to different ones though.

    The one that goes this.owner.id is the existing one that is already assigned to the UpdatePropertyCommand object.

    The one passed to the function as owner is a reference to a different page element.

    Both this.owner and owner refer to very different things, that may or just as easily may not refer to the same element. this.owner is the pre-existing one, and the owner that's passed to the function is a different one.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  8. #8
    Utopia, Inc. silver trophy
    ScallioXTX's Avatar
    Join Date
    Aug 2008
    Location
    The Netherlands
    Posts
    9,087
    Mentioned
    153 Post(s)
    Tagged
    2 Thread(s)
    Quote Originally Posted by alcatraz678 View Post
    Why does the this.owner.id needs to have this in the code? Couldn't it be just owner.id? Would it work the same or will it have different behaviour?
    I'm not sure, there is not enough code to go by to answer this question. You could test it of course, see if it works

    Quote Originally Posted by alcatraz678 View Post
    this.field = field;
    this.value = value;

    These two lines of codes doesn't use this at all.
    Why? Would it be different if I use this.field = this.field?
    Yes that would be different
    this.field = field => Set the property "field" in the object to the value of the parameter "field" given to the function
    this.field = this.field => Set the property "field" in the object to the value of the property "field" in the object. So in end-effect this does nothing.
    Rémon - Hosting Advisor

    SitePoint forums will switch to Discourse soon! Make sure you're ready for it!

    Minimal Bookmarks Tree
    My Google Chrome extension: browsing bookmarks made easy

  9. #9
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,718
    Mentioned
    103 Post(s)
    Tagged
    4 Thread(s)
    Let's break this down even further, line by line.

    Code javascript:
    planets.commands.UpdatePropertyCommand = function(owner, field,value) {

    This line is adding a function to planets.commands
    The function that is added is called UpdatePropertyCommand, and is called with three arguments. owner, field and value.

    Code javascript:
    this.id = this.owner.id+"_"+field;
    The this keyword here refers to the current object, which in this case could quite easily be planets.commands
    Wherever you see the this keyword, you can mentally replace that with planets.command, or some other object that is specified to be the current object.

    There are two separate things here that are being referred to as owner. One of these things is a property on the current object that is called owner. The other of these things is the variable called owner that was passed to the function.
    All references to the variable called owner that is passed to the function, could easily be renamed to something else, such as newOwner, without affecting in any way the completely separate property called owner that is on the current object.
    So, the above line takes owner element from the current object, which is very different from the owner that is passed to the function. The line takes the element's property called id, adds a string to it, and assigns that combination to a property of the current object called id

    Code javascript:
    this.obj = owner;
    This line uses the element that the UpdatePropertyCommand function was called with. The element in the owner variable is a very different one from that which the current object refers to.
    The above line tells a property called obj on the current object, to refer to the element that was passed to the function under the name of owner.

    Code javascript:
    this.field = field;
    This line sets a property called field on the current object, to be the same as the one that was passed to the function in the variable called field.

    Code javascript:
    this.value = value;
    This line sets a property called value on the current object, to be the same as the one that was passed to the function in the variable called value.

    Code javascript:
    }
    This line marks the end of the function.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript


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
  •