Learn through your mistakes.

21·6 2016

I really blew the last assignment. Here's what I did, and how I changed up my code until I got it to work. I probably need to spend some more time creating exercises like this to really get this stuff in my head.

The assignment: Create 3 rabbit objects with adjective key values of fluffy, happy and sleepy. Easy, right?

function Rabbit(adjective) {
    this.adjective = adjective;
    this.describeMyself = function() {
        console.log("I am a " + this.adjective + " rabbit");
    };
}

// now we can easily make all of our rabbits

Attempt 1

rabbit1 = new Object();
rabbit1.adjective = "fluffy";
rabbit2 = new Object();
rabbit2.adjective = "happy";
rabbit3 = new Object();
rabbit3.adjective = "sleepy";
rabbits = rabbit1.newObject;
console.log(rabbits); // let's test this...

Big, Giant NOPE with undefined.

Attempt 2

Whoops, that's not how you create a new Rabbit object... Let's try that again, I can't be that stupid.

rabbit1 = new Rabbit("fluffy");
rabbit2 = new Rabbit("happy");
rabbit3 = new Rabbit("sleepy");

rabbits = rabbit1.Rabbit();
console.log(rabbits);

That's sure to work... TypeError: rabbit1.Rabbit is not a function. (In 'rabbit1.Rabbit()', 'rabbit1.Rabbit' is undefined) AAGH!

Attempt 3

Let's look at some old code... maybe I'm missing something.

Oh, wait... And to call the method, we use the syntax...

rabbit1 = new Rabbit("fluffy");
rabbit2 = new Rabbit("happy");
rabbit3 = new Rabbit("sleepy");

rabbits = rabbit1.Rabbit;

Yes, I did. Yes, I shouldn't have.

Attempt 4

So I followed instructions instead.

var rabbit1 = new Rabbit("fluffy");
var rabbit2 = new Rabbit("happy");
var rabbit3 = new Rabbit("sleepy");

console.log(rabbit1.describeMyself);
console.log(rabbit2.describeMyself);
console.log(rabbit3.describeMyself);

And

[Function]
[Function]
[Function]

What the!?!!

Attempt 5

Oh, of course... a function, gotta call the function.

var rabbit1 = new Rabbit("fluffy");
var rabbit2 = new Rabbit("happy");
var rabbit3 = new Rabbit("sleepy");

console.log(rabbit1.describeMyself());
console.log(rabbit2.describeMyself());
console.log(rabbit3.describeMyself());

And

I am a fluffy rabbit
undefined
I am a happy rabbit
undefined
I am a sleepy rabbit
undefined

Seriously!? What on ... oh, yes, don't call that console.log twice, maybe?

Attempt 6

This did it. Maybe I won't forget this time.

var rabbit1 = new Rabbit("fluffy");
var rabbit2 = new Rabbit("happy");
var rabbit3 = new Rabbit("sleepy");

rabbit1.describeMyself();
rabbit2.describeMyself();
rabbit3.describeMyself();

Victory!!!

Let's recap

// object constructor to create the Rabbit object with one parameter for the "adjective" key
function Rabbit(adjective) {
    // create a new key:value pair for this object matching the parameter fed into the constructor function
    this.adjective = adjective;
    // create a method function
    this.describeMyself = function() {
        log("I am a " + this.adjective + " rabbit");
    };
}

// now we can easily make all of our rabbits

// create our object(s) using our Rabbit constructor and our adjective parameter value
var rabbit1 = new Rabbit("fluffy");
var rabbit2 = new Rabbit("happy");
var rabbit3 = new Rabbit("sleepy");

// invoke the object method on our new object
rabbit1.describeMyself();
rabbit2.describeMyself();
rabbit3.describeMyself();

log(rabbit1)

You are here