Creating functions in function prototypes for Javascript

Question

How do I properly create a function within a function prototype? What I have is this:

    <body>
    <p id="demo"></p><script>
function person(first, last, age, eye) {
    this.firstName = first;
    this.lastName = last;
    this.age = age;
    this.eyeColor = eye;
}
person.prototype.name = function() {
    return {
        myFunc: function() {
          this.firstName + " " + this.lastName;
       }
      }
};

var myFather = new person("John", "Doe", 50, "blue");

document.getElementById("demo").innerHTML =
"My father is " + myFather.name().myFunc; 
</script>

</body>

When I run this it returns "My father is function () { this.firstName + " " + this.lastName; }" , but I was expecting John Doe.

you're not calling myFunc, you're just returning the function itself. if you want to invoke myFunc, then it should myFather.name().myFunc() — Marc B
– Marc B, Commented Feb 9, 2015 at 19:30

Oleksandr T. · Accepted Answer · 2015-02-09 19:39:31Z

4

You need call function, add () to myFunc. In your example you added reference to internal function.

document.getElementById("demo").innerHTML = "My father is " + myFather.name().myFunc();

Also add return to myFunc. To get properties from parent scope - save reference to this

person.prototype.name = function () {
  var _this = this;

  return {
    myFunc: function () {
      return _this.firstName + " " + _this.lastName;
    }
  }
};

Example

edited Feb 9, 2015 at 19:39

answered Feb 9, 2015 at 19:30

Oleksandr T.

77.6k17 gold badges177 silver badges145 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

BlueElixir Over a year ago

This solution works, Thanks! I guess my usage of 'this' was incorrect in the question.

Shikiryu · Accepted Answer · 2015-02-09 19:32:37Z

0

Myfunc is a function. When you call it, call like myfunc()

answered Feb 9, 2015 at 19:32

Shikiryu

10.3k9 gold badges53 silver badges76 bronze badges

Comments

skay- · Accepted Answer · 2015-02-09 19:40:01Z

0

You are not calling myFunc and also that function does not return anything. I find this cleaner and a better way to define the funciton prototype:

function Person(first, last, age, eye) {
    this.firstName = first;
    this.lastName = last;
    this.age = age;
    this.eyeColor = eye;
}
Person.prototype = {
    name: function() {
          return this.firstName + " " + this.lastName;
       }
};

Note that name now returns return this.firstName + " " + this.lastName;.

Then simply:

document.getElementById("demo").innerHTML = "My father is " + myFather.name();

answered Feb 9, 2015 at 19:40

skay-

1,5863 gold badges17 silver badges26 bronze badges

1 Comment

Bergi Over a year ago

even cleaner: stackoverflow.com/questions/17474390/…

Collectives™ on Stack Overflow

Creating functions in function prototypes for Javascript

3 Answers 3

1 Comment

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related