Skip to content

6.1 Classes

Basic Class

Task 1: Create a constructor that creates user objects.

/*
let user = {
  firstName: null,
  lastName: null,
  email: null,
  username: null
};
*/

function UserConstr(fn, ln, e, un){
  this.firstName = fn;
  this.lastName = ln;
  this.email = e;
  this.username = un;
}

let user1 = new UserConstr("Nawras", "Ali", "nawras@mail.com", "nawras77");
let user2 = new UserConstr("Jad", "Fakhri", "jad@mail.com", "fakhri5");

console.log(user1);
console.log(user2);

The result is as follows:

UserConst {firstName: "Nawras", lastName: "Ali", email: "nawras@mail.com", username: "nawras77"}
UserConst {firstName: "Jad", lastName: "Fakhri", email: "jad@mail.com", username: "fakhri5"}

Task 2: Check the following code.

class User{
  /* Constructor */
  constructor(fn, ln, e, un){
    this.firstName = fn;
    this.lastName = ln;
    this.email = e;
    this.username = un;
  }
}

let user1 = new User("Nawras", "Ali", "nawras@mail.com", "nawras77");
let user2 = new User("Jad", "Fakhri", "jad@mail.com", "fakhri5");

console.log(user1);
console.log(user2);

The result is as follows:

User {firstName: "Nawras", lastName: "Ali", email: "nawras@mail.com", username: "nawras77"}
User {firstName: "Jad", lastName: "Fakhri", email: "jad@mail.com", username: "fakhri5"}

Task 3: Check the following code.

/*
let laptop = {
  processor: null,
  ram: null,
  storage: null
}
*/

class Laptop{
  /* Constructor */
  constructor(proc, ram, stg){
    this.processor = proc;
    this.ram = ram;
    this.storage = stg;
  }
}

let laptop1 = new Laptop("i5", "2GB", "0.5TB");
let laptop2 = new Laptop("i3", "2GB", "1TB");

console.log(laptop1);
console.log(laptop2);

The result is as follows:

Laptop {processor: "i5", ram: "2GB", storage: "0.5TB"}
Laptop {processor: "i3", ram: "2GB", storage: "1TB"}

Task 4: Create a class that creates epic objects.

/*
let epic = {
  name: null;
  author: null;
  language: null;
}
*/

class Epic{
  /*Constructor*/
  constructor(name, author, lang){
    this.name = name;
    this.author = author;
    this.language = lang;
  }
}

let epic1 = new Epic("Mahabharata", "Vyasa", "Sanskrit");
let epic2 = new Epic("Ramayana", "Valmiki", "Sanskrit");

console.log(epic1);
console.log(epic2);

The result is as follows:

Epic {name: "Mahabharata", author: "Vyasa", language: "Sanskrit"}
Epic {name: "Ramayana", author: "Valmiki", language: "Sanskrit"}

Task 5: Create a class that creates video objects.

/*
let video = {
  title: null,
  length: null,
  host: null,
  language: null,
  category: null
}
*/

class Video{
  /*Constructor*/
  constructor(title, len, h, lang, cat){
    this.title = title;
    this.length = len;
    this.host = h;
    this.language = lang;
    this.category = cat;
  }  
}

let video1 = new Video("Create a WordPress Theme", "30min", "Nawras Ali", "Arabic", "Education");

console.log(video1);

The result is: Video {title: "Create a WordPress Theme", length: "30min", host: "Nawras Ali", language: "Arabic", category: "Education"}

Task 6: Create a class that creates language objects.

/*
let language = {
  name: null,
  os: null,
  extension: null,
  stableRelease: null
}
*/

class Language{
  /* Constructor */
  constructor(name, os, ext, stableRel){
    this.name = name;
    this.os = os;
    this.extension = ext;
    this.stableRelease = stableRel;
  }
}

let lang1 = new Language("Python", "Linux, macOS, and Windows", "py", "3.8.3");
let lang2 = new Language("PHP", "Unix-like, Windows", "php", "7.4.10");

console.log(lang1);
console.log(lang2);

The result is as follows:

Language {name: "Python", os: "Linux, macOS, and Windows", extension: "py", stableRelease: "3.8.3"}
Language {name: "PHP", os: "Unix-like, Windows", extension: "php", stableRelease: "7.4.10"}

Task 7: Create a class that creates book objects.

/*
let book = {
  weight: null,
  pages: null
}
*/

class Book{
  /* Constructor */
  constructor(weight, pages){
    this.weight = weight;
    this.pages = pages;
  }
}

let book1 = new Book(0.2, 200);
console.log(book1);

