JavaScript,對象里的get與set方法


1:get語法將對象屬性綁定到查詢該屬性時將被調用的函數;當嘗試設置屬性時set,set語法將對象屬性綁定到要調用的函數。

2:示例中的name是數據屬性;get、set后的age屬性是訪問器屬性,訪問器屬性:當外部js給age賦值時走的時setter函數,當外部js獲取age時 走的getter函數,setter和getter是隱藏函數,會取我們寫在age后邊的函數。

 

 

 

①get 和set 都為箭頭函數,可以同時操作一個屬性

 

        const person = {
            name: "zhangsan",
            age: 11,
            get: () => { this.age },
            set: (value) => { this.age = value },
        }

        console.log(person.age); //11
        person.age = 18;
        console.log(person.age); //18
/////////////////////////////////////////////////

 

② get和set不設置為箭頭函數,

        var person = {
            _name: "zhangsan",
            _age: 18,
            get age() {
                return this._age;
            },
            set age(value) {
                console.log('set')
                if (value > 100) {
                    console.log(`輸入的年齡${value}大於100,不正確`)
                } else {
                    this._age = value;
                }
            }
        };
        person.age = 111;
        console.log(person.age)  // set ;輸入的年齡111大於100,不正確 ;18
        person.age = 10;
        console.log(person.age)   //set; 10
             或者
        var person = {
            name: "zhangsan",
            get age() {
                return 18
            },
            set age(value) {
                console.log('set')
                if (value > 100) {
                    console.log(`輸入的年齡${value}大於100,不正確`)
                } else {
                    this.age = value;
                }
            }
        };
        console.log(person.age)  //18
///////////////////////////////////////////////
 

 ///////////////////////////////////////////////

備注:錯誤示例,出現哈桑遞歸的錯誤

        var person = {
            name: "zhangsan",
            age: 18,
            get age() {
                return this.age;
            },
        };
        console.log(person.age); //報錯 t.html:23 Uncaught RangeError: Maximum call stack size exceeded; "超出最大調用堆棧大小"
報錯

t.html:23 Uncaught RangeError: Maximum call stack size exceeded
at Object.get age [as age] (t.html:23)
at Object.get age [as age] (t.html:24)
at Object.get age [as age] (t.html:24)
at Object.get age [as age] (t.html:24)
at Object.get age [as age] (t.html:24)
at Object.get age [as age] (t.html:24)
at Object.get age [as age] (t.html:24)
at Object.get age [as age] (t.html:24)
at Object.get age [as age] (t.html:24)
at Object.get age [as age] (t.html:24)

錯誤原因:出現這種錯誤最常見的原因是:在代碼中的某個地方,您正在調用一個函數,該函數又調用另一個函數,依此類推,直到達到調用堆棧限制。這幾乎總是因為具有未滿足的基本情況的遞歸函數


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM