Object creation (confused about how to declare properties)

JavaScript
1

This is why I´m scared of starting building on React

Reached the challenge https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/make-a-person and I can´t remember how objects really work still

So I managed to do the “getters” tests. But once I try to the “setter” I can´t wrap my head around what I´m exactly doing.

Can you tell me what is wrong about this code? (what I remarked between double asterics is what is not working obviously)

var Person = function(firstAndLast) {
  // Complete the method below and implement the others similarly
  **FullName: this.FullName**,

  this.getFirstName = function(){
    return "Bob"
  }
  this.getLastName = function(){
    return 'Ross'
  }
  this.getFullName = function() {
    return "Bob Ross";
  };
  this.setFullName = function(name){
    **this.FullName = name;**
  }
  return firstAndLast;
};

var bob = new Person('Bob Ross');
bob.setFullName("Hola Chico");
bob.getFullName; // RETURNS "function" when it should return "Hola Chico"

Basically I´m confused in how to create the attributes FirstName, FullName, and LastName to then make setters to them, since I only know how to do them when they are also working as an argument to the “big function” (in this case the only argument apparently is “firstAndLast”).

2

First of all, your syntax isn’t correct here. All this stuff doesn’t use any special syntax: that first line, for example, cannot be correct from what you already know about how to write a function.

You also aren’t using getters and setters. You’re just writing functions you’ve prefixed with “get” and “set”. In your code, a function you’ve called “get…” just returns whatever property on the object, “set…” takes an argument and changes a property. They work exactly the same as any function you’ve written previously in the course, with this referring to the object you’re working on

3

So it should be more like this…?

FirstName: "Pablo"

  get FirstName(){
    return this.FirstName
  }

But the line FirstName: "Pablo" something tells me that is not right.

4

A name is passed in, witch you can access with the firstAndLast function parameter. If you hardcode strings in the function, you will not be able to create different persons

If the person is called “James Bond”, you will not be able to get “James” with the getFirstName() function because that function returns always "Bob"

1 Like
5

Ok that clears a lot of things. Thanks!

6

So I should have been a bit clearer here. What you have is just a function, and it almost obeys all the same rules as every other function.
However, if I execute new Person() rather than just Person(), it does an extra thing: it creates an object out of thin air, and this... stuff inside your function is going to refer to that brand new object. If I strip your current function down:

var Person = function(firstAndLast) {
  return firstAndLast;
}

That’s basically what you have. It’s a function that takes a value and returns that same value. But you’re trying to return an object.

This line:

var Person = function(firstAndLast) {
  FullName: this.FullName
}

Person is a function, and JS syntax rules don’t suddenly change here: that isn’t how you define things in functions.

You can do this:

var Person = function(firstAndLast) {
  this.FullName = firstAndLast;
}

So when you do new Person("Foo Bar") it’s going to produce an object that looks like { FullName: "Foo Bar" }. So this.FullName is a property called FullName on the object you created.

So the property can be a function as well, like this.foo = function() { return "foo" }. That means the object will have a property called foo which is a function. This is what I meant when I said these are just functions: the only thing special about them is that they are going to use this to refer to properties on the object they live within.

So onto what @ilenia said: for example, how do you make a function that takes a string that is two words separated by a space and set the second word as the value of some variable?

8

Thanks a lot. So yeah you are right how can I thought it was an object :S i think im a little burn out lol too much coding lately

I think I pretty much understand the concept now, the firstName and lastName getters and setters are working now althouth at the same time I haven´t advanced a lot, I don´t get how:

bob.getFirstName() should return “Bob”.

after just having creating an instance with newPerson(‘Bob Ross’)

FirstName declaration its a different place than FullName declaration, and is not that i can do:

this.FirstName = FirstB̶u̶t̶N̶o̶t̶L̶a̶s̶t̶

and

this.LastName = LastB̶u̶t̶N̶o̶t̶F̶i̶r̶s̶t̶

:joy:

Unless I could modify/add arguments in the main function, but I imagine im not supposed to do that

9

The first name is inside firstAndLast, same for the last name - so you can certainly return name, you know string manipulation, right?

1 Like
10

oooooh right! Now i feel dumb.I think I can make it now using splice,slice and all of that things…

