JavaScript 'getter' 대 'setter'

Assalomu alaykum, bugun sizlar bilan JavaScriptda getter va setter metodlari tanishamiz.



Ob'ektlarning ikki xil xususiyati bo'ladi.

Birinchisi, ma'lumot xususiyati(데이터 속성). Ma'lumot xususiyati bilan ko'pchiligimiz tanishmiz va barchamiz u bilan ishlaganmiz.

Ikkinchisi, kiruvchi xususiyat(접속자 속성). Bu tashqaridan qaraganda oddiy property ga o`xshaydigan, _property_ning qiymatini olish hamda yangi qiymat berish uchun mo'ljallangan maxsus funksiya.

getter va setter larni 3 xil usulda hosil qilish mumkin:
  • odatiy metod yaratish usuli orqali
  • get VAset kalit so`zlari orqali
  • Object.defineProperty() 메토디 오르칼리

  • 게터 메토들러



    Ob'ekt xususiyatining qiymatini olishning eng oson yo'llaridan biri ularnig har biriga getter metodlarini yozib chiqishdir. Keling getter metodlar qanday hosil qilinishini ko'rib chiqamiz. Dastlab, ishga kirish uchun topshirgan nomzod ob'ektini yaratib olamiz.

    const nomzod = {
        ism: "ALi",
        tajriba: 3
    }
    


    Agar nomzod xususiyatlari qiymati olmoqchi bo'lsak, quyidagicha kod yozamiz:

    nomzod.ism // "Ali"
    nomzod.tajriba // 3
    


    Endi, ob'ektga getter metodlarini qo'shamiz. Bu metodlar ob'ektning ism va tajriba xususiyatlari qiymatlarini qaytaradi.

    const nomzod = {
        ...
    
        getIsm: function() {
            return this.ism
        },
    
        getTajriba: function() {
            return this.tajriba
        }
    }
    


    getter va setter metodlari orqali qiymatlar quyidagicha olamiz:

    nomzod.getIsm() // "Ali"
    nomzod.getTajriba() // 3
    


    Oddiy ko'rinadi, to'g'rimi? Endi sizda savol tug'ilishi mumkin, getter va setter bizga nimaga kerak, ularsiz ham ob'ekt xususiyatini oddiygina qilib chaqirishimiz mumkinku? Bu savolingizga setter metodi bilan tanishganimizda javob olasiz.👇👇👇

    세터 메토들러


    setter metodlarining vazifasi ob'ekt xususiyatiga yangi qiymat o'xlashtirish hisoblanadi. Misol uchun yuqoridagi ob'ektga setter 메토들라리니 요자미즈.

    const nomzod = {
        ...
    
        setIsm: function(newIsm) {
            this.ism = newIsm
        }, 
    
        setTajriba: function(newTajriba) {
            this.tajriba = newTajriba
        }
    }
    


    setter metodlari quyidagicha chaqiramiz.

    nomzod.setIsm("Vali")
    nomzod.setTajriba(5)
    
    nomzod.getIsm() // "Vali"
    nomzod.getTajriba() // 5
    


    Endi qiziq joyiga keldik. getter VAsetter 니 마가 케락? Tasavvur qiling siz yangi qiymat bermoqchi bo'lgan ob'ekt xususiyati bir nechta validatsiyalarda o'tishi kerak, mislo uchun, parol xususiyatini oladigan bo'lsak, parol 8 ta belgidan kam bo'lmasligi, raqam, belgi, katta va kichik harflardan iborat bo '리시 케락. Yuqoridagi shartlarni if ​​operatori bilan tekshiramiz va har safar yangi qiymat berganimizda o'sha shartni qayta yozamiz.
    setter metodlari bilan foydasi shuki, bizga kerakli shartlarni setter metodi ichida yozamiz va har safar yangi qiymat o'zlashtirganimizda qiymat avtomatik ravishda biz yozgan shartlar bo'yicha tekshiriladi.

    Hozir buni nomzodning tajriba xususiyati orqali sinab ko'ramiz.

    const nomzod = {
        ...
    
        setIsm: function(newIsm) {
            this.ism = newIsm
        } ,
    
        setTajriba: function(newTajriba) {
            if(newTajriba >= 2) {
                this.tajriba = newTajriba
            } else {
                throw "2 yildan kam tajribali nomzodlar ko'rib chiqilmaydi"
            }
        }
    }
    
    nomzod.setTajriba(1.5) // Xatolik beradi va tajriba uchun yangi qiymatni olmaydi.
    


    데막, getter VAsetter metodlari bizga qiymat olguncha yoki yangi qiymat berguncha qo'shimcha logika qo'shish va xususiyatlarni xavfsiz qilish uchun kerak ekan.

    get va set kalit so'zlari 오르칼리



    Biz yuqorida ko'rilgan metodlar get va set kalit so'zlari orqali quyidagi yoziladi.

    const nomzod = {
        _ism: "ALi",
        _tajriba: 3,
    
        get ism() {
            return this._ism
        },
    
        get tajriba() {
            return this._tajriba
        },
    
        set ism(newIsm) {
            this._ism = newIsm
        } ,
    
        set tajriba(newTajriba) {
            if(newTajriba >= 2) {
                this._tajriba = newTajriba
            } else {
                throw "2 yildan kam tajribali nomzodlar ko'rib chiqilmaydi"
            }
        }
    }
    

    get VAset kalit so'zlari orqali ob'ekt uchun metod emas, balki accessor xususiyat hosil qilinadi, ya'ni ularni metodni chaqirgandek emas xususiyatni chaqirgandek chaqiramiz. Yuqoridagi kodda o'zgaruvchi nomalari bir xil bo'lib qolmasligi uchun ob'ektning ism va tajriba xususiyatlarini mos ravishda _ism va _tajriba ga almashtirdik.
    get VAset bilan yaratilgan getter va setterning nomlari bir xil bo'lishi hech qanaqa muammo bo'lmaydi, agar xususiyatni chaqirgandek chaqirsak getter ishlaydi, yangi qiymat o'lashtirmoqchi bo'sak setter ishlari.

    nomzod.tajriba // getter ishlaydi, tajribaning qiymatini qaytaradi
    nomzod.tajriba = 3 // setter ishlaydi, tajriba uchun yangi qiymat oladi.
    


    Object.defineProperty() orqali



    Object.defineProperty() orqali biriktirilgan accessor property lar data propertylardan farq qiladi. 울라다 value 요키 writable 오르니가 get VAset funksiyalari 볼라디.

    const nomzod = {
        _ism: "ALi",
        _tajriba: 3,
    }
    
    Object.defineProperty(nomzod, "tajriba", {
        get() {
            return this._tajriba
        },
    
        set() {
            if(newTajriba >= 2) {
                this._tajriba = newTajriba
            } else {
                throw "2 yildan kam tajribali nomzodlar ko'rib chiqilmaydi"
            }
        }
    })
    
    


    줄로사


  • getter va setter yuqoridagi 3 ta usul orqali yasaladi
  • ular orqali qiymat olish va berishda qo'shimcha funksionallik berish va qiymatni boshqarish imkoniyatini beradi

  • Foydali bo'lgan bo'lsa ulashing ;-)

    좋은 웹페이지 즐겨찾기