JavaScript: A Programming Language for Modern Times

Software development is a growing field. More people are contemplating a career in software development because of its diversity, flexibility, creativity, and demand. The first step in becoming a software developer is choosing a programming language. Multi-purpose languages such as Java, Python, C++, Go, and JavaScript, are popular and in demand. This article will focus on JavaScript.

What is JavaScript?

JavaScript is a dynamic, scripting programming language. An alternate name for JavaScript is ECMAScript. Its low learning curve makes it the most popular language for web development. JavaScript was created to add interactivity to static websites but has since evolved into a multi-purpose language. Additional uses of JavaScript are API, game, and backend development.

Is JavaScript object-oriented?

In the traditional sense JavaScript is not object-oriented. Although JavaScript is a prototype-based programming language, it supports object-oriented programming. Classic object-oriented languages use classes and objects. Objects are created by instantiating classes.
JavaScript uses a class keyword and objects. JavaScript classes are prototypes with a constructor method; it creates objects by abstraction.
Object-oriented features in JavaScript include:

Class

Class are prototypes for objects. Classes must contain a constructor. An example of a JavaScript class is:

1
2
3
4
5
6
7
8
9
10
class LearnJS {
  constructor(question, answer) {
    this.question = question;
    this.answer = answer;
  }
}

const theQuestion = "Do you want to learn JavaScript?";
let theAnswer = "Yes!";
const myAnswer = new LearnJS(theQuestion, theAnswer);

Encapsulation

Encapsulation is the process of binding data to functions using the data. Encapsulation hides the implementation and restricts access to data objects in a class. An example of encapsulation is:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
class ChallengeInformation {
  constructor() {
    var challengeName;
    var challengePrize;
  }
  getChallengeName() {
    return this.challengeName;
  }
  getChallegePrize() {
    return this.challengePrize;
  }
  setChallengeName() {
    this.challengeName = challengeName.
  }
  setChallengePrize() {
    this.challengPrize = challengePrize;
  }
}

var challenge = new ChallengeInformation();
challenge.setChallengeName("Create Mobile Web Application");
challenge.setChallengePrice(500);

Polymorphism

Polymorphism reusing a section of code or method multiple times. An example of polymorphism using the ChallengeInformation class is:

1
2
3
4
5
6
var designChallenge = new ChallengeInformation();
designChallenge.setChallengeName(“Design a Mobile Website”);
designChallenge.setChallengePrize(750);
var qaChallenge = new ChallengeInformation();
qaChallenge.setChallengeName(“Regression Test a Mobile Web Application”);
qaChallenge.setChallengePrize(300);

Inheritance

Inheritance is creating a class of another class using the ‘extends’ keyword. The new class inherits all the methods of the extending class. An example of inheritance using the ChallengeInformation class is:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
 class ChallengeInformation {
   constructor() {
     var challengeName;
     var challengePrize;
   }
   getChallengeName() {
     return this.challengeName;
   }
   getChallegePrize() {
     return this.challengePrize;
   }
   setChallengeName() {
     this.challengeName = challengeName;
   }
   setChallengePrize() {
     this.challengPrize = challengePrize;
   }
 }

 class MemberChallenges extends ChallengeInformation {
   constructor(memberHandle, memberName) {
     this.memberHandle = memberHandle;
     this.memberName = memberName;
   }
 }

What is a callback function in JavaScript?

A callback function takes another function as a parameter. The two types of callback functions are synchronous and asynchronous. Synchronous callbacks are functions that are executed immediately without delay. Below is an example of a synchronous callback.

1
2
3
4
5
6
7
8
9
10
function calculateTaxes(cost, rate) {
  return cost * rate;
}

function purchaseTotal(price, rate, callback) {
  return price + callback(price, rate);
}

var totalCost = purchaseTotal(24.7, 0.0636, calculateTaxes);
console.log("The price with taxes included is $ " + totalCost);

Asynchronous callbacks are functions that wait until a block of code completes before executing. Below is an example of an asynchronous callback.

