Evaluated function as an object property in JavaScript

Question

I am defining an object literal in JavaScript, but when I try to create a property that is a called function, I get a Uncaught ReferenceError: xxx is not defined error.

Here's an example:

var person = {
    name : 'Saucy Jack',

    convenienceHook : this.getName('some predefined string'),

    getName : function(string) {
        console.log(this.name + string);
    }
};

This errors saying Uncaught ReferenceError: convenienceHook is not defined.

Nor does it work if I assign the property outside the object definition:

var person = {
    name : 'Saucy Jack',

    getName : function(string) {
        console.log(this.name + string);
    }
};

person.convenienceHook = person.getName('some predefined string');
person.convenienceHook(); //returns error

What am I missing?

In the first instance getName() isn't defined by the time you call it as the object instantiation isn't complete. In the second instance, getName() doesn't return anything (or returns undefined) which isn't a function. — techfoobar
– techfoobar, Commented Jul 31, 2015 at 21:23
That's not the error I'm getting (TypeError: this.getName is not a function) — Amit
– Amit, Commented Jul 31, 2015 at 21:23
what is convenienceHook supposed to be, a pointer to get name function with a parameter — BhavO
– BhavO, Commented Jul 31, 2015 at 21:24

Ry- · Accepted Answer · 2015-07-31 21:23:32Z

4

Here:

var person = {
    name : 'Saucy Jack',

    convenienceHook : getname('some predefined string'),

    getName : function(string) {
        console.log(this.name + string);
    }
};

you’re calling a function called getname that doesn’t exist. getName is not a property on person yet, because getname('some predefined string') has to be evaluated before the object can exist, since it’s part of the object literal. Even if it did exist, though, you still wouldn’t be able to call it as a bare getname, and even if it did, you would have to capitalize getName properly.

Your second approach also just calls person.getName. It looks like you want to make another function that will call getName:

var person = {
    name : 'Saucy Jack',

    convenienceHook : function() {
        return this.getName('some predefined string');
    },

    getName : function(string) {
        console.log(this.name + string);
    }
};

answered Jul 31, 2015 at 21:23

Ry-♦

226k56 gold badges496 silver badges504 bronze badges

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

5 Comments

Amit Over a year ago

your code doesn't match OP. convenienceHook : this.getName not convenienceHook : getname. And the reason this fails is not that getName isn't a property of person yet, it's that it isn't a property of this (global scope)

GloryOfThe80s Over a year ago

Sorry - I posted with a few typos. I edited the question. Are you saying there's not a way to have an evaluated function as a property inside an object literal definition if that function is a method of the object being created?

Ry- Over a year ago

@GloryOfThe80s: this refers to the same thing inside an object literal as it does outside. It’s only inside functions that this can change. The explanation about person not existing still applies, anyway – this cannot ever refer to person at that point, because person has not been assigned a value and the value that will be assigned to it does not yet exist.

Ry- Over a year ago

@GloryOfThe80s: Right, you can’t use a property of an object you’re creating before that object exists, i.e. while you’re creating it.

Amit Over a year ago

@minitech - I didn't see the "before" version (it's not in the edit history either, I guess it was quickly corrected)

Doron Brikman · Accepted Answer · 2015-07-31 21:26:04Z

0

What you assigning is not a function, you need for example to return a function from the getName function, so the convenienceHook will be a function:

getName : function() {
    return function() {
        console.log(this.name);
    };
}

answered Jul 31, 2015 at 21:26

Doron Brikman

2,5941 gold badge20 silver badges17 bronze badges

Comments

Amit · Accepted Answer · 2015-07-31 21:29:12Z

0

The reason your first attempt fails is that this is not person, it's whatever this is in your current scope. could be global, or could be something else if that code is within a function.

answered Jul 31, 2015 at 21:29

Amit

46.4k9 gold badges83 silver badges113 bronze badges

Comments

Esa Hannila · Accepted Answer · 2015-07-31 21:37:04Z

0

This should work

var person = {
name: "Saucy Jack", 
convenienceHook: function() { return this.getName("Predefined text") },
getName: function(string) { 
    string=string||"";
    return this.name + string; } 
}

edited Jul 31, 2015 at 21:37

answered Jul 31, 2015 at 21:25

Esa Hannila

1,3182 gold badges16 silver badges34 bronze badges

5 Comments

Ry- Over a year ago

No, that doesn’t work. person doesn’t have a value when person.getName is evaluated.

Ry- Over a year ago

That still won’t work and is more or less the same as the question itself.

Esa Hannila Over a year ago

@minitech In your answer, it works except if you put person.getName() it returns Saucy Jackundefined, my solution has no problem with that

Ry- Over a year ago

Okay, seems to me that that’s not a problem though.

Esa Hannila Over a year ago

AND YES MY SOLUTION WORKS!! Remove wrong downvotes and mark as answer

Collectives™ on Stack Overflow

Evaluated function as an object property in JavaScript

4 Answers 4

5 Comments

Comments

Comments

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

5 Comments

Comments

Comments

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related