My creation of a simple object is not working correctly?

Question

I want to create a simple object and then use a constructor to fill that object just like you can in an OOP language. Why is Javascript not letting me create a basic object

person = new Object();

Question: What would be the best way to declare an object in Javascript so that it basically follows that same convesion as Java and C++?

I would like to be able to add in the object properties before I use them in the code.

Code:

<!DOCTYPE html>
<html>
<body>

<script>

person=new Object(); <-- will work with out this code

function person(firstname,lastname,age,eyecolor)
{
this.firstname=firstname;
this.lastname=lastname;
this.age=age;
this.eyecolor=eyecolor;
}

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

document.write(myFather.firstname + " -- " + myFather.age);
</script>

</body>
</html>

Note that JavaScript is an OOP language. It's just prototype based instead of class based. — ajp15243
– ajp15243, Commented Apr 1, 2014 at 15:46
I don't understand the question. What's the problem with the constructor? — Smeegs
– Smeegs, Commented Apr 1, 2014 at 15:48
Your code doesn't make sense. First you declare a function (person, notice, that functions in JS are hoisted), then you override it with an empty object... — Teemu
– Teemu, Commented Apr 1, 2014 at 15:48
What would be the best way to declare an object in Javascript so that it basically follows that same convesion[sic] as Java and C++?: Different language, different conventions. Don't fight to try and get the language to work the same as some other language or you'll be frustrated for a long time. — Matt Burland
– Matt Burland, Commented Apr 1, 2014 at 15:48

mpm · Accepted Answer · 2014-04-01 15:55:56Z

2

function person(firstname,lastname,age,eyecolor)
{
this.firstname=firstname;
this.lastname=lastname;
this.age=age;
this.eyecolor=eyecolor;
}

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

document.body.innerHTML=myFather.firstname + " -- " + myFather.age;

works, you dont need person=new Object() since your are defining person in a function statement anyway. In javascript, functions are object constructors too.That's why you can call new on functions.

http://jsfiddle.net/camus/bBj8f/

Question: What would be the best way to declare an object in Javascript so that it basically follows that same convesion as Java and C++?

Javascript doesnt have to follow Java or C++ "conventions", Javascript doesnt work like Java or C++ .

edited Apr 1, 2014 at 15:55

answered Apr 1, 2014 at 15:48

mpm

20.2k7 gold badges52 silver badges56 bronze badges

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

1 Comment

Smeegs Over a year ago

I was going to post this myself, but the OP states this in his question, I have no idea what he's asking.

Timo Virkkunen · Accepted Answer · 2014-04-01 15:49:49Z

1

Your line

person=new Object();

is not needed here. Just remove that line and your code should work: http://jsfiddle.net/s5UDq/

answered Apr 1, 2014 at 15:49

Timo Virkkunen

1064 bronze badges

Comments

MarcoL · Accepted Answer · 2014-04-01 15:50:03Z

Just a small dissection of your code:

Here you are creating a (global variable) with an object inside.

person=new Object();

The line next you are creating a new function named person: note that is not a variable with the function as value.

function person(firstname,lastname,age,eyecolor){
  this.firstname=firstname;
  this.lastname=lastname;
  this.age=age;
  this.eyecolor=eyecolor;
}

After that you are using the named function as implicit constructor for the object person.

The solution would be to either create a variable person, with the function as a value, or just the named function.

For the former have a look to this:

  var person = function(firstname,lastname,age,eyecolor){
    this.firstname=firstname;
    this.lastname=lastname;
    this.age=age;
    this.eyecolor=eyecolor;
  }

For the latter, just remove the person = new Object(); line.

friedi · Accepted Answer · 2014-04-01 16:08:06Z

0

The solution:
Remove the line person = new Object(); and then your code works as expected.

The reason:
The reason why you're getting an error in your code is because of function hoisting in javascript (see http://designpepper.com/blog/drips/variable-and-function-hoisting). Because of this the function player gets defined above all. After that you overwrite the function player with a emtpy object (with the line person = new Object();).

So this is why there is an error like this: Uncaught TypeError: object is not a function

Have a look at the additional comments:

console.log(person); // logs function person(firstname,lastname,age,eyecolor) ...

person=new Object(); // here you overwrite your function

function person(firstname,lastname,age,eyecolor) // at this point the function is already declared
{
this.firstname=firstname;
this.lastname=lastname;
this.age=age;
this.eyecolor=eyecolor;
}

console.log(person); // logs Object {}

myFather=new person("John","Doe",50,"blue"); // Uncaught TypeError: object is not a function

console.log(myFather.firstname + " -- " + myFather.age);

edited Apr 1, 2014 at 16:08

answered Apr 1, 2014 at 16:02

friedi

4,3601 gold badge15 silver badges19 bronze badges

2 Comments

user3376708 Over a year ago

If i open a page in Google Chrome will it show me all the errors on the page?

friedi Over a year ago

no, you can see the error in the javascript console (you can get to the console with the key F12)

Collectives™ on Stack Overflow

My creation of a simple object is not working correctly?

4 Answers 4

1 Comment

Comments

Comments

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

1 Comment

Comments

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related