Archive

Month: January 2013

JavaScript Variable Scope and Hoisting Explained

avatar
·January 31, 2013

In this post, we will learn JavaScript’s variable scope and hoisting and all the idiosyncrasies of both.

We must understand how variable scope and variable hoisting work in JavaScript, if want to understand JavaScript well. These concepts may seem straightforward; they are not. Some important subtleties exist that we must understand, if we want to thrive and excel as JavaScript developers.

Variable Scope
A variable’s scope is the context in which the variable exists. The scope specifies from where you can access a variable and whether you have access to the variable in that context.

[sc:mongodb-book]

Variables have either a local scope or a global scope.

Local Variables (Function-level scope)
Unlike most programming languages, JavaScript does not have block-level scope (variables scoped to surrounding curly brackets); instead, JavaScript has function-level scope. Variables declared within a function are local variables and are only accessible within that function or by functions inside that function. See my post on Closures for more on accessing variables in outer functions from inner functions.

Read more

JavaScript Objects in Detail

avatar
·January 27, 2013

JavaScript’s core—most often used and most fundamental—data type is the Object data type. JavaScript has one complex data type, the Object data type, and it has five simple data types: Number, String, Boolean, Undefined, and Null. Note that these simple (primitive) data types are immutable (cannot be changed), while objects are mutable (can be changed).

[sc:mongodb-book]

What is an Object
An object is an unordered list of primitive data types (and sometimes reference data types) that is stored as a series of name-value pairs. Each item in the list is called a property (functions are called methods).

Consider this simple object:

var myFirstObject = {firstName: "Richard", favoriteAuthor: "Conrad"};

Think of an object as a list that contains items, and each item (a property or a method) in the list is stored by a name-value pair. The property names in the example above are firstName and favoriteAuthor. And the values are “Richard” and “Conrad.”

Read more

JavaScript Prototype in Plain Language

avatar
·January 25, 2013

Prototype is a fundamental concept that every JavaScript developer must understand, and this article aims to explain JavaScript’s prototype in plain, detailed language. If you don’t understand JavaScript’s prototype after reading this blog post, please ask questions in the comments below. I will personally answer all questions.

To understand prototype in JavaScript you must understand objects in JavaScript. If you aren’t already familiar with objects, you should read my post JavaScript Objects in Detail. Also, know that a property is simply a variable defined on a function.

There are two interrelated concepts with prototype in JavaScript:

  1. First, every JavaScript function has a prototype property (this property is empty by default), and you attach properties and methods on this prototype property when you want to implement inheritance. This prototype property is not enumerable; that is, it isn’t accessible in a for/in loop. But Firefox and most versions of Safari and Chrome have a __proto__ “pseudo” property (an alternative syntax) that allows you to access an object’s prototype property. You will likely never use this __proto__ pseudo property, but you should know that it exists and it is simply a way to access an object’s prototype property in some browsers.

    The prototype property is used primarily for inheritance; you add methods and properties on a function’s prototype property to make those methods and properties available to instances of that function.

Read more

Pilgrimage to JavaScript Mastery

avatar
·January 20, 2013

(From Absolute Beginner to Attainment)

Join me as we embark on a pilgrimage to JavaScript mastery—where the eminent few reside in a consciousness of JavaScript enlightenment and programming prominence. This mastery is a state of mindfulness that such experts as Douglas Crockford, John Resig, and Nicholas Zackas, amongst others, possess, and it is this state we are destined for, even as we have no assurance we will arrive there and it is unlikely we will ever get there.

Yes, we will endure inevitable bugs, tireless frustrations, ever-changing frameworks, and unknown circumstances that we must debug and resolve. But we are guaranteed insightful discoveries, euphoric accomplishments, and technical scholarship while on this pilgrimage. And even though we may never experience JavaScript enlightenment quite like Crockford and Zakas, we will be better programmers, accomplished developers, and perhaps successful entrepreneurs along the way.

On this pilgrimage, we will learn mostly from books (that we should each own) by Nicholas C. Zakas, David Flanagan, David Herman (new author), Douglas Crockford, and others, and from outstanding blog posts by prolific JavaScript bloggers like Addy Osmani.

Our journey has just begun; everyone is invited to join anytime. We have already learned JavaScript properly and Backbone.js completely, but we have much to learn. We will thoroughly understand sixteen JavaScript concepts that we must know well, and we will continue to learn scores of advanced JavaScript topics and modern JavaScript frameworks along the way.

Read more

Learn Backbone.js Completely

avatar
·January 14, 2013

(More Than Just a Complete Backbone.js Tutorial)

Duration: 25 to 30 hours
Prerequisite: JavaScript knowledge of 5/10

Below, I provide you with a comprehensive study guide that I myself have used (indeed, I have refined it for this article) to learn Backbone.js properly. This study guide should take just about 30 hours to complete.

[sc:mongodb-book]

After I learned Backbone.js, the first application I built was an eCommerce web application for a client—a startup. I built the entire app, including the shopping cart, with Backbone.js and Node.js.

Backbone.js Is Friendly
Backbone.js is neither difficult to learn nor difficult to use, and the time you will spend learning to use this serviceable framework will be well worth it, for you will learn how to use one of the most popular front-end frameworks and learn how to build modern web applications on the front end. In addition, you will see your market value as a JavaScript developer rise, since Backbone.js developers are in high demand.

Before we Continue
I should note that Angular.js and Ember.js are robust and feature-rich front-end frameworks that offer more than Backbone.js, and they allow you to develop applications with less code than Backbone.js. Nonetheless, I still think developers should learn Backbone.js first, particularly because it is easier to learn and provides you with a solid understanding of what a JavaScript framework is and how a JavaScript framework functions.

Read more
Close