JavaScript: When the C language is made dynamic...

For programmers with experience in C, C++, Java or PHP this summary should be sufficient to master the JavaScript language and to use it for building dynamic web pages, or XUL user interfaces.

It should be noted some peculiarities:

Dynamic variables

Variables don't have a type defined at declaration. A variable is declared in a scope, local or global with the var keyword or with just an assignment:

var x = 1;
y = 2;

If we declare it in a function without the var keyword, it has the global scope and not internal to the function.

Operators and symbols come from the C language

And from C++ for objects.

// One-line comment (or at end of line).
/* */ Multi-lines comments or embedded into code.
  Blank spaces, tabs, newlines are not significant.
= Assignment operator.
+ Addition of numbers or concatenation of strings.
- * / % Other arithmetic operators.
% Modulus.
++ -- ++ (increment) -- (decrement).
+= Compound operators with = and + - etc...
== != < > <= >= Comparison operators are == (equal) != (not equal) > (greater than) < (less than).
=== Strict comparison. === (identical in value and type) !== (different in value or type).
&& Logical and.
|| Logical or.
! Not or annotation at end of line.
& | ^ ~ Binary operators: & (and) | (or) ^ (xor) ~ (binary not or complement).
<< >> Binary shift: << (shift left) >> (shift right) >>> (shift right remove sign).
{ } Encloses the body of a function or the content of an object.
[] Encloses the elements of a simple array or is used to subscript an array or a string.
" Single quotes and double quotes enclose a string, this makes no difference unlike PHP.
. Associates an object with an attribute or method.
:: Associates the name of a member to the name of a class.
in, this, new They are detailed below.
with Establishes a default object for a set of statements.

Arrays are dynamic objects

Arrays have one attribute, the length, and some methods including the constructor.
An array may be so declared:

arr = new Array(1000); // array with a length 1000.
arr = new Array(1,2,3); // array with three elements.
arr = [1,2, 3]; // the same array declared by assigning a literal.

An associative array is declared by assigning a list of pairs key-value:

arr = { "one": 1, "two": 2, "three": 3 }

To subscript an array, there are two syntaxes:

arr[x] // return the element at the x location
arr["x"] // return the value associated to the key "x" that is a string

When the string used as key is a numerical value, it is converted to a number. To keep it as a string, to be a key, you have to add a zero as prefix:

arr["01"]

returns the value associated to the key 01, not the element at indice 1.

Further elements are added to the top of the array by the push method.

arr.push("x");

Multi dimensional arrays are declared by embedding literal arrays into literal arrays as elements, or by associating a literal array to a key.

Control structures are those of C

These structures are identical to that of the C language plus one added to:

for .. in has been added to JavaScript:

for(var container in list) { ... statements ...}

The list may be an array or an object. In the case of an array, the variable is assigned the index of each item in turn (not the value). In the case of an object, it is assigned the name of each attribute in turn.

A for .. of control structure is defined in ECMAScript 6 to scan the values ​​of an array or object attributes.

Functions may be objects

A function declaration starts with the function keyword.

function funname(arguments)
{
  ...statements... 
  return x;
}

You can assign a function to a variable: 

var x = function(arguments) { ...statements... }

This is used to assign some processing to events.

The return statement returns a single value.
All arguments but objects are passed by value.

Objects are like functions and arrays

Objects are similar to associative arrays in JavaScript.
They are declared as arrays with a constructor or a literal. The literal has an associative form, keys are names of attributes and values are their initial values.

obj1 = { 'type' : "integer", "name" : "Object X", size : 11, ... }
x = obj1["name"] // this assigns the 'Object X' string to the x attribute

Objects are dynamic, attributes may be added to them dynamically. You can start with an empty object and add attributes and methods after:

obj1 = {}
obj1.myfunc = function() { }

The structure of objects is recursive, a value of an attribute may be another object.

A class is created by declaring a constructor

Classes are simulated in JavaScript by the means of constructors, and a constructor is a function. The this keyword identifies variables in the function as properties of the class.

function ClassA(x, y)
{
  this.propertyX = x;
  this.propertyY = y;
} 
       
obj1 = new ClassA(12, 34);  // instance        
obj1.propertyX = z;
obj1.properyZ = z; // adding dynamically a new attribute to the instance.

You can create an empty class and define all the attributes in a such manner.

A property may be deleted by the delete command, to complete the dynamic aspect of object in JavaScript.

delete obj1.propertyY;

Methods are inner functions in other functions

You can define functions inside functions and this gives methods to objects.

function ClassA
{
  this.methodA = function(x, y) { ...body... }
}

Example of declaration using a literal:

var ClassA = {
 name : "class A";
 type : 3;
 setName : function(n)
 { 
  this.name = n;
 }
}

Inheritance may be simulated

You can inherit members of a class by declaring a function that references the attributes of this base class or call its methods.

Exceptions are supported

The syntax comes from Java: 

try { ... } 
catch(exception-name) { ... } 
finally { ... }

You can omit the catch part or the finally part.

Regular expressions are part of the language

But they may be objects too.

A literal regular expression is defined without quotation marks in the form: 

/ x / y

where x is the expression and y a string of options.
The complete syntax is defined in the article on Regular Expressions.

References and complements

© 2006-2014 Xul.fr