Skip to content

4.16 Extra Practice

Warm-up

Task 1: Create a new object with the following key-value pairs.

/*
num1: 1
num2: 2
num3: 3
rest: (num1+num2)/num3
*/

var obj = {
  num1: 1,
  num2: 2,
  num3: 3,
  rest: function(){
    return (this.num1 + this.num2) / this.num3;
  }
};

console.log(obj);

The result is: {num1: 1, num2: 2, num3: 3, rest: ƒ}

Task 2: Refer to task 1; What is the value of num2 property?

var obj = {
  num1: 1,
  num2: 2,
  num3: 3,
  rest: function(){
    return (this.num1 + this.num2) / this.num3;
  }
};

console.log(obj.num2);

The result is: 2

Task 3: Refer to task 1; What is the constructor of obj?

var obj = {
  num1: 1,
  num2: 2,
  num3: 3,
  rest: function(){
    return (this.num1 + this.num2) / this.num3;
  }
};

console.log(obj.constructor);

The result is: ƒ Object() { [native code] }

Task 4: Refer to task 1; is obj an instance of Array constructor?

var obj = {
  num1: 1,
  num2: 2,
  num3: 3,
  rest: function(){
    return (this.num1 + this.num2) / this.num3;
  }
};

console.log(obj instanceof Array);

The result is: false

Task 5: Refer to task 1; what is the prototype of obj?

var obj = {
  num1: 1,
  num2: 2,
  num3: 3,
  rest: function(){
    return (this.num1 + this.num2) / this.num3;
  }
};

console.log(Object.getPrototypeOf(obj));
//or
//console.log(obj.__proto__);

The result is: {constructor: ƒ, defineGetter: ƒ, defineSetter: ƒ, hasOwnProperty: ƒ, lookupGetter: ƒ, …}

Task 6: Refer to task 1; create a constructor that creates obj-like objects.

function Obj(n1, n2, n3){
  this.num1 = n1;
  this.num2 = n2;
  this.num3 = n3;
  this.rest = function(){
    return (this.num1 + this.num2) / this.num3;
  };
}

var obj1 = new Obj(1, 2, 3);
console.log(obj1);

The result is: Obj {num1: 1, num2: 2, num3: 3, rest: ƒ}

Task 7: Refer to task 6; what is the prototype of Obj constructor?

function Obj(n1, n2, n3){
  this.num1 = n1;
  this.num2 = n2;
  this.num3 = n3;
  this.rest = function(){
    return (this.num1 + this.num2) / this.num3;
  };
}

console.log(Obj.prototype);

The result is: {constructor: ƒ}

Task 8: Refer to task 6; re-create Obj constructor, and delete rest method, and add this method to Obj.prototype.

function Obj(n1, n2, n3){
  this.num1 = n1;
  this.num2 = n2;
  this.num3 = n3;
}

Obj.prototype.rest = function(){
  return (this.num1 + this.num2) / this.num3;
};

var obj1 = new Obj(1, 2, 3);
console.log(obj1.rest());

The result is: 1

Task 9: Create a lessonPrototype object with the following key-value pairs.

/*
Object properties
title: null
section: null
course: null
difficultyLevel: null
*/

var lessonPrototype = {
  title: null,
  section: null,
  course: null,
  difficultyLevel: null
};

Task 10: Refer to task 9; create a new lesson object from lessonPrototype. Add the following values to the object properties.

/*
Object properties
title: "Prototypes"
section: "Section 4"
course: "JavaScript Course"
difficultyLevel: "Normal"
*/

var lessonPrototype = {
  title: null,
  section: null,
  course: null,
  difficultyLevel: null
};

var lesson1 = Object.create(lessonPrototype,{
  title: {
    value: "Prototypes"
    },
  section: {
    value: "Section 4"
    },
  course: {
    value: "JavaScript Course"
    },
  difficultyLevel: {
    value: "Normal"
  }
});

console.log(lesson1);