1
2
3
4
5
6
7
8
9
10
11
12
13
 function calculateTaxes(cost, rate) {
   return cost * rate;
 }

 function purchaseTotal(price, rate, callback) {
   setTimeout(() => {
     console.log("I am waiting 5 seconds before printing the price");
     console.log("The price before taxes is $" + price + ".");
   }, 5000);
   return price + callback(price, rate);
 }
 var totalCost = purchaseTotal(24.7, 0.0636, calculateTaxes);
 console.log("The price with taxes included is $ " + totalCost);

What is a method in JavaScript?

In JavaScript, a method is a function associated with an object. Methods perform a task on an object. The most common method types in JavaScript are object methods and built-in methods. Object methods are accessed by creating an instance of the object and appending the method name using the dot operator (see the example below).
Built-in methods are a part of the JavaScript language. They perform tasks on built-in objects such as date, string, math, and array. Examples of static built-in methods are:

• Array.from() – creates a new array instance of the arguments.

• Array.isArray() – checks to see if the element is an array.

• Array.of() – creates an array from the given argument list.

• Math.abs(x) – returns the absolute value of the number.

• Math.ceil(x) – returns a rounded-up value greater than or equal to the number.

• Math.exp(x) – returns the natural logarithmic of a number.

• Date.now() – returns the current time in milliseconds.

• Date.UTC() – returns the UTC date and time.

What are functions in JavaScript?

Functions are lines of code that perform a task. JavaScript functions are objects because they have methods and properties. There are several different ways to create functions in JavaScript.
Function declaration

The function declaration uses the function keyword followed by the name of the function and the parameters, if any. An example of a function declaration is:

1
2
3
 function cubic(x) {
   return x * x * x;
 }

Function expression

The function expression, like the function declaration, uses the function keyword. The name of the function and parameters are optional. A variable name is assigned the function expression (see below).

1
2
3
 var power = function cubic(x) {
   return x * x * x;
 }

Arrow function expression

Arrow functions are functions that use short syntax without a function name. Like a function expression, it has a variable name. An arrow points to the function body. The above example rewritten as an arrow function is:
var power = (x) => x * x * x;

Anonymous functions

Anonymous functions are functions with the function keyword but do not have a function name. Arrow functions are a type of anonymous function. An example of an anonymous function is:

1
2
3
 var power = function (x) {
   return x * x * x;
 }

What is null in JavaScript?

Null is a primitive data type that intentionally declares a variable with no value. In Boolean operations, null is considered falsy. Null is sometimes mistakenly used interchangeably with undefined. Although undefined is also a primitive data type, it refers to a value that does not exist.

What is string in JavaScript?

String is a built-in JavaScript object used to represent a sequence of characters. Strings are formed by enclosing characters in either single or double quotes. Numbers, symbols, and special characters enclosed in quotes are also strings. There are different types of strings: primitives, objects, and literals.
Primitive strings
Primitive strings are strings created by combining characters in quotes. An example of primitive strings is:

1
2
3
const astring = "Today is a great day!";
const astring2 = "This is the first day of spring";
const astring3 = 'January 1st is a global holiday';

String objects

Strings objects are strings created using the new keyword (see below).

const ostring = new String("Another way to make a string!");

String objects are not the same as primitive strings. The eval() function returns a number for primitive strings and a string for string objects.

String literals

String literals in JavaScript are template strings. String literals are characters enclosed in back-tics instead of quotes. Back-tics make it easy to include quotes in the string.

1
const lstring = `"Practice makes perfect" is a good quote.`;

String literals also allow the creation of multiline strings, interpolation, and substitution.

String methods

JavaScript strings are immutable. After creating a string, it cannot be modified or changed. String methods perform operations on strings by creating a new string. Frequently used methods are:

• split() – splits the string into an array.

• substring() – returns the characters between the given indexes.

• toUpperCase() – converts all characters in the string to uppercase.

• toLowerCase() – converts all characters in a string to lowercase.

• slice() – returns a part of the string at the given index.

• charAt() – returns the character at the given index.

• concat() – combines two or more strings

• indexOf() – locates the index of a given character. Returns -1 if the character is not in the string.

• replace() – replaces a matched substring with a substring.

• toString() – changes an object to a string.

Conclusion

JavaScript was created to add interactivity to websites but has grown into a multipurpose programming language. Its low learning curve makes JavaScript a good choice for beginners. To learn more about JavaScript features and syntax, visit the Mozilla website - https://developer.mozilla.org/en-US/docs/Web/JavaScript.