The result is: Book {weight: 0.2, pages: 200}

Task 8: Create a class that creates phone objects.

/*
let phone = {
  os: null,
  ram: null,
  storage: null
}
*/

class Phone{
  /* Constructor */
  constructor(os, ram, stg){
    this.os = os;
    this.ram = ram;
    this.storage = stg;
  }
}

let phone1 = new Phone("Android", "2GB", "36GB");

console.log(phone1);

The result is: Phone {os: "Android", ram: "2GB", storage: "36GB"}

Task 9: Create a class that creates marker pens objects.

/*
let markerPen = {
  color: null,
  price: null
}
*/

class MarkerPen{
  /* Constructor */
  constructor(color, price){
    this.color = color;
    this.price = price;
  }
}

let markerPen1 = new MarkerPen("red", "2USD");
let markerPen2 = new MarkerPen("Blue", "2.2USD");

console.log(markerPen1);
console.log(markerPen2);

The result is as follows:

MarkerPen {color: "red", price: "2USD"}
MarkerPen {color: "Blue", price: "2.2USD"}

Task 10: Create a class that creates section objects.

/*
let section= {
  title: null,
  description: null
}
*/

class Section{
  /* Constructor */
  constructor(title, desc){
    this.title = title;
    this.description = desc;
  }
}

let section1 = new Section("JavaScript Basics", "Learn the basics of JavaScript in such a simple and easy way.");
let section2 = new Section("JavaScript Functions", "Introduction to JavaScript functions and closures.");
let section3 = new Section("JavaScript Arrays", "Learn about JavaScript arrays and array helpers.");

console.log(section1);
console.log(section2);
console.log(section3);

The result is as follows:

Section {title: "JavaScript Basics", description: "Learn the basics of JavaScript in such a simple and easy way."}
Section {title: "JavaScript Functions", description: "Introduction to JavaScript functions and closures."}
Section {title: "JavaScript Arrays", description: "Learn about JavaScript arrays and array helpers."}

Task 11: Create a class that creates song objects.

/*
let song = {
  title: null,
  artist: null,
  album: null
}
*/

class Song{
  /* Constructor */
  constructor(title, artist, album){
      this.title = title;
      this.artist = artist;
      this.album = album
  }
}

let song1 = new Song("Orobroy", "Dorantes", "PASSO A DUE");
console.log(song1);

The result is: Song {title: "Orobroy", artist: "Dorantes", album: "PASSO A DUE"}

Classes 1

A class is a template for creating objects. It includes all the properties that describe the created objects.


Class Methods

Task 12: Check the following code.

function UserConstr(fn, ln, e, un){
  this.firstName = fn;
  this.lastName = ln;
  this.email = e;
  this.username = un;
  this.fullName = function(){
    return this.firstName + " " + this.lastName;
  };
}

let user1 = new UserConstr("Nawras", "Ali", "nawras@mail.com", "nawras77");
let user2 = new UserConstr("Jad", "Fakhri", "jad@mail.com", "fakhri5");

console.log(user1.fullName());
console.log(user2.fullName());

The result is as follows:

Nawras Ali
Jad Fakhri

Task 13: Check the following code.

class User{
  /* Constructor */
  constructor(fn, ln, e, un){
    this.firstName = fn;
    this.lastName = ln;
    this.email = e;
    this.username = un;
  }
  /*Methods*/
  fullName(){
    return this.firstName + " " + this.lastName;
  }
}

let user1 = new User("Nawras", "Ali", "nawras@mail.com", "nawras77");
let user2 = new User("Jad", "Fakhri", "jad@mail.com", "fakhri5");

console.log(user1.fullName());
console.log(user2.fullName());

The result is as follows:

Nawras Ali
Jad Fakhri

Task 14: Check the following code.

class Laptop{
  /* Constructor */
  constructor(proc, ram, ar, stg){
    this.processor = proc;
    this.ram = ram;
    this.additionalRam = ar;
    this.storage = stg;
  }
  /*Methods*/
  totalRam(){
    return this.ram + this.additionalRam;
  }
}

let laptop1 = new Laptop("i5", 2, 4, "0.5TB");
let laptop2 = new Laptop("i3", 2, 8, "1TB");

console.log(laptop1.totalRam());
console.log(laptop2.totalRam());

The result is as follows:

6
10

Task 15: Add the info method to the following class.

/*
let epic = {
  name: null;
  author: null;
  language: null;
  info: function(){
    return `${this.name} was written by ${this.author} in the ${this.language} language`;
  }
}
*/

