Lines of HTML/ Typeof For Your Noggin

In case you don't do much internet, you'll know that Texas got crazy ice and frozen stuff. Good thing I have no where to go! I'm going to stay inside and get some solid study time in! Also, I found out how to do lines! No, not cocaine, HTML! You just use <hr /> who knew! Well, obviously a lot of people do, so... I know now! yeah, that's better.

---

Heh. Lines.

---

Today's music is... Electro Chill. I know, not very informative, but that's pretty much what it is. Anyways, I'm cold. So, I'm going to make some coffee and get a sammich, or something and then I'm going to plug in and plug away!

JavaScript

---

      Today, we're doing fun with functions. I know; lame play on words. If you can even call it that. Blame the class. They're the ones that used it. AAANYhoo, Here's a little something for you:

/*Add a speak method to the Person constructor. Whenever speak is called, it should print "Hello!" to the console.*/

function Person(job, married) {
    this.job = job;
    this.married = married;
    // add a "speak" method to Person!
    this.speak = function(){
        console.log("Hello!");
    };
}

var user = new Person("Codecademy Student",false);
user.speak();

Now, here's the thing; not all of that code applies to what they wanted me to do, but I think I can point out where and why you need it. This code is called a Constructor and we have a Method inside of it. Notice that there is the new Peron and the user.speak. They just wanted me to add the speak part. The whole function applies to user, but when you call a specific section like user.speak, it doesn't matter what else you have wrong as long as what you're calling is correct. Everything else applies to the variable user, and if I was to call that and anything was wrong, I would get errors.

     Woah. That was crazy. I'm always amazed when I know what they're talking about in the lessons. I figured it out with the hint, and usually those things are no help at all. This time I got it! I'll count that as a victory for me.

     Well, that was just stupid. Apparently, the lesson has a bug, and the devs don't seem to care to fix it. The forum was filled with people that couldn't figure it out. So, I posted the working code that I found/figured out in the forum. Hopefully that'll help some people.  Definitely a WTF moment.

     And, last, but least, I leave with a new built-in operator. <typeof>  //angel voices
It's actually really helpful! Here's Mozilla's definition on it: "The typeof operator returns a string indicating the type of the unevaluated operand." Basically, if you don't know what type of code you're dealing with, you use typeof, and there you go! it'll tell you!

     There you have it, folks! a whole bunch of .js. for your noggin. I'm still getting through the HTML. The only new thing I've learned is the <hr /> thing that makes a line. I'll see y'all on Wednesday! Hopefully the ice will be gone.

--Martin

Relocating/#smh

      Right now it is 12:11 pm and the internet is out. Again. If it doesn't get fixed soon, I'm going to have to go to the coffee shop. I didn't really want to do that, but I gotta do my studies, man! I was able do get some studies done before, it went out, but not enough to really count for anything. I do know that I found some interesting things in one of the .js lessons, and I'll cover that later. Right now, I'm going to wait thirty minutes. If there's no WiFi by then, I'm outta here!
There is no WiFi. My life is empty and meaningless. Time to go to the coffee shop! For me, that’s twenty minutes. For you, it’s the next character over -> Someone has my chair. I’m not happy about this. The light is all wrong, the pillows are weird, there’s only one armrest, I sound like Sheldon Cooper! haha! I’ll wait until they leave, and then strike!

HTML/CSS

      Psuedo--class selectors; that's what I'm starting with today. Lesson people say: "A pseudo-class selector is a way of accessing HTML items that aren't part of the document tree (remember the tree structure we talked about earlier?). For instance, it's very easy to see where a link is in the tree. But where would you find information about whether a link had been clicked on or not? It isn't there!" Example: You know how when you click on something, it usually changes color like, blue to purple? That's what this is. And then there's the CSS thing where something changes when you hover over it:
a:hover {
color: #cc0000;
font-weight: bold;
text-decoration: none;
}       So, now that we have that weapon in our arsenal, let's take it to the battlefield; the console.
Alright, so now we have something to go with. Here's an e.g:
<!DOCTYPE html>
<html>
<head>
<link type="text/css" rel="stylesheet" href="stylesheet.css"/>
<title></title>
</head>
<body>
<div>
<a href = "https://www.google.com/">Google</a>
<a href = "https://www.yahoo.com/">Yahoo</a>
<a href = "https://www.bing.com/">Bing</a>
</div>
</body>
</html>
This looks just like regular HTML that has some links to some search engines. But when the CSS comes in, we get something else:
a:link{
    color:#008b45;
    text-decoration:none;
}
a:hover{
    color:#00ff00;
}
a:visited{
    color:#ee9a00;
}
If you want to test this out, go here. Unless you don't use Chrome. In that case go here follow the instructions, and then click the first link and be amazed. And with that, I'll leave this segment, and head over to the next.

JavaScript

      As I mentioned before, I found something interesting in my .js lessons. Yesterday, I was going over some lessons I'd already done. And realized something. I was looking at this code:

var bob = new Object();
bob.age = 30;
// this time we have added a method, setAge
bob.setAge = function (newAge){
  bob.age = newAge;
};

bob.getYearOfBirth = function () {
  return 2013 - bob.age;
};
console.log(bob.getYearOfBirth());

And I realized something. This section:

bob.setAge = function (newAge){
  bob.age = newAge;
};

is completely unnecessary! I took it out, and the lesson still worked! I seriously don't think these peopele really knew what they were doing. Their newer classes look better, but I think this one should still be in beta. Once I got past that I went on to the rest of the lessons. I'm still on the constructors because they're taking their time teaching this, which I'm totally OK with since they are difficult to learn. Here's what they said about constructors: "Constructors are a way to make objects with the keyword <new>. The most basic constructor is the <Object> constructor, which will make an object with no methods or properties."
     Ooooooh my. These people! Seriously shaking my head right now. I just passed my lesson using five different ways!! And most of them were just <undefined > or something similar. Which is just poop. There is no way that undefined is going to be ok in a real world situation. Here's the code:

function Rabbit(adjective) {
    this.adjective = adjective;
    this.describeMyself = function() {
        console.log("I am a " + this.adjective + " rabbit");
    };
}
var rabbit1 = new Rabbit("fluffy");
var rabbit2 = new Rabbit("happy");
var rabbit3 = new Rabbit("sleepy");
rabbit1.describeMyself();

At first, I tried to use <console.log> but apparently I was defining something wasn't there by using that, and then I tried a whole bunch of things, and they all passed, but I wasn't getting the return that I wanted. That's how I ended up with the code you see above. Kind of nifty. You just have to define a rabbit, and the words are already done. You don't have to write out each one, you just do it once! How neat!
Ok, this post is getting a little long here guys, so I'm going to call an end here. Remember to visit the links! Also, huzzah for beards.

--Martin

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