Get in the right headspace

From Ruby to JavaScript — Switching Hats

Mitigate syntax, naming convention, and nomenclature errors.

Welcome to my new series “Switching Hats.” Created to be a quick read to bridge the gap before switching from writing Ruby into writing JavaScript or vice versa. This read is meant to help you avoid using Ruby syntax, naming conventions, casing practices, and nomenclature in your JavaScript code or the other way around.

Ruby + JavaScript Similarities

Mostly, (if not every) programming languages has some version of integers, floats, booleans, arrays, and hashes. Some programming languages differ on what to call hashes though, but Ruby and JavaScript seem to unanimously agree on these names.

(Python likes to refer to hashes as dictionaries)

Ruby + JavaScript Differences

Ruby and JavaScript and most other languages follow the same concepts. variables and constants to store information functions to encapsulate blocks of code you want to run, classes to create object templates for more semantic code to reference. Wile Ruby refers to blocks of callable code as Methods, JavaScript prefers to call them Functions. More syntactical differences between ruby and JavaScript are listed and described below.

Naming Conventions

Variables

When naming variables in Ruby, it is common practice to use “Snake Case”. which means you separate words with an underscore my_example = "string". Whereas JavaScript uses “Camel Case”. Which is the practice of capitalizing the first letter of each word EXCEPT the first word likeThisExample = “str”.

Constants

When declaring constants in Ruby there is no declarative word used so the common convention to just capitalize every word while still using snake_case EXAMPLE_ONE = "string". In JavaScript, there is a declarative word const, but we follow the exact same capitalization and snake casing convention as the Ruby example above.

Classes (Objects)

in both cases classes are considered constants because a class is like a template for objects to be created and referenced later so our template shouldn’t change but our attribute values will. in this special case both JavaScript and Ruby follow the same casing and naming convention. camelCase, BUT all constants should start with a capital letter as well MyClassNameExample.

Variables

Declaring a variable

Ruby:

variable_name = "this is my ruby string"

JavaScript:

var variableName = "This is my Javascript string"

Declaring a Javascript variable with var is not often used because declaring a variable this way creates a “global variable.” which is generally bad practice and usually means you need to refactor

More often, in best practices, you will declare a Javascript variable with let. This creates a variable within the current scope ( if you declare a let inside a function it will be only available within that function).

let variableName = "this is my javascript string"

Assigning new value

Both Ruby and JavaScript assign a new value to a variable the exact same way, but with the different naming conventions.

Ruby:

variable_name = "this is my NEW ruby string"

JavaScript:

variableName = "this is my NEW JavaScript string"

Methods => Functions

Ruby uses methods and JavaScript uses functions. Both function basically the same though (pun intended lol).

You can pass in arguments within the parentheses and call the function/method from within its scope.

To declare a Ruby method we use the def keyword

def my_method_name(arguments)
  #method body here
end
# or ------------------------
def myMethodName(args){
  #method body here
}

⚠️ (not best practice)
To declare JavaScript functions we use function declaratively.

function myFunctionName(args){
  //Function body here
}

✅(best practice)

const myFunctionName = (args) => {
  //Function body here
}

If StatementsIf Statements

Ruby and JavaScript if statements function basically the same. With slightly different syntax. You will see below in our Ruby example that it doesn’t require our comparative statement to be in parentheses, whereas our JavaScript code does.

Ruby:

if my_int <= 0
  # Do this
elsif my_int > 0
  # Do this instead
else
  # if all else fails do this
end 
  # don't forget your end keyword

JavaScript:

if (myInt <= 0){
  // Do this
} else if (myInt > 0){
  // Do this instead
} else {
  // If all else fails do this
}

Objects + Classes

Ruby:

class MyRubyClass
  #Class body here
end

(Notice in Ruby classes we are using the casing of declaring a constant. Starting with a capital letter and continuing with camel casing)

JavaScript:

class MyJavascriptClass{
  //Class body here
}

Initializers => Constructors

Ruby:

class MyRubyClass
  @@all = []
  def initialize(args)
    @name = args.name
    @@all.push(self)
  end
end

JavaScript:

class MyJavascriptClass{
  constructor(args) {
    this.name = args.name
    MyJavascriptClass.all.push(this)
  }
}
MyJavascriptClass.all = []

This should get your brain acclimated to the new coding environment you are switching to. Whether it be Ruby or JavaScript, your errors moving forward should be mitigated.

Thank you for reading Switching Hats!