www.webdeveloper.com
Page 1 of 2 12 LastLast
Results 1 to 15 of 16

Thread: Javascript functions objects

  1. #1
    Join Date
    Jul 2011
    Posts
    13

    Javascript functions objects

    Hi,

    Can anyone explain why this is?

    functions can be declared in the constructor or in the prototype or on the object after the object has been initialised.

    functions can not be declared on the object previous to initialisation, it is not available after iniaialisation.

    e.g.
    <script type="text/javascript">
    var Person = function () {
    this.ctx = 'this is some other stuff'; // Public ;
    var stuff = 'this is some stuff'; // Private

    this.getThisSuff = function () { // this works
    return stuff;
    };
    };

    Person.getMyOtherStuff = function () { // this doesnt work

    return (function () {return this.ctx;})();

    };

    Person.prototype.getMyStuff = function () { // this works

    return this.ctx;
    };


    Person.StuffHolder = 'more stuff'; // this works


    var p = new Person();

    alert('1 ' + p.getThisSuff()); // works

    alert('2 ' + p.getMyStuff()); // works

    alert('3 ' + p.getMyOtherStuff()); // dont work, why so?
    </script>

  2. #2
    Join Date
    Dec 2003
    Location
    Bucharest, ROMANIA
    Posts
    15,428
    Should be:
    Code:
    Person.prototype.getMyOtherStuff = function () { 
    return this.ctx;
    };
    Person is the constructor. p is the object.

    If you are using the constructor to add a new property/method, you should use the prototype.

  3. #3
    Join Date
    Jul 2011
    Posts
    13
    Thnaks for your reply,

    dont declare methods in the constructor use prototype. Good. Crockford recommends!

    I realised what you are talking about with this implementation in the example:

    Person.prototype.getMyStuff = function () { // this works

    return this.ctx;
    };

    ---

    My question is however, why doest this work?


    Person.prototype.getMyStuff = function () { // this works

    return this.stuff;
    };


    // I Posted the wrong example in my post

  4. #4
    Join Date
    Jul 2011
    Posts
    13
    //Should have posted this example

    <script type="text/javascript">
    var Person = function () {
    this.ctx = 'this is some other stuff'; // Public ;
    var stuff = 'this is some stuff'; // Private

    this.getThisSuff = function () { // this works
    return stuff;
    };
    };

    Person.getMyOtherStuff = new function () { // this doesnt work

    return this.ctx;

    };

    Person.prototype.getMyStuff = function () { // this works

    return this.ctx;
    };


    Person.StuffHolder = 'more stuff'; // this works


    var p = new Person();

    alert('1 ' + p.getThisSuff()); // works

    alert('2 ' + p.getMyStuff()); // works

    alert('3 ' + p.getMyOtherStuff()); // dont work, why so?
    stuff.html:35Uncaught TypeError: Object [object Object] has no method 'getMyOtherStuff'

    </script>

  5. #5
    Join Date
    Jul 2011
    Posts
    13
    // Last time !
    <script type="text/javascript">
    var Person = function () {
    this.ctx = 'this is some other stuff'; // Public ;
    var stuff = 'this is some stuff'; // Private

    this.getThisSuff = function () { // this works
    return stuff;
    };
    };

    Person.getMyOtherStuff = new function () { // this doesnt work

    return this.ctx;

    };

    Person.prototype.getMyStuff = function () { // this works

    return this.ctx;
    };


    Person.StuffHolder = 'more stuff'; // this works


    var p = new Person();

    alert('1 ' + p.getThisSuff()); // works

    alert('2 ' + p.getMyStuff()); // works

    alert('3 ' + p.getMyOtherStuff()); // dont work, why so?
    </script>

  6. #6
    Join Date
    Dec 2003
    Location
    Bucharest, ROMANIA
    Posts
    15,428
    Once again: don't confound the Object with its Constructor.

    If you want to add new properties/methods to a Constructor, you must add them to its prototype, so that any other object which might be created using that Constructor could share the new property/method. That is the principle of delegation in JavaScript. What is not clear so far?

    Code:
    function Constructor(name,color){ // this is a constructor
    this.name=name;
    this.color=color;
    }
    Constructor.prototype.alertColor=function(){ // this is a new method added straight to the Constructor via its prototype; it will work for all the objects which will be created using this constructor
    alert(this.color);
    }
    var myObject=new Constructor('myObject','red'); // this is an object
    myObject.alertName=function(){alert(this.name)} // this is new method added to the object; it will work only for this particular object
    //test
    myObject.alertName(); // has its own method
    myObject.alertColor(); // gets the general method of the prototype of the constructor
    
    var newObject=new Constructor('newObject','green'); // this is another object created using the same constructor
    //test
    newObject.alertColor(); // gets the general method of the prototype of the constructor (by delegation)
    Last edited by Kor; 07-05-2011 at 05:55 AM.

  7. #7
    Join Date
    Jul 2011
    Posts
    13
    So basically.

    Anything to do with the Creation of the Object must happen in the constructor or the prototype. End of Story. Any thing created out side the constructor but on the same instance is irrelevant.

    i.e.

    Person.getMyOtherStuff = new function () {

    return this.ctx;

    };

  8. #8
    Join Date
    Dec 2003
    Location
    Bucharest, ROMANIA
    Posts
    15,428
    Quote Originally Posted by nivekyenwod View Post
    So basically.

    Anything to do with the Creation of the Object must happen in the constructor or the prototype. End of Story. Any thing created out side the constructor but on the same instance is irrelevant.

    i.e.

    Person.getMyOtherStuff = new function () {

    return this.ctx;

    };
    Not quite. The Constructor (in your case, the function Person()) can be treated also like an object, as any other function, but as an object with its own properties, which have nothing in common with the Object constructed (your case: p)

    You should, also, understand the position and the meaning of the token this

    Here:
    Code:
    var Person = function () {
    this.ctx = 'this is some other stuff'; 
    }
    this does not refer the constructor Person() itself. It refers the object which might be created via that constructor. For instance, your case, the object p.

    On the contrary, in the code:
    Code:
    Person.getMyOtherStuff = function () { 
    return this.ctx;
    }
    this refers the function Person(), not the object created via that function. Or the function Person() has no property called ctx, thus there will be an error.

  9. #9
    Join Date
    Jul 2011
    Posts
    13
    reiterate:

    Anything to do with the Object after a new event, the instance, must happen in the constructor or the prototype.

    Anything outside of the Constructor, a new event is not relevant and are the properties/methods of the object which contains the constructor. If you like static methods.

    Thanks for all you help with this. I almost have my head around object and classes.

  10. #10
    Join Date
    Jul 2011
    Posts
    13
    That is to say, methods created outside the constructor and prototype are like static method properties/methods

  11. #11
    Join Date
    Dec 2003
    Location
    Bucharest, ROMANIA
    Posts
    15,428
    Quote Originally Posted by nivekyenwod View Post
    That is to say, methods created outside the constructor and prototype are like static method properties/methods
    You may say so. Yes.

  12. #12
    Join Date
    Jul 2011
    Posts
    13
    Thanks very much for your support, I will call again!

  13. #13
    Join Date
    Jul 2011
    Posts
    13
    Hello,

    Can you explain why this causes an error:

    window.myNS = myNS || {};

    Best Regards,

    Kevin Downey

  14. #14
    Join Date
    Jul 2013
    Posts
    66
    Has been asked as a new question here: http://www.webdeveloper.com/forum/sh...pt-Namespacing

  15. #15
    Join Date
    Jan 2011
    Posts
    117
    Person.getMyOtherStuff = function () { // this doesnt work
    return (function () {return this.ctx;})();
    };
    will not work, because "ctx" is not a property of the self invoking anonymous function, that is:
    (function () {return this.ctx;})();

Thread Information

Users Browsing this Thread

There are currently 2 users browsing this thread. (0 members and 2 guests)

Tags for this Thread

Posting Permissions

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



Recent Articles