JS vs Ruby

This week at DBC we started learning JavaScript. Just as we we're just getting up on our two legs, starting to walk and run for the first time in ruby, we regressed back into the crawling stages of JavaScript. Though similar to ruby in its OOP ways, JavaScript is different than ruby in many ways. One of the most powerful tools in JavaScript is the object. We're going to dive into that now.

I'm going to be brutally honest for a moment. I avoid using hashes in ruby at all costs. I know, not a good practice, but I find array's to be simpler, more concise, and I can keep track of the data easier in my head. So when I was introduced to the object in JavaScript, I thought to myself, "oh crap, more of this." But with more familiarity I have learned to enjoy the object more than the hash in ruby, and here's why.

An object contains a property and a property value. This can be compared to a hash in that it has a key(property) and value(property value). The difference (in what I gather thus far) is that objects are naturally a little easier to manipulate data.

In ruby, I think of arrays and hashes as containers that hold information. If you want to use a method, you have to use a ".method" on the container, but the two seem like two separate pieces. I'll create an object and a hash side by side to see the difference

(javascript object)

var menu = {
  appetizer: "salad",
  entree: "steak",
  desert: "chocalate mousse",
  cocktails: "margarita",
}

console.log(menu.entree); // =>steak
menu.entree = "salmon"
console.log(menu.entree); // => salmon
menu.soup = "seafood gumbo"
console.log(menu.soup); // => seafood gumbo
// or.......
console.log(menu["appetizer"]); // =>salad

-----------------
(ruby hash)

menu = {
  "appetizer" =>"salad",
  "entree" => "steak",
  "desert" => "chocalate mousse",
  "cocktails" => "margarita",

}

puts menu["appetizer"] # => salad
menu["appetizer"] = "ceviche"
puts menu["appetizer"] # => ceviche

Both have some real similarities, but I especially love that you can access the property value of an object with dot notation. It reminds me more of an "attr_reader" for a ruby class method. You can also change the value of a property the way an attr_writer works. Here we changed our menu to more of a seafood special, changing our entree to "salmon. You can also add new property's to the object with dot notation, for example we added a new property "soup" and gave it the property value of "seafood gumbo" with a simple dot notation. I find this a little easier to work with than the bracket notation in ruby.

Alright, here's a little challenge. Say you want to write a program that changes your menu every week. Look up to the object above, and notice that we have one property value in each property. Why not make it more? Objects can contain arrays and property values, so lets add some more dishes to our menu.

Now lets say we want to randomly select a dish each week. We can use this little piece of code to select a random element in an array: array[Math.floor(Math.random()*menu.desert.length)] This means, for array at index number[?] create a random number, multiply that by the length of the array, and round down to the nearest whole number, and give us back the element at that index number. Let's call this function four times and see what this month's menu will look like:

var menu = {
  appetizer: ['salad', 'ceviche', 'chips and guac'],
  entree: ['steak', 'salmon', 'chicken breast', ],
  desert:  ['apple pie', 'chocolate mousse', 'creme brule'],
  cocktails: ['gin and tonic', 'margarita', 'tom collins']
}

function changeMenu() {
  menu.entree = menu.entree[Math.floor(Math.random()*menu.entree.length)]
  menu.appetizer = menu.appetizer[Math.floor(Math.random()*menu.appetizer.length)]
  menu.desert = menu.desert[Math.floor(Math.random()*menu.desert.length)]
  menu.cocktails = menu.cocktails[Math.floor(Math.random()*menu.cocktails.length)]
}

// Week 1 Menu:
changeMenu();
console.log(menu);

//  => { appetizer: 'chips and guac',
//   entree: 'steak',
//   desert: 'apple pie',
//   cocktails: 'gin and tonic' }

// Week 2 Menu:
changeMenu();
console.log(menu);

// { appetizer: 'salad',
//   entree: 'salmon',
//   desert: 'apple pie',
//   cocktails: 'margarita' }

// Week 3 Menu:
changeMenu();
console.log(menu);

// => { appetizer: 'ceviche',
//   entree: 'chicken breast',
//   desert: 'chocolate mousse',
//   cocktails: 'margarita' }

// Week 4 Menu:
changeMenu();
console.log(menu);

// => { appetizer: 'ceviche',
//   entree: 'steak',
//   desert: 'creme brule',
//   cocktails: 'margarita' }

Pretty cool. I have found it a lot easier to manipulate objects than hashes. In a way object are like a hash and a class combined? - maybe that's a reach, but you get the idea...

The Ultimate Showdown: JavaScript vs Ruby

Objects & Hashes

Back to Blog Home