You know this is what pisses me off about trying to solve a problem with guidance (not really complaining about FCC because the whole point about a course is that is guided lol) is just that you get so obfuscated into what it exactly must be done that I just didn´t think that it was possible to do those things as string manipulation

Happened to me more than once, and more than twice. Not sure upto what point “additional” stuff must be implemented that the challenge doesnt tell you to.

Again not really complaining of FCC but rather justifying myself haha

11

Link to the challenge: https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/make-a-person

So getters are working fine.

However the setters are not working. When I call bob.setFirstName(“Haskell”) it doesn´t change anything to firstAndLast. why just doing firstAndLast = “first” doesn´t change anything. (because after all firstAndLast does have a place in memory and it should work as a “variable” right? If not i´m out of ideas how to modify this things withouth being able to create variables)

var Person = function(firstAndLast) {
  this.getFullName = firstAndLast;

  this.getLastName = firstAndLast.slice(firstAndLast.lastIndexOf(" "), ).slice(1,)

  this.getFirstName = firstAndLast.slice(0 , firstAndLast.lastIndexOf(" "));


  this.setFullName = function(name){firstAndLast = name }

  this.setFirstName = function(first){
    //firstAndLast.replace((firstAndLast.slice(firstAndLast.lastIndexOf(" "), ).slice(1,)), first)
    firstAndLast = "first"
    };

  this.setLastName = function(last){(firstAndLast.slice(0 , firstAndLast.lastIndexOf(" "))) = last};
};

var bob = new Person('Bob Ross');
bob.setFirstName("Haskell")
bob.getFullName; // still Returns Bob Ross
12

If you have still questions on a particular challenge it works better if you keep asking in the same thread

Anyway, you should be creating methods, functions that can be called on an object, you are not doing that

Here you are changing firstAndLast to just the string "first"

As an hint, you could create a variable inside Person() where you could store the name and manipulate that one

You should be using bob.getFullName(), a method called on bob but with this you will get the alert that this is not a function so you may want to change how you are doing things

13

Ok, I thought exactly the contrary. (to have specific questions to threads).

I thought about the hint that you say But can I create a variable inside Person()? Since the test says “Object.keys(bob).length” should return 6 and they say to just populate the function with the 6 methods

14

There is no reason for which you shouldn’t be able to create a variable inside Person(), it sort of works like a private property if you use let

There is nothing in the challenge description that say that you can’t, it only say that one can access and change object properties with getters and setters only

15

To make things easier, I would recommend storing two variables inside Person(), namely firstName and lastName. You may find the .split() method useful for that:

16

Sorry I didn’t read the challenge instructions here. So, again, just to emphasise, this is a function. The function is going to return an object, and that object is going to have 6 properties, each of which is a function.

So if we ignored this syntax, it could look like:

function Person(firstAndLast) {
  return {
    getFirstName() { return ??? },
    setFirstName(name) { ??? },
    getLastName() { return ??? },
    setLastName(name) { ??? },
    getFullName() { return ??? },
    setFullName(name) { ??? },
  };
}

So you have a function which takes an input string, like “Bob Ross”, and returns an object with some functions that either modify that string or return bits of it.

For that to work, you need to hold on to the string that goes into the function. Which you do the same way you hold onto values anywhere else in JS. And because you want to update the names separately, maybe you want to hold onto two values rather than just one? Maybe that might help?

So once you have that, then what you do is either overwrite the value/s for set..., or return the value for get...

function Person(firstAndLast) {
  // Store the value/s here

  return {
    getFirstName() { return ??? },
    setFirstName(name) { ??? },
    getLastName() { return ??? },
    setLastName(name) { ??? },
    getFullName() {
      // Return the value/s here
    },
    setFullName(name) {
      // Change the value/s here
    },
  };
}

All the above will work fine, this isn’t necessary, but it’s a simple jump from the above to using this (this.getFirstName() etc.)

Edit: the other thread got merged in, so what was said there applies. I just want to emphasise you’re not using actual getters and setters, you’re just writing functions called getThing or setThing – if you Google getters and setters in JS and try to apply what you find you’re likely to get extremely confused

17

Yeah, I did some React tutorials in the past and now doing this challenge got me SOOO confused lol