The result is: {title: "Prototypes", section: "Section 4", course: "JavaScript Course", difficultyLevel: "Normal"}

Task 11: Display key-value pairs of the object below.

var obj = {
  title: "Data Types",
  section: "Section 4",
  course: "JavaScript Course",
  difficultyLevel: "Normal"
};

for(prop in obj){
  console.log(`${prop}:${obj[prop]}`);
}

The result is as follows:

title:Data Types
section:Section 4
course:JavaScript Course
difficultyLevel:Normal

Object.entries()

Task 12: Refer to task 11; what is the result of Object.entries(obj)?

var obj = {
  title: "Data Types",
  section: "Section 4",
  course: "JavaScript Course",
  difficultyLevel: "Normal"
};

console.log(Object.entries(obj));

The result is as follows:

(4) [Array(2), Array(2), Array(2), Array(2)]
    0: (2) ["title", "Data Types"]
    1: (2) ["section", "Section 4"]
    2: (2) ["course", "JavaScript Course"]
    3: (2) ["difficultyLevel", "Normal"]
    length: 4
    __proto__: Array(0)

Task 13: Refer to task 12; display the elements of Object.entries()?

var obj = {
  title: "Data Types",
  section: "Section 4",
  course: "JavaScript Course",
  difficultyLevel: "Normal"
};

for(var el of Object.entries(obj)){
  console.log(el);
}

The result is as follows:

(2) ["title", "Data Types"]
(2) ["section", "Section 4"]
(2) ["course", "JavaScript Course"]
(2) ["difficultyLevel", "Normal"]

Object.entries()

Object.entries() returns an array of key-value pairs of an object. Each key-value pair is also an array.

Since Object.entries() returns an array, you can list the elements of this array using for...of loop.


Object.keys()

Task 14: Display the keys of the object below.

var obj = {
  title: "Data Types",
  section: "Section 4",
  course: "JavaScript Course",
  difficultyLevel: "Normal"
};

for(var prop in obj){
  console.log(prop);
}

The result is as follows:

title
section
course
difficultyLevel

Task 15: Refer to task 14; what is the result of Object.keys(obj)?

var obj = {
  title: "Data Types",
  section: "Section 4",
  course: "JavaScript Course",
  difficultyLevel: "Normal"
};

console.log(Object.keys(obj));

The result is: (4) ["title", "section", "course", "difficultyLevel"]

Task 16: Refer to task 15; display the elements of Object.keys()?

var obj = {
  title: "Data Types",
  section: "Section 4",
  course: "JavaScript Course",
  difficultyLevel: "Normal"
};

for(var key of Object.keys(obj)){
  console.log(key);
}

The result is as follows:

title
section
course
difficultyLevel

Object.keys()

Object.keys() returns an array of a given object's keys.

Since Object.keys() returns an array, you can list the elements of this array using for...of loop.


Object.values()

Task 17: Display the values of the object below.

var obj = {
  title: "Data Types",
  section: "Section 4",
  course: "JavaScript Course",
  difficultyLevel: "Normal"
};

for(var prop in obj){
  console.log(obj[prop]);
}

The result is as follows:

Data Types
Section 4
JavaScript Course
Normal

Task 18: Refer to task 17; what is the result of Object.values(obj)?

var obj = {
  title: "Data Types",
  section: "Section 4",
  course: "JavaScript Course",
  difficultyLevel: "Normal"
};

console.log(Object.values(obj));

The result is: (4) ["Data Types", "Section 4", "JavaScript Course", "Normal"]

Task 19: Refer to task 18; display the elements of Object.values()?

var obj = {
  title: "Data Types",
  section: "Section 4",
  course: "JavaScript Course",
  difficultyLevel: "Normal"
};

for(var value of Object.values(obj)){
  console.log(value);
}

The result is as follows:

Data Types
Section 4
JavaScript Course
Normal

Object.values()

Object.values() returns an array of a given object values.

Since Object.values() returns an array, you can list the elements of this array using for...of loop.