Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    New to the CF scene
    Join Date
    Nov 2009
    Location
    BeiJing
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Angry Help on JavaScript constructor property

    I had read from books that the constructor property of object is inherited from its prototype. And the prototype can be changed dynamically. New property can be added to or deleted from object even it was created before the prototype change. But I got confused on below codes.
    Code:
    function A()
    {
    	this.title = "A";	
    }
    
    function B()
    {
    	this.title = "B";	
    }
    
    document.write("<br>");
    var b = new B();
    
    document.write(b.constructor);
    document.write("<br>");
    document.write(B.prototype.constructor);
    document.write("<br>");
    
    B.prototype = new A();
    document.write(b.constructor); // Suppose to output "function A() ..."
    document.write("<br>");
    document.write(B.prototype.constructor);
    document.write("<br>");
    
    B.prototype.constructor = B;
    document.write(b.constructor);
    document.write("<br>");
    document.write(B.prototype.constructor);
    document.write("<br>");
    But the actual result (both IE and firefox) is
    Code:
    function B() { this.title = "B"; }
    function B() { this.title = "B"; }
    function B() { this.title = "B"; }
    function A() { this.title = "A"; }
    function B() { this.title = "B"; }
    function B() { this.title = "B"; }
    Please help me. thanks.
    Last edited by Kor; 11-19-2009 at 09:52 AM. Reason: wrap the code [code][/code]

  • #2
    Regular Coder
    Join Date
    Mar 2006
    Posts
    728
    Thanks
    35
    Thanked 132 Times in 123 Posts
    The change is read in the instances and in the prototypes,
    not in the functions.

    function A(){this.title='A'};
    function B(){this.title='B'};
    B.prototype=new A;

    var b=new B();

    alert(b.constructor); // returns function A
    alert(B.prototype.constructor); // // returns function A

    But since title property is in the constructor function, and not the prototype, b.title is 'B'.

    If you define a property or method in the prototype it will be inherited
    A.prototype.type='A';
    alert(b.type);
    Last edited by mrhoo; 11-19-2009 at 02:48 PM.

  • #3
    New to the CF scene
    Join Date
    Nov 2009
    Location
    BeiJing
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Smile

    Quote Originally Posted by mrhoo View Post
    The change is read in the instances and in the prototypes,
    not in the functions.

    function A(){this.title='A'};
    function B(){this.title='B'};
    B.prototype=new A;

    var b=new B();

    alert(b.constructor); // returns function A
    alert(B.prototype.constructor); // // returns function A

    But since title property is in the constructor function, and not the prototype, b.title is 'B'.

    If you define a property or method in the prototype it will be inherited
    A.prototype.type='A';
    alert(b.type);
    Maybe I didn't clearly describe my issue.
    I create instance b first by b = new B();
    then I change B's prototype B.prototype = new A();
    As b itself doesn't have constructor property and it inherits the property from its prototype, so b.constructor should be identical with B.prototype.constructor, i.e. both of them should be "function A() ...". But the test result is b.constructor is still "function B() ...".

    I also tested creating the object after setting the prototype, both of them are "function A() ...".

    I am wondering what happened behind the invocation order change.
    Last edited by lee_wen; 11-19-2009 at 04:02 PM.

  • #4
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,350
    Thanks
    11
    Thanked 589 Times in 570 Posts
    Quote Originally Posted by lee_wen View Post
    As b itself doesn't have constructor property and it inherits the property from its prototype, so b.constructor should be identical with B.prototype.constructor, i.e. both of them should be "function A() ..."
    no, b does have a constructor: B.
    in the code you posted, A does comes up for both, as you expected.

    Code:
    function A(){this.title='A'};
    function B(){this.title='B'};
    B.prototype=new A;
    
    var b=new B();
    
    alert(b.constructor); // returns function A
    alert(B.prototype.constructor); // // returns function A
    is there anything you're still unclear on?
    my site (updated 13/9/26)
    BROWSER STATS [% share] (2014/5/28) IE7:0.1, IE8:5.3, IE11:8.4, IE9:3.2, IE10:3.2, FF:18.2, CH:46, SF:7.9, NON-MOUSE:32%

  • #5
    New to the CF scene
    Join Date
    Nov 2009
    Location
    BeiJing
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Smile

    Quote Originally Posted by rnd me View Post
    no, b does have a constructor: B.
    in the code you posted, A does comes up for both, as you expected.

    Code:
    function A(){this.title='A'};
    function B(){this.title='B'};
    B.prototype=new A;
    
    var b=new B();
    
    alert(b.constructor); // returns function A
    alert(B.prototype.constructor); // // returns function A
    is there anything you're still unclear on?
    I know it works well in your case.
    I am talking about the case that b is created before reassign the prototype.

  • #6
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,350
    Thanks
    11
    Thanked 589 Times in 570 Posts
    in this case:
    Code:
    function B(){this.title='B'};
    var b=new B();
    
    alert(b.constructor); // returns function B
    alert(B.prototype.constructor); // // returns function B

    the first alert is obvoius.
    the second one results from the default prototype object used for constructors;
    an empty object of the type as the constructor for objects, the function itself for functions, undefined for primitives, etc...
    my site (updated 13/9/26)
    BROWSER STATS [% share] (2014/5/28) IE7:0.1, IE8:5.3, IE11:8.4, IE9:3.2, IE10:3.2, FF:18.2, CH:46, SF:7.9, NON-MOUSE:32%


  •  

    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
    •