class Epic{
  /*Constructor*/
  constructor(name, author, lang){
    this.name = name;
    this.author = author;
    this.language = lang;
  }
  /*Methods*/
  info(){
    return `${this.name} was written by ${this.author} in the ${this.language} language`;
  }
}

let epic1 = new Epic("Mahabharata", "Vyasa", "Sanskrit");
let epic2 = new Epic("Ramayana", "Valmiki", "Sanskrit");

console.log(epic1.info());
console.log(epic2.info());

The result is as follows:

Mahabharata was written by Vyasa in the Sanskrit language
Ramayana was written by Valmiki in the Sanskrit language

Task 16: Add the lengthInMinutes method to the following class.

/*
let video = {
  title: null,
  length: null,
  lengthInMinutes: function(){
    return this.length / 60;
  }
}
*/

class Video{
  /*Constructor*/
  constructor(title, len, h, lang, cat){
    this.title = title;
    this.length = len;
  }  
  /* Methods */
  lengthInMinutes(){
    return this.length / 60;
  }
}

let video1 = new Video("Create a WordPress Theme", "3000");

console.log(video1.lengthInMinutes());

The result is: 50

Task 17: Add the lengthInHours method to the following class.

/*
let video = {
  title: null,
  length: null,
  lengthInMinutes: function(){
    return this.length / 60;
  },
  lengthInHours: function(){
    return this.length / 60 / 60;
  },  
}
*/

class Video{
  /*Constructor*/
  constructor(title, len, h, lang, cat){
    this.title = title;
    this.length = len;
  }  
  /* Methods */
  lengthInMinutes(){
    return this.length / 60;
  }
  lengthInHours(){
    return this.length / 60 / 60;
  }
}

let video1 = new Video("Create a WordPress Theme", "3000");

console.log(video1.lengthInHours());

The result is: 0.83

Task 18: Add the tenItemsPrice method to the following class.

/*
let markerPen = {
  color: null,
  price: null,
  tenItemsPrice: function(){
    return this.price * 10 - this.price;
  }
}
*/

class MarkerPen{
  /* Constructor */
  constructor(color, price){
    this.color = color;
    this.price = price;
  }
  /*Methods*/
  tenItemsPrice(){
    return this.price * 10 - this.price;
  }  
}

let markerPen1 = new MarkerPen("red", 2);
let markerPen2 = new MarkerPen("Blue", 2.2);

console.log(markerPen1.tenItemsPrice());
console.log(markerPen2.tenItemsPrice());

The result is as follows:

18
19.8

Task 19: Add the twentyItemsPrice method to the following class.

/*
let markerPen = {
  color: null,
  price: null,
  tenItemsPrice: function(){
    return this.price * 10 - this.price;
  },
  twentyItemsPrice: function(){
    return (this.price * 20) - (this.price * 2);
  }  
}
*/

class MarkerPen{
  /* Constructor */
  constructor(color, price){
    this.color = color;
    this.price = price;
  }
  /*Methods*/
  tenItemsPrice(){
    return this.price * 10 - this.price;
  }
  twentyItemsPrice(){
    return (this.price * 20) - (this.price * 2);
  }    
}

let markerPen1 = new MarkerPen("red", 2);
let markerPen2 = new MarkerPen("Blue", 2.2);

console.log(markerPen1.twentyItemsPrice());
console.log(markerPen2.twentyItemsPrice());

The result is as follows:

36
39.6

Task 20: Add the fiftyItemsPrice method to the following class.

/*
let markerPen = {
  color: null,
  price: null,
  tenItemsPrice: function(){
    return this.price * 10 - this.price;
  },
  twentyItemsPrice: function(){
    return (this.price * 20) - (this.price * 2);
  },
  fiftyItemsPrice: function(){
    return (this.price * 50) - 15;
  }   
}
*/

class MarkerPen{
  /* Constructor */
  constructor(color, price){
    this.color = color;
    this.price = price;
  }
  /*Methods*/
  tenItemsPrice(){
    return this.price * 10 - this.price;
  }
  twentyItemsPrice(){
    return (this.price * 20) - (this.price * 2);
  }  
  fiftyItemsPrice(){
    return (this.price * 50) - 15;
  }    
}

let markerPen1 = new MarkerPen("red", 2);
let markerPen2 = new MarkerPen("Blue", 2.2);

console.log(markerPen1.fiftyItemsPrice());
console.log(markerPen2.fiftyItemsPrice());

The result is as follows:

85
95

Classes 2

A class is a template for creating objects. It includes all the properties and the methods that describe the created objects.