Javascript

Javascript

If you think Javascript is similar to Java, C++ or Python, since they are called object-oriented programming languages, then you have to read this page.

I wrote this article after reading High Performance Javascript, Pro JavaScript Design Patterns and resources from website.

JS has several differences from the traditional object-oriented languages, which you have to understand clearly.

1. Flexibility and Dynamic
2. Object-Oriented in JS
3. Asynchronous Programming

This article can be considered as a beginner's guide, step by step, including a lot of coding examples. You can install nodejs to run those js code.

Flexibility and Dynamic

One of the most powerful features of Javascript is its flexibility. The language allows several different programming style. Programmer can write the code in functional style or in slightly more complex object-oriented style. Programmer does not need to specify the type of variable when they declare them, it is assigned during run-time. The attributes and methods of class and instance can be modified at run-time as well, which makes Javascript dynamic. You can not accomplish that in traditional object-oriented languages. Let's take a look at these features of Javascript through examples.

Simple functional Style

You can define an anonymous function and execute immediately by

(function(){
	var foo = 10;
	var bar = 2;
	console.log(foo * bar); // 20
})();

You also can define an anonymous function with arguments and execute immediately by

(function(foo, bar) {
	console.log(foo * bar); // 20
})(10,2);

You can define an anonymous function that returns a value by

var baz = (function(foo, bar) {
	return foo*bar; 
})(10,2);

console.log(baz); // 20

Scope, Nested Function and Closure

Variables can be called global variables, local variables, or others according to their scope in any languages. In Javascript, it has very interesting issues with scope.

1. Javascript has function level scope. This means a variable defined within a function is not accessible outside of it.
2. Javascript has lexcially level scope. This means functions run in the scope they are defined in, not the scope they are excuted in.

In this example, we define a nested the function in an anonymous function.

/* An anonymous function used as closure */
var baz;

(function() {
	var foo = 10;
	var bar = 2;
	baz = function() {
		return foo*bar;
	};
})();
/* 
function level scope
*/
try {
	console.log(foo); 
}
catch(err) {
	console.log(err); // [ReferenceError: foo is not defined]
}
try {
 	console.log(bar); 
}
catch(err) {
	console.log(err); // [ReferenceError: bar is not defined]
}
/*
lexcially level scope
*/
console.log(baz()); // 20

Loosely typed

Javascript is a loosely typed language, the type of variable is not define when it is declared, but when it is assigned value to.

console.log(typeof x); // undefined

var x;
console.log(typeof x); // undefined
console.log(x); // undefined

x = null;
console.log(typeof x); // object
console.log(x); //null

x = "hello";
console.log(typeof x); // string

x = 123;
console.log(typeof x); // number

x = 123.34;
console.log(typeof x); // number

x = true;
console.log(typeof x); // boolean

x = function(){};
console.log(typeof x); // function

Object-Oriented in JS

Interfaces

Encapsulation

Inheritance

Asynchronous Programming