٤.١٦ تدريبات إضافية

تمهيد

التمرين 1: أنشئ كائنًا بأزواج المفاتيح والقيم التالية.

/*
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);

النتيجة هي: {num1: 1, num2: 2, num3: 3, rest: ƒ}

التمرين 2: ارجع إلى التمرين 1؛ ما قيمة num2 ؟

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

console.log(obj.num2);

النتيجة هي: 2

التمرين 3: ارجع إلى التمرين 1؛ ما الدالة البانية لـ obj?

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

console.log(obj.constructor);

النتيجة هي: ƒ Object() { [native code] }

التمرين 4: ارجع إلى التمرين 1؛ هل obj نسخة من Array ؟

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

console.log(obj instanceof Array);

النتيجة هي: false

التمرين 5: ارجع إلى التمرين 1؛ ما النموذج الأولي لـ 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__);

النتيجة هي: {constructor: ƒ, defineGetter: ƒ, defineSetter: ƒ, hasOwnProperty: ƒ, lookupGetter: ƒ, …}

التمرين 6: ارجع إلى التمرين 1؛ أنشئ بانيًا ينتج كائنات مشابهة لـobj.

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);

النتيجة هي: Obj {num1: 1, num2: 2, num3: 3, rest: ƒ}

التمرين 7: ارجع إلى التمرين 6؛ ما النموذج الأولي لـ Obj ؟

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);

النتيجة هي: {constructor: ƒ}

التمرين 8: ارجع إلى التمرين 6؛ أعد إنشاء Obj ، واحذف rest طريقةً منه، ثم أضفها إلى 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());

النتيجة هي: 1

التمرين 9: أنشئ lessonPrototype كائنًا بأزواج المفاتيح والقيم التالية.

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

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

التمرين 10: ارجع إلى التمرين 9؛ أنشئ كائن درس جديدًا من lessonPrototype، وأضف القيم التالية إلى خصائصه.

/*
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);

النتيجة هي: {title: "Prototypes", section: "Section 4", course: "JavaScript Course", difficultyLevel: "Normal"}

التمرين 11: اعرض أزواج مفاتيح الكائن وقيمه.

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

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

النتيجة كما يلي:

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

---

Object.entries()

التمرين 12: ارجع إلى التمرين 11؛ ما نتيجة Object.entries(obj)?

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

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

النتيجة كما يلي:

(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)

التمرين 13: ارجع إلى التمرين 12؛ اعرض عناصر 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);
}

النتيجة كما يلي:

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

Object.entries()

Object.entries() تُرجع مصفوفة بأزواج المفاتيح والقيم للخصائص الخاصة القابلة للتعداد، وكل زوج مصفوفة أيضًا.

بما أن Object.entries() تُرجع مصفوفة، يمكنك عرض عناصرها باستخدام for...of .

---

Object.keys()

التمرين 14: اعرض مفاتيح الكائن التالي.

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

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

النتيجة كما يلي:

title
section
course
difficultyLevel

التمرين 15: ارجع إلى التمرين 14؛ ما نتيجة Object.keys(obj)?

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

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

النتيجة هي: (4) ["title", "section", "course", "difficultyLevel"]

التمرين 16: ارجع إلى التمرين 15؛ اعرض عناصر 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);
}

النتيجة كما يلي:

title
section
course
difficultyLevel

Object.keys()

Object.keys() تُرجع مصفوفة بمفاتيح الخصائص الخاصة القابلة للتعداد.

بما أن Object.keys() تُرجع مصفوفة، يمكنك عرض عناصرها باستخدام for...of .

---

Object.values()

التمرين 17: اعرض قيم الكائن التالي.

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

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

النتيجة كما يلي:

Data Types
Section 4
JavaScript Course
Normal

التمرين 18: ارجع إلى التمرين 17؛ ما نتيجة Object.values(obj)?

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

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

النتيجة هي: (4) ["Data Types", "Section 4", "JavaScript Course", "Normal"]

التمرين 19: ارجع إلى التمرين 18؛ اعرض عناصر 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);
}

النتيجة كما يلي:

Data Types
Section 4
JavaScript Course
Normal

Object.values()

Object.values() تُرجع مصفوفة بقيم الخصائص الخاصة القابلة للتعداد.

بما أن Object.values() تُرجع مصفوفة، يمكنك عرض عناصرها باستخدام for...of .