Obyektlarda getter va setter
JavaScript getter va setterlari
Qabul qiluvchilar va sozlagichlar obyektga kirish vositalarini (hisoblash xususiyatlari) aniqlashga imkon beradi.
JavaScript getter (get kalit so‘zi)
Bu misol get uchun lang xususiyatidan foydalanadi
language xususiyatining qiymati.
Misol
// Create an object:
const person = {
firstName: "John",
lastName: "Doe",
language: "en",
get lang() {
return this.language;
}
};
// Display data from the object using a getter:
document.getElementById("demo").innerHTML = person.lang;
O‘zingiz sinab ko‘ring »
JavaScript setter (set kalit so‘zi)
Ushbu misolda language xossasi qiymatini o‘rnatish (set) uchun lang xossasidan foydalaniladi.
Misol
const person = {
firstName: "John",
lastName: "Doe",
language: "",
set lang(lang) {
this.language = lang;
}
};
// Set an object
property using a setter:
person.lang = "en";
// Display data from the object:
document.getElementById("demo").innerHTML = person.language;
O‘zingiz sinab ko‘ring »
JavaScript funksiyasimi yoki getter?
Ushbu ikki misol o‘rtasidagi farq nima?
1-misol
const person = {
firstName: "John",
lastName: "Doe",
fullName: function() {
return this.firstName + " " +
this.lastName;
}
};
// Display data from the object using a method:
document.getElementById("demo").innerHTML = person.fullName();
O‘zingiz sinab ko‘ring »
2-misol
const person = {
firstName: "John",
lastName: "Doe",
get fullName() {
return this.firstName + " " +
this.lastName;
}
};
// Display data from the object using a getter:
document.getElementById("demo").innerHTML = person.fullName;
O‘zingiz sinab ko‘ring »
1-misolda fullName’ga funksiya sifatida murojaat qilinadi: person.fullName().
2-misolda fullName’ga xususiyat sifatida murojaat qilinadi: person.fullName.
Ikkinchi misol oddiyroq sintaksisni taqdim etadi.
Ma’lumotlar sifati
JavaScript qabul qiluvchilar va sozlagichlardan foydalanganda ma’lumotlar sifatini yaxshilashi mumkin.
Ushbu misolda lang xossasidan foydalanish language xossasining qiymatini katta harflarda qaytaradi:
Misol
// Create an object:
const person = {
firstName: "John",
lastName: "Doe",
language: "en",
get lang() {
return this.language.toUpperCase();
}
};
// Display data from the object using a getter:
document.getElementById("demo").innerHTML = person.lang;
O‘zingiz sinab ko‘ring »
Ushbu misolda lang xossasidan foydalanish language xossasiga katta harfli qiymatni saqlaydi:
Misol
const person = {
firstName: "John",
lastName: "Doe",
language: "",
set lang(lang) {
this.language = lang.toUpperCase();
}
};
// Set an object
property using a setter:
person.lang = "en";
// Display data from the object:
document.getElementById("demo").innerHTML = person.language;
O‘zingiz sinab ko‘ring »
Nega getter va setterlardan foydalanish kerak?
- Soddaroq sintaksis beradi
- U xususiyatlar va usullar uchun teng sintaksisga imkon beradi
- Ma’lumotlar sifatini yaxshiroq ta’minlashi mumkin
- Bu sahna ortidagi narsalarni qilish uchun foydalidir
Agar sizga faqat oddiy qiymatlar kerak bo‘lsa, getter yoki setterlardan foydalanmang (ortiqcha ishlatishning oldini oladi).
Object.defineProperty()
Object.defineProperty() metodidan Getter va Setterlarni qo‘shish uchun ham foydalanish mumkin:
Hisoblagich misoli
// Define object
const obj = {counter : 0};
// Define setters and getters
Object.defineProperty(obj, "reset", {
get : function () {this.counter = 0;}
});
Object.defineProperty(obj, "increment", {
get : function () {this.counter++;}
});
Object.defineProperty(obj, "decrement", {
get : function () {this.counter--;}
});
Object.defineProperty(obj, "add", {
set : function (value) {this.counter += value;}
});
Object.defineProperty(obj, "subtract", {
set : function (value) {this.counter -= value;}
});
// Play with the counter:
obj.reset;
obj.add = 5;
obj.subtract = 1;
obj.increment;
obj.decrement;
O‘zingiz sinab ko‘ring »
Kengaytirilgan bo‘limlar:
JavaScript obyektlarini takrorlash
JavaScript obyektlarini qabul qiluvchilar va o‘rnatuvchilar
JavaScript obyektlarini boshqarish
JavaScript obyektini himoya qilish
W3Schools Pathfinder
Yutuqlaringizni kuzating – bu bepul!