Day 29 — week 5 (Tuesday)

Yesterday we started on Javascript, but before that we went over each other’s weekend challenges. The assignment was to build a Twitter clone. Even though the weather in London was amazing this weekend, everyone had done a really great job, and especially lots of creative styling made the reviews very enjoyable! I didn’t get to style my own very much, but I will work on that during this week — partly because this is the first fully functional application that I have ever build and I want to put it in my Github portfolio, and also because I want to get better at CSS and design in general. I will, of course, post a link to the application once it’s finished.

Before starting Maker’s I did the Codecademy track on Javascript, but all the Ruby we’ve been doing since then has made me not able to remember anything from that at all. However, it turns out picking up a new language isn’t too hard, and after just one month at Maker’s I’m really amazed of how quick I got an understanding of JS. Today, a lot of things clicked, and even though the syntax are quite different from Ruby, it wasn’t too hard to figure out how to work with it. Our first challenge was to build the FizzBuzz script again — just to get us familiar with the testing framework we’re gonna be using for Javascript which is called ‘Jasmin’. It’s quite similar to RSpec which is nice.

One important thing I learned today is the difference in how to write a class containing instance variables and instance methods in Javascript vs. Ruby. Ruby kind of nests all its properties and messages inside its class names and end keywords, where as Javascript doesn’t really care where you put them, as long as you refer to the class, or object, they belong to. Here is an example of a Person class in Javascript:

function Person(firstName, lastName) {   
this.firstName = firstName;
this.lastName = lastName;
}
Person.prototype.fullName = function() {
return this.firstName + " " + this.lastName;
}
var magnus = new Person("Magnus", "Holm");
magnus.fullName(); 

Despite the many parenthesises, curly brackets and semi colons, there are a few other important differences when comparing the code above to a similar class in Ruby:

class Person   
  attr_accessor :firstName, :lastName    
  def initialize(firstName, lastName)     
@firstName = firstName
@lastName = lastName
end
  def fullName     
@firstName + " " + @lastName
end
end
magnus = Person.new("Magnus", "Holm") 
magnus.fullName 

First of all, JS doesn’t have an initialize method — in order to call a method upon instantiation of the JS-object, you simply pass arguments into the class name — this is called a constructor method. Secondly, to make the properties accessible to instances of the class, you put this in front of them, which refers to the current object, and is instead of @ in Ruby. Lastly we have instance methods which in Javascript are defined as functions and has to be called on the class’s prototype property. In Ruby, you would assign your method name and block of code inside the def and end keywords instead, making the two versions a bit different, but easy enough to understand. Creating new instances of classes are quite similar in the two languages, and so is the way you call a method on on an instance as seen on the two last lines of the examples above.

What I learned today:

  • Basic Javascript syntax, i.e:
  • this keyword in JS
  • prototype keyword in JS
  • Basic testing in Jasmin

What I want to focus on tomorrow:

  • Learning more Javascript
  • Getting more familiar with Jasmin
  • Styling my Twitter-app
Show your support

Clapping shows how much you appreciated Magnus Holm’s story.