Friday, February 7, 2014

Powercord + Bad Memory = Two Trips/ Finally Using The 'This' Keyword

     I did it! I got the coffee, which saved my life, AND I got more of the JavaScript done than I said I was going to. It was very frustrating, but now I know how to use the <for/in> loop stuff. I think.Today, I finally get to see what the <this>  keyword does. I've seen it all over the place in other people's code, but I've never used it. So, now I finally get to learn about it. Today is Friday, so I'm at the coffee shop, for the second time... I got here, got some tea, because; I'm a rebel like that, aaaaand no power cord. Seriously. I can't believe that I forgot it; I was going to work without it, but my Chromebook was dead. So, I drank my tea in peace, and then I had to go all the way back home and get my power cord. I'm back now and jamming to the Foo Fighters thanks to +Tejas Richard . I've got four of their albums on random, so I should be good to go for a very long time. And now it's time to plug in and plug away!




HTML/CSS




      Today I'm getting my first real taste of CSS. Now to see that I can keep up. First, they're making sure I can do tables with HTML so that I can use the tables for pictures, I think. It would seem that I was right. I'm making a table of pictures that link to stuff. You know, <a href> and shtuff. So, now to do the nine cells in the table and get this thing imaged up! I now know something new. The image that you see when the picture hasn't loaded yet, or doesn't load, is the HTML bits doing their thing. Well, consider me impressed. Here is a page laid out with just HTML:

And here is the same thing except that this code(<link type="text/css" rel="stylesheet" href="stylesheet.css"/>) was added in. That's it. And you get this:
That is very cool! Not really sure how that all worked, so let's go study what they're telling me.  
     So, the stylesheet bit is actually referencing a page called stylesheet.css(it's one tab over from the one I'm working on.) I didn't see the tab that had all the CSS goodness. So, as I thought, the(<link type="text/css" rel="stylesheet" href="stylesheet.css"/>) bit was referencing the CSS tab not just one line of code that does amazing things. And I feel stupid for thinking that could ever be a thing. OK, so now that the confusion is out of the way...
      Time for a coffee break! Delicious delicious coffee. Yeah, I couldn't go without it.



JavaScript





     Now for that fabled <this> keyword does! According to the lesson:"The keyword this acts as a placeholder, and will refer to whichever object called that method when the method is actually used." That's clear enough, I suppose. So, to break it down even more for youse guise, here's an example of when to use the <this> keyword thingie:
// here we define our method using "this", before we even introduce bob
var setAge = function (newAge) {
  this.age = newAge;
};
// now we make bob
var bob = new Object();
bob.age = 30;
bob.setAge = setAge;

// make susan here, and first give her an age of 25
var susan= new Object();
susan.age=25;
susan.setAge=setAge;


// here, update Susan's age to 35 using the method
susan.setAge(35);
So, anything with the (.age) at the end of it, is going to be run through the setAge function(if you do things correctly/ you want them to connect) it will patch you through and you have the magic of <this>! pletty cool, eh? I sure thought so! Which is where I'm going to end this! I know, I know, why so little on the .js, Martin? Well, it's hard that's why! Well, that and it's Friday. I promise to have more next time. So, I'm going to go study some more and report more on Monday. Have a nice weekend, y'all!

--Martin