访问器属性学习

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
<script>
   let staff = {
    data:{ id:1, name:"小猪猪" ,age: 21 },
    // 读取的访问器属性
    get age( ){
       return this.data.age;
    },
    // 设置的访问器属性
    set age(age) {
        if (age >=18 && age <60){
            return (this.data.age = age);
        }
       
        console.log("年龄:(18-60)之间");
    },
   };
   console.log("age = ", staff.age);
//    更新年龄
   staff.age = 8
   console.log("age = ", staff.age);  
</script>





</body>
</html>

  

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        let staff = {
         data:{ id:6, name:"小猪猪" ,age: 21 },
         // 读取的访问器属性
         get id( ){
         return this.data.id;
         },
         // 设置的访问器属性
         set id(id) {
           this.data.name = name;
         },
          };
         console.log("id = ", staff.id);
          //    更新年龄
         staff.id =4;
         console.log("id= ", staff.id);
    </script>
</body>
</html>

  

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        let staff = {
     data:{ id:1, name:"小猪猪" ,age: 21 },
     // 读取的访问器属性
     get name( ){
     return this.data.name;
     },
     // 设置的访问器属性
     set name(name) {
       this.data.name = name;
     },
    };
    console.log("name = ", staff.name);
 //    更新年龄
    staff.name = "小熊熊";
    console.log("name = ", staff.name);
    </script>
</body>
</html>

  

posted @ 2024-06-11 18:49  豹纹守宫  阅读(8)  评论(0)    收藏  举报