Private function in Javascript constructor is not accessible publicly

Question

I have this person object

function person(first, last, age, eye) {
    this.firstName = first;
    this.lastName = last;
    this.age = age;
    this.eyeColor = eye;

    function sayName(){
        var full="";    
        full="Hello my name is "+this.firstName + " "+this.lastName;
    }
}

and have made an instance of this object

var raul = new person("Raul","Zamora","19","brown")

I cannot figure out why the function sayName is not working. I am implementing it as such:

document.getElementById("sayName").innerHTML=raul.sayName();

where sayName is already defined as an id on the HTML part.

FYI it's good practice to capitalise constructor names (e.g. Person). — Andy
– Andy, Commented Sep 9, 2014 at 16:44
Maybe the following can help you understand constructor functions and prototype: stackoverflow.com/questions/16063394/… — HMR
– HMR, Commented Sep 9, 2014 at 23:17

Denys Séguret · Accepted Answer · 2014-09-09 16:38:55Z

2

It doesn't work because that sayName function is only visible in the scope of the constructor (and thus is totally useless).

To make that function available on instances, use

person.prototype.sayName = function(){
   var full="Hello my name is "+this.firstName + " "+this.lastName;
   return full; // don't forget to return the string
}

For more details, I suggest this article from the MDN : Introduction to Object-Oriented JavaScript

answered Sep 9, 2014 at 16:38

Denys Séguret

384k90 gold badges813 silver badges780 bronze badges

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

5 Comments

Bart Over a year ago

or inside the constructor, this.sayName = function() ...

Denys Séguret Over a year ago

@Bart In this case, as it uses this, it's a bad idea.

Bart Over a year ago

Why is it a bad idea?

Denys Séguret Over a year ago

@Bart I explained it below the other answer : it's useless to create a function for every instance. Please have a look at the documentation I link to.

Bart Over a year ago

As I've explained in that answer, there's definitely a use case for doing it per instance: private members. Whether you personally prefer the closure pattern vs the prototype pattern is entirely your opinion, and not by definition a "bad" idea.

Community · Accepted Answer · 2017-05-23 12:29:29Z

You've got a local function declaration there. Make it a property of the object by assignment - just like you did write this.firstName = first not var firstName = first.

This will make it a method that is accessible from outside:

function person(first, last, age, eye) {
    this.firstName = first;
    this.lastName = last;
    this.age = age;
    this.eyeColor = eye;

    this.sayName = function sayName(){
        var full="Hello my name is "+this.firstName + " "+this.lastName;
    };
}

However, some objections:

Constructor names should be capitalized
Your sayName method needs to return the string, or your example invocation won't work
Using the prototype for values that can be shared amongst instances (such as methods) is preferable

So we get to

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

var raul = new Person("Raul","Zamora","19","brown");
document.getElementById("sayName").textContent = raul.sayName();

Dalorzo · Accepted Answer · 2014-09-09 21:26:26Z

0

Your function sayName does not "belong" to your Class, in order to do so you need to declare it using this or using propotype

Using this :

function person(first, last, age, eye) {
            this.sayName = function(){
                return "Hello my name is "+this.firstName + " "+this.lastName;
            }
        }

Using prototype :

person.prototype.sayName = function(){
     return "Hello my name is "+this.firstName + " "+this.lastName;
}

Additionally sayName was not returning anything.

edited Sep 9, 2014 at 21:26

answered Sep 9, 2014 at 16:40

Dalorzo

20k7 gold badges57 silver badges102 bronze badges

5 Comments

Denys Séguret Over a year ago

This construct builds a different function for every instance. It's better to use the prototype.

Bart Over a year ago

@dystroy "better" is subjective. Performance may not be important here, and this pattern is the only pattern that allows true private members, in case you'd need it.

Denys Séguret Over a year ago

@Bart where do you see a private member here ?

Bart Over a year ago

@dystroy Well, 3 edits ago he was using firstName instead of this.firstName...

user663031 Over a year ago

I guess you mean person.prototype.sayName (with prototype).

Collectives™ on Stack Overflow

Private function in Javascript constructor is not accessible publicly

3 Answers 3

5 Comments

Comments

5 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

5 Comments

Comments

5 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related