console.log function

The console.log function is not actually a part of the JavaScript language itself.

Standard built-in objects

JavaScript has several objects included in its core, for example, there are objects like Math, Object, Array, and String.

The example below shows how to use the Math object to get a random number by using its random() method.

console.log(Math.random());

Standard objects (by category)

Value properties

Global properties returning a simple value.

• Infinity
• NaN
• undefined
• null literal

Function properties

Global functions returning the result of a specific routine.

• eval()
• uneval()
• isFinite()
• isNaN()
• parseFloat()
• parseInt()
• decodeURI()
• decodeURIComponent()
• encodeURI()
• encodeURIComponent()
• escape()
• unescape()

Fundamental objects

General language objects, functions and errors.

• Object
• Function
• Boolean
• Symbol
• Error
• EvalError
• InternalError
• RangeError
• ReferenceError
• SyntaxError
• TypeError
• URIError

Numbers and dates

Objects dealing with numbers, dates and mathematical calculations.

• Number
• Math
• Date

Text processing

Objects for manipulating texts.

• String
• RegExp

Indexed collections

Collections ordered by an index. Array-type objects.

• Array
• Int8Array
• Uint8Array
• Uint8ClampedArray
• Int16Array
• Uint16Array
• Int32Array
• Uint32Array
• Float32Array
• Float64Array

Keyed collections

Collections of objects as keys. Elements iterable in insertion order.

• Map
• Set
• WeakMap
• WeakSet

Structured data

Data buffers and JavaScript Object Notation.

• ArrayBuffer
• DataView
• JSON

Control abstraction objects

• Promise

Reflection

• Reflect
• Proxy

Internationalization

Additions to the ECMAScript core for language-sensitive functionalities.

• Intl
• Intl.Collator
• Intl.DateTimeFormat
• Intl.NumberFormat

Non-standard objects

• Generator
• Iterator
• ParallelArray
• StopIteration

Other

• arguments

Global Object

Global objects refer to objects in the global scope (but only if ECMAScript 5 strict mode is not used! Otherwise it returns undefined). The global object itself can be accessed by the this operator in the global scope. In fact, the global scope consists of the properties of the global object (including inherited properties, if any).

Other objects in the global scope are either created by the user script or provided by the host application. The host objects available in browser contexts are documented in the API reference.

Polymorphism

Poly means "many"  and morphism means "forms". Different classes might define the same method or property.

Abstraction

The conjunction of complex inheritance, methods, properties of an object must be able to simulate a reality model.

Encapsulation

A method of bundling the data and methods that use them together.

Inheritance

A class can inherit characteristics from another class.

Constructor

A method called at the moment of instantiation of an object. It usually has the same name as that of the class containing it.

Method

An object capability, such as walk. It is a subroutine or function associated with a class.

Property

An object characteristic, such as color.

Object

An Instance of a class.

In the example below we define a new class called Person.

var Person = function () {};

The object (class instance)

To create a new instance of an object obj we use the statement new obj, assigning the result (which is of type obj) to a variable to access it later. An alternative way to create an new instance is to use Object.create. This will create an uninitialized instance.

In the example above we define a class named Person. In the example below we create two instances (person1 and person2).

var person1 = new Person();
var person2 = new Person();

The Object.create() method creates a new object with the specified prototype object and properties.

Syntax

Object.create(proto[, propertiesObject])

Parameters

proto

The object which should be the prototype of the newly-created object.

propertiesObject

Optional.

Throws

Throws a TypeError exception if the proto parameter isn't null or an object.

Examples

Example: Classical inheritance with Object.create

Below is an example of how to use Object.create to achieve classical inheritance. This is for single inheritance, which is all that Javascript supports.

// Shape - superclass
function Shape() {
  this.x = 0;
  this.y = 0;
}

// superclass method
Shape.prototype.move = function(x, y) {
  this.x += x;
  this.y += y;
  console.info('Shape moved.');
};

// Rectangle - subclass
function Rectangle() {
  Shape.call(this); // call super constructor.
}

// subclass extends superclass
Rectangle.prototype = Object.create(Shape.prototype);
Rectangle.prototype.constructor = Rectangle;

var rect = new Rectangle();

console.log("Is rect an instance of Rectangle? " + (rect instanceof Rectangle)); // true
console.log("Is rect an instance of Shape? " + (rect instanceof Shape)); // true

rect.move(1, 1); // Outputs, 'Shape moved.'

If you wish to inherit from multiple objects, then mixins are a possibility.

function MyClass() {
  SuperClass.call(this);
  OtherSuperClass.call(this);
}

MyClass.prototype = Object.create(SuperClass.prototype); // inherit
mixin(MyClass.prototype, OtherSuperClass.prototype); // mixin

MyClass.prototype.myMethod = function() {
  // do a thing
};

The mixin function would copy the functions from the superclass prototype to the subclass prototype, the mixin function needs to be supplied by the user. An example of a mixin like function would be jQuery.extend.

Class

Defines the characteristics of the object. It is a template definition of variables and methods of an object.

The class

JavaScript is a prototype-based language which contains no class statement, such as is found in C++ or Java. This is sometimes confusing for programmers accustomed to languages with a class statement. Instead, JavaScript uses functions as classes. Defining a class is as easy as defining a function.

In the example below we define a new class called Person.

var Person = function () {};

Namespace

A namespace is a container which allows developers to bundle up all functionality under a unique, application-specific name. In JavaScript a namespace is just another object containing methods, properties and objects.

It is very important to note that there is no language-level difference between regular object and namespaces as there is in some other object-oriented languages.

The idea behind creating a namespace in JavaScript is simple: one global object is created and all variables, methods and functions become properties of that object. Use of namespaces also minimizes the possibility of name conflicts in an application.

Let's create a global object called MYAPP:

// global namespace
var MYAPP = MYAPP || {};

Here in above code sample we have first checked whether MYAPP is already defined (either in same file or in another file). If yes, then use the existing MYAPP global object, otherwise create an empty object called MYAPP which will encapsulate method, functions, variables and objects.

We can also create sub-namespaces:

// sub namespace
MYAPP.event = {};

Below is code syntax for creating namespace and adding variable, function and method:

// Create container called MYAPP.commonMethod for common method and properties
MYAPP.commonMethod = {
  regExForName: "", // define regex for name validation
  regExForPhone: "", // define regex for phone no validation
  validateName: function(name){
    // Do something with name, you can access regExForName variable
    // using "this.regExForName"
  },
 
  validatePhoneNo: function(phoneNo){
    // do something with phone number
  }
}

// Object together with the method declarations
MYAPP.event = {
    addListener: function(el, type, fn) {
    //  code stuff
    },
   removeListener: function(el, type, fn) {
    // code stuff
   },
   getEvent: function(e) {
   // code stuff
   }
  
   // Can add another method and properties
}

// Syntax for Using addListener method:
MYAPP.event.addListener("yourel", "type", callback);

Object-oriented programming

JavaScript is object-oriented to its core, with powerful, flexible OOP capabilities.

Object-oriented programming

Object-oriented programming is a programming paradigm that uses abstraction to create models based on the real world. It uses several techniques from previously established paradigms, including modularity, polymorphism, and encapsulation.

Object-oriented programming may be seen as the design of software using a collection of cooperating objects, as opposed to a traditional view in which a program may be seen as a collection of functions, or simply as a list of instructions to the computer. In OOP, each object is capable of receiving messages, processing data, and sending messages to other objects. Each object can be viewed as an independent little machine with a distinct role or responsibility.