Intro to JavaScript

I talked about JavaScript briefly in my first post, but thought I would go into it more in-depth here.

JavaScript is what makes web pages dynamic. With only HTML and CSS, web pages would just be like static text documents. It allows you to dynamically update content, control multimedia, create animations and much more.

The programming language was created in 10 days, originally designed to create pop-ups and alert boxes in the browser. It was never expected to evolve into what it is now. It is now one of the most, if not the most, popular programming languages. Most employers list JavaScript as a required skill whether it be vanilla JavaScript, a frontend framework, or even server-side with Node.js. If you’re new to programming, there is good reason to pick up JavaScript as a first language and to add it to your arsenal if you’re an experienced programmer.

In this post, I hope to give an overview of the language. Also, JavaScript is not without its shortcomings so I will also talk about the good and the bad parts of the language.

What is JavaScript?

From one of Mozilla’s web docs:

JavaScript is a lightweight, interpreted, object-oriented language with first-class functions, and is best known as the scripting language for Web pages, but it’s used in many non-browser environments as well. It is a prototype-based, multi-paradigm scripting language that is dynamic, and supports object-oriented, imperative, and functional programming styles.

That is definitely a dense paragraph! Let’s explore some of these statements in more depth.

Interpreted

JavaScript is an interpreted programming language, meaning the instructions are not directly executed by the target machine. Instead, a different program, or interpreter, reads and executes the code.

In contrast, compiled languages like C++ and Go are converted directly into machine code that the processor can execute.

Object-oriented

Additionally, JavaScript is a language that supports object-oriented programming (OOP). Object-oriented programming is a paradigm where objects, blocks of code containing fields and methods, are used to build an application. Writing code in terms of objects makes it more readable, maintainable and can also make it easier to debug.

Let’s take a look at an example:

JavaScript OOP Example

Here we were able to create a Car class to represent a real-life car object. Later, if we need a more specific type of car in our application, we can extend the Car class. In this case, we created a Supercar object that inherits from Car. This means that it will have the make, model and year properties as well as the start() and toString() methods. Also, we were able to override the start() method to be a more powerful version for the Supercar. This results in maintainable and reusable code that is also easy for other developers to understand.

First-class Functions

JavaScript also has first-class functions. First-class functions are functions that can be treated like variables. This means they can be set to a variable, passed as function arguments, and be returned from functions. The benefit of this is that we are able to create a higher-level of abstraction and abstract the processing of data. This improves the quality of our code.

This is what first-class functions allow us to do in JavaScript:

First Class Functions Example

Scripting Language

JavaScript is a scripting language. This means that code is not compiled, rather, it is executed by the interpreter in the browser. JavaScript provides the high level instructions and the “heavy lifting” is done by the browser.

Server-side

Since JavaScript’s inception in 1995, and up until 2009, JavaScript only operated in the browser. Ryan Dahl invented Node.js in 2009, and this had a big impact on JavaScript and the future of web development. For the first time, back-end access to databases, file systems and servers could all be done in JavaScript. Entire web applications could now be built with one language. It is much more efficient to only have to be proficient in one language than having to know JavaScript and some other server-side language.

Prototype-based

JavaScript is one of the few mainstream prototype-based languages. A prototype-based language is one where there is not a distinction between classes and objects. There are just objects. In addition, there is the notion of prototypical objects that act a template for which properties can be inherited. Any object can be associated as the prototype for another object, allowing the second object to share the first object’s properties. This can be used to create more reusable, robust code.

Multi-paradigm

JavaScript is multi-paradigm, meaning it can be used to write in both object-oriented or procedural styles.

The Good Parts

There is a book that inspired these final sections, so if you would like to go more in depth, check out JavaScript: The Good Parts by Douglas Crockford.

  • First-class functions: To reiterate, first-class functions allow us to abstract the processing of data. OOP allows us to solve problems by writing code where we use objects to structure and organize our data. First-class functions allow us to accomplish the same thing, but in a more elegant way.
  • Loose-typing: Loosely typed languages are usually a lot faster and provide more flexibility; there is no overhead required for boxing and unboxing. However, they are also more error prone and can be more difficult the debug.
  • Dynamic objects: Dynamic objects are flexible. Properties do not need to be defined up front using a class structure like in other programming languages.  If it turns out we need to add an additional property, we can do so on the fly.
  • Object literal notation: Variables are defined globally in JavaScript. This can potentially create bugs and unexpected behavior in an application. To remedy this, object literals can be used to encapsulate properties and methods and prevent the global namespace from being cluttered. They also help to organize the codebase.

The Bad Parts

As I stated earlier, JavaScript was created in 10 days. And as you would imagine, there are some flaws in the language, and it is important to be aware of them.

  • Global variables: There is a global object in JavaScript that contains all of the properties and methods. This is problematic for multiple reasons. One issue is you have to make sure you remember every variable you define and not to accidentally re-declare it elsewhere. Also, any scripts you add to your project could potentially interfere with your own code if they named anything the same. Fortunately, with ES6, there are now alternative approaches to remedy this.
  • Prototypical Inheritance: While prototypical inheritance can be useful, in that class hierarchies don’t have to be created, it has its flaws. One problem is it is quite cumbersome to mimic private variables in other languages like C# or Java. Workarounds have to be created using closures. Also, there is no way to implement multiple inheritance.

Conclusion

To conclude, JavaScript is definitely unique compared to other programming languages. I had been working with Java for a while before I ever started using it. As I worked with it more, I discovered more and more unexpected behavior and had to develop a deeper understanding of the language. If you plan on using JavaScript (you definitely will if you do any type of web development), you will have to also to save yourself headaches and frustration. You cannot go wrong with learning it, it is in high demand and is not going away anytime soon.

I hope to dive deeper into JavaScript in future posts so stay tuned!

 

1 Trackback / Pingback

  1. Intro to React.js - Galen Casstevens

Comments are closed.