جافا سكريبت تحليل مفصل موجه للكائنات لواصفات الخصائص

تقدم لك هذه المقالة المعرفة ذات الصلة بجافا سكريبت، والتي تقدم بشكل أساسي المشكلات ذات الصلة بالكائنات، بما في ذلك واصفات السمات، واصفات البيانات، واصفات الوصول، وما إلى ذلك. دعونا نلقي نظرة عليها معًا، وآمل أن تكون مفيدة للجميع.

[توصيات ذات صلة: فيديو تعليمي لجافا سكريبت، واجهة الويب الأمامية]

جافا سكريبت كائنية التوجه - واصفات الخصائص

تدعم JavaScript في الواقع مجموعة متنوعة من نماذج البرمجة، بما في ذلك البرمجة الوظيفية والبرمجة الموجهة للكائنات:

• تم تصميم الكائنات في JavaScript كمجموعة غير مرتبة من السمات ، مثل جدول الهيب هوب، الذي يتكون من المفاتيح والقيم؛

• المفتاح هو اسم معرف، ويمكن أن تكون القيمة من أي نوع، أو نوع كائن أو وظيفة أخرى؛

• إذا كانت القيمة دالة، فيمكننا أن نسميها طريقة للكائن ؛

1. كيفية إنشاء كائن؟

• الطريقة الأكثر شيوعًا لإنشاء الكائنات في الأيام الأولى هي استخدام فئة الكائن، واستخدام الكلمة الأساسية الجديدة لإنشاء كائن، ثم تخزين الخصائص أو الأساليب في الكائن:

 فار obj = كائن جديد ()
obj.name = "لماذا"
console.log(obj.name, obj) // لماذا { الاسم: 'لماذا' }

• في وقت لاحق، من أجل الراحة، قام العديد من المطورين بإنشاء كائنات مباشرة في شكل حرفية:

 // الطريقة الحرفية var obj2 = { الاسم: 'jam'، العمر: '8' }
console.log(obj) // { الاسم: 'jam'، العمر: '8' }

2. سمات كائن العملية - واصف السمة

في السابق، تم تعريف خصائصنا مباشرة داخل الكائن، أو إضافتها مباشرة إلى الكائن؛
لكن بهذه الطريقة لا يمكننا فرض بعض القيود على هذه السمة: على سبيل المثال، هل يمكن حذف هذه السمة من خلال delect ، وهل يمكن اجتيازها أثناء اجتياز for-in ؟
إذا أردنا الحصول على تحكم تشغيلي أكثر دقة في إحدى السمات، فيمكنني استخدام واصفات السمات . يمكن إضافة أو تعديل خصائص الكائن بدقة من خلال واصفات الخصائص؛
تحتاج واصفات الخصائص إلى استخدام Object.defineProperty لإضافة الخصائص أو تعديلها.

属性描述符分为两种：数据描述符和存取描述符

2.1 واصف البيانات

واصف البيانات هو خاصية ذات قيمة قد تكون أو لا تكون قابلة للكتابة. يحتوي واصف البيانات على القيم الأساسية الاختيارية التالية:

• القيمة: القيمة المقابلة لهذه السمة. يمكن أن تكون أي قيمة JavaScript صالحة (قيمة رقمية، كائن، وظيفة، وما إلى ذلك). الافتراضي غير محدد.

• قابل للكتابة: إذا كان قابل للكتابة لهذه السمة صحيحًا، فيمكن تغيير القيمة بواسطة عامل النسخ. الافتراضي هو خطأ.

• قابل للتكوين: إذا كان السمة القابلة للتكوين صحيحة، فيمكن تغيير واصف السمة، ويمكن أيضًا حذف السمة من الكائن المقابل. الافتراضي هو خطأ.

• قابل للتعداد: إذا كان عدد الخاصية صحيحًا، فيمكن أن تظهر الخاصية في خاصية التعداد الخاصة بالكائن. الافتراضي هو خطأ.

2.2.1 احصل على واصف الخاصية Object.getOwnPropertyDescriptor().

يقوم الأسلوب Object.getOwnPropertyDescriptor() بإرجاع واصف الخاصية المطابق لخاصية خاصة على الكائن المحدد.

 Object.getOwnPropertyDescriptor(obj,prop)

• obj: الكائن المستهدف الذي سيتم العثور عليه

