حقول Class العامة والخاصة

جزء من قسم Object Oriented Programming في رحلة JavaScript على Coddy — الدرس 18 من 56.

في فئات جافا سكريبت، يمكننا تعريف نوعين من حقول الفئات: public و private.

الحقول العامة يمكن الوصول إليها من خارج الفئة ويمكن استخدامها من قبل أي شخص.

قم بإنشاء فئة (class) تحتوي على حقول عامة (public fields):

class Student {
  name = '';
  grade = 0;
  
  constructor(name, grade) {
    this.name = name;
    this.grade = grade;
  }
}

أنشئ نسخة (instance) من الطالب:

const student = new Student('Alice', 95);

الوصول إلى الحقول العامة من خارج الفئة:

console.log(student.name); // الناتج: "Alice"
student.grade = 98;
console.log(student.grade); // الناتج: 98

يُشار إلى الحقول الخاصة بالرمز # ولا يمكن الوصول إليها إلا من داخل الفئة (class):

class Student {
  name = '';
  #grade = 0;
  
  constructor(name, grade) {
    this.name = name;
    this.#grade = grade;
  }
  
  getGrade() {
    return this.#grade;
  }
  
  updateGrade(newGrade) {
    this.#grade = newGrade;
  }
}

استخدام الحقول الخاصة:

const student = new Student('Bob', 87);
console.log(student.name); // المخرجات: "Bob"

// الوصول إلى الحقل الخاص باستخدام طريقة (method)
console.log(student.getGrade()); // المخرجات: 87

// تحديث الحقل الخاص باستخدام طريقة (method)
student.updateGrade(92);
console.log(student.getGrade()); // المخرجات: 92

// سيؤدي هذا إلى حدوث خطأ:
// console.log(student.#grade); // SyntaxError

التحدي

أضف حقلين إلى الفئة المسماة UserAccount:
1. حقل عام username
2. حقل خاص #password
أضف constructor يأخذ المعاملين username و password

ورقة مرجعية

تدعم فئات JavaScript الحقول العامة والخاصة.

يمكن الوصول إلى الحقول العامة من خارج الفئة:

class Student {
  name = '';
  grade = 0;
  
  constructor(name, grade) {
    this.name = name;
    this.grade = grade;
  }
}

const student = new Student('Alice', 95);
console.log(student.name); // المخرج: "Alice"
student.grade = 98;

تستخدم الحقول الخاصة الرمز # ولا يمكن الوصول إليها إلا من داخل الفئة:

class Student {
  name = '';
  #grade = 0;
  
  constructor(name, grade) {
    this.name = name;
    this.#grade = grade;
  }
  
  getGrade() {
    return this.#grade;
  }
  
  updateGrade(newGrade) {
    this.#grade = newGrade;
  }
}

const student = new Student('Bob', 87);
console.log(student.getGrade()); // المخرج: 87
student.updateGrade(92);
// student.#grade سيؤدي إلى حدوث SyntaxError

جرّب بنفسك

import { UserAccount } from './userAccount.js';

// كود اختبار - لا تقم بالتعديل
const user = new UserAccount("alice", "secret123");
console.log(user.username);          // يجب أن يخرج "alice"