• الدعامة: اسم السمة في الكائن الهدف (نوع السلسلة).

• قيمة الإرجاع: إذا كانت الخاصية المحددة موجودة على الكائن، فسيتم إرجاع كائن واصف الخاصية الخاص به، وإلا فسيتم إرجاع غير محدد.

ملاحظة: إذا لم تكن المعلمة الأولى لهذه الطريقة كائنًا، فسيتم الإبلاغ عن خطأ (TypeError).

2.1.2 قم بتعيين واصف الخاصية Object.defineProperty

يقوم الأسلوب Object.defineProperty()‎ بتعريف خاصية جديدة على كائن مباشرةً، أو تعديل خاصية موجودة لكائن ما، وإرجاع الكائن.

 Object.defineProperty(obj، دعامة، واصف)

• obj: الكائن الذي سيتم تحديد الخصائص عليه.

• الدعامة: اسم الخاصية المراد تعريفها أو تعديلها.

• الواصف: واصف السمة المراد تعريفها أو تعديلها

• قيمة الإرجاع: الكائن الذي تم تمريره إلى الدالة

 يُظهر نموذج التعليمات البرمجية التالي إعداد واصفات السمات والحصول عليها var obj = {
الاسم: "مربى" ،
العمر: 8
}
Object.defineProperty(obj, 'job', {
القيمة: "محامي"
})
console.log(Object.getOwnPropertyDescriptor(obj, 'age')) // { القيمة: 8، قابلة للكتابة: صحيح، قابلة للتعداد: صحيحة، قابلة للتكوين: صحيحة }

console.log(obj.job) // المحامي // خاصية جديدة من خلال DefineProperty، هذه الخاصية الجديدة غير قابلة للتعديل وغير قابلة للحذف وغير قابلة للتعداد console.log(Object.getOwnPropertyDescriptor(obj, 'job')) // {القيمة: "محامٍ"، قابل للكتابة: خطأ، قابل للتعداد: خطأ، قابل للتكوين: خطأ}

注意：通过defineProperty新增的属性，该新属性是不可修改、不可删除以及不可枚举的

(1) ما إذا كان من الممكن حذف ما يمكن تكوينه من الكائن

 فار أوبج = {
الاسم: "مربى" ،
العمر: 8
}
Object.defineProperty(obj, 'address', {
القيمة: "خبي"،
// قابل للتكوين لا يمكن حذف هذه الخاصية، ولا يمكنك استخدام DefineProperty لتعديل واصف الخاصية مرة أخرى قابل للتكوين: false،

})
حذف obj.address // أريد استخدام الحذف لحذف هذه السمة obj.address = 'Guangzhou' // أريد تعديل قيمة عنوان السمة في obj إلى قوانغتشو console.log(obj.address) // نتيجة الإخراج: Hebei

نظرًا لأن القيمة القابلة للتكوين لواصف السمة خاطئة ولا يمكن حذفها أو تعديلها، فلن يسري مفعول الحذف والتعديل.

(2) ما إذا كان يمكن تعداد واجتياز ما إذا كان يمكن تعدادها

 فار أوبج = {
الاسم: "مربى" ،
العمر: 8}Object.defineProperty(obj, 'sex', {
القيمة: "ذكر"،
// enumerable يضبط ما إذا كان من الممكن تعداد هذه الخاصية enumerable: true})for (i in obj) {
console.log(i)}

عندما يكون enumerable: false، تكون نتيجة الإخراج هي عمر الاسم
عندما تكون قيمة enumerable: true، تكون نتيجة الإخراج هي الاسم والعمر والجنس

(3) قابلة للكتابة تتحكم هذه الميزة فيما إذا كان من الممكن تعيين قيمة للسمة (اكتب قيمة)

 فار أوبج = {
الاسم: "مربى" ،
العمر: 8}Object.defineProperty(obj, 'score', {
القيمة: 80،
// قابل للكتابة: صحيح
قابل للكتابة: خطأ})obj.score = 100 console.log(obj.score) // 80

نظرًا لأن القيمة القابلة للكتابة خاطئة، فعندما يتم تعديل النتيجة إلى 100، لا يكون التعديل ناجحًا، ويكون الناتج النهائي 80.

2.1.3 قم بتعيين واصفات خصائص متعددة Object.defineProperties في نفس الوقت

هل تشعر أنه من المرهق تعيين واصف خاصية لخاصية واحدة فقط في كل مرة؟ يمكن أن يساعدك Object.defineProperties في حل المشكلة.
يقوم الأسلوب Object.defineProperties() بتعريف خاصية جديدة واحدة أو أكثر أو تعديل الخصائص الموجودة لكائن ما، وإرجاع الكائن.

 Object.defineProperties(obj، الدعائم)

• obj: الكائن الذي سيتم تحديد الخصائص عليه.

• الدعائم: الكائن الذي سيتم تعريف خصائصه القابلة للتعداد أو واصفاته المعدلة.

• قيمة الإرجاع: الكائن الذي تم تمريره إلى الدالة.

رمز العينة كما يلي:

 فار أوبج = {
الاسم: 'jam',}Object.defineProperties(obj, {
'عمر': {
القيمة: 28،
للكتابة: صحيح،
شكلي: كاذبة،
لا تعد: صحيح
},
'وظيفة': {
القيمة: "المحامي"،
للكتابة: صحيح،
شكلي: كاذبة،
لا تعد: صحيح
},
"الجنس": {
القيمة: "ذكر"،
قابل للكتابة: كاذب،
شكلي: كاذبة،
لا تعد: صحيح
},
'ارتفاع': {
القيمة: '1.8 م'،
قابل للكتابة: كاذب،
شكلي: كاذبة،
لا تعد: صحيح
}})console.log(obj) // الاسم: 'jam'، العمر: 28 عامًا، الوظيفة: 'محامي'، الجنس: 'ذكر'، الارتفاع: '1.8 متر' }

2.2 واصف الوصول

واصفات الوصول هي خصائص موصوفة بواسطة أزواج دالة getter-setter. يحتوي واصف الوصول على قيم المفاتيح الاختيارية التالية:

• الحصول على: يوفر طريقة getter للخاصية. إذا لم يكن هناك getter، فهو غير محدد. عند الوصول إلى هذه الخاصية، سيتم تنفيذ الطريقة، ولن يتم تمرير أي معلمات عند تنفيذ الطريقة، ولكن سيتم تمرير هذا الكائن.

• set: يوفر طريقة ضبط للخاصية إذا لم يكن هناك أداة ضبط، فستكون غير محددة. يتم تشغيل هذه الطريقة عند تعديل قيمة الخاصية. ستقبل هذه الطريقة المعلمة الوحيدة، وهي قيمة المعلمة الجديدة للخاصية.

• قابل للتكوين: إذا كان السمة القابلة للتكوين صحيحة، فيمكن تغيير واصف السمة، ويمكن أيضًا حذف السمة من الكائن المقابل. الافتراضي هو خطأ.

• قابل للتعويض: إذا وفقط إذا كانت قيمة السمة صحيحة، فيمكن أن تظهر السمة في سمة التعداد الخاصة بالكائن. الافتراضي هو خطأ.

إن استخدام configurable و enurnerable يتوافق مع ذلك في واصفات البيانات، لذلك لن أشرحها بالتفصيل هنا.
نتحدث بشكل أساسي عن استخدام طرق الحصول والتعيين

2.2.1 استخدام get() وset()

 فار أوبج = {
الاسم: "مربى" ،
العمر: 8،
_العنوان: "خبي"
}

// سيناريوهات استخدام واصفات الوصول // 1. إخفاء سمة خاصة معينة من المتوقع أن يتم استخدامها وتعيينها مباشرة من قبل العالم الخارجي // 2. إذا أردنا فهم عملية الوصول وتعيين قيمة سمة معينة ، سنستخدمه أيضًا واصف خاصية التخزين Object.defineProperty(obj, 'address', {
لا تعد: صحيح،
شكلي: صحيح،
الحصول على: الوظيفة () {
فو ()
إرجاع هذا._العنوان
},
المجموعة: الوظيفة (القيمة) {
حاجِز()
this._address = القيمة
}
})
وظيفة فو () {
console.log("تم اعتراض قيمة العنوان مرة واحدة")
}

شريط الوظائف () {
console.log("يتم تعيين قيمة العنوان مرة واحدة")
}

تقوم وحدة التحكم في نموذج التعليمات البرمجية أعلاه بطباعة النتائج التالية: