大家好，我是进阶学习者。1.Preamble有两种类型的属性。第一个是数据属性。已经知道如何使用它们。到目前为止使用的所有属性都是数据属性。第二种类型的属性是新的。它是访问器属性。它们本质上是获取和设置值的函数，但看起来像来自外部代码的常规属性。2.getter和setter访问器属性由“getter”和“setter”方法表示。在对象字面量中，用get和set表示：letobj={getpropName(){//读取obj.propName时，getter起作用}，setpropName(value){//当执行obj.propName=value操作时，setter起作用}};当读取obj.propName时，getter起作用，当分配obj.propName时，setter起作用。示例：有一个对象user具有name和surname属性：添加一个fullName属性，它应该是“JohnSmith”。当然，你不想复制粘贴已有的信息，那么可以使用访问器来实现：letuser={name:"John",surname:"Smith",getfullName(){return`${this.name}${this.surname}`;}};alert(user.fullName);//JohnSmith从外面看，访问器属性看起来像一个普通的属性。这就是访问器属性的设计思路。不要将user.fullName作为函数调用，而是正常阅读它：getter在幕后运行。到目前为止，fullName只有一个getter。如果尝试赋值user.fullName=，会出现错误：letuser={getfullName(){return`...`;}};user.fullName="Test";//错误（propertyhasonlyonegetter）让通过为user.fullName添加一个setter修复它：letuser={name:"John",surname:"Smith",getfullName(){return`${this.name}${this.surname}`;},setfullName(value){[this.name,this.surname]=value.split("");}};//setfullName将使用给定的值执行user.fullName="AliceCooper";alert(user.name);//Alicealert(user.surname);//Cooper现在，有一个“虚拟”属性。它是可读可写的。3.访问器描述符示例：要使用defineProperty创建一个fullName访问器，您可以使用get和set来传递描述符：letuser={name:"John",surname:"Smith"};Object.defineProperty(user,'fullName',{get(){return`${this.name}${this.surname}`;},set(value){[this.name,this.surname]=value.split("");}});alert(user.fullName);//JohnSmithfor(letkeyinuser)alert(key);//name,surname注意：属性要么是访问器（使用get/set方法）要么是数据属性（使用值），但不是两个都。4.更智能的getters/settersGetters/setters可以用作“真实”属性值的包装器，以便对它们有更多的控制。示例：如果要禁止用户名太短，可以创建一个setter名称，并将值存储在一个单独的属性_name中：letuser={getname(){returnthis._name;},setname(value){if(value.length<4){alert("Nameistooshort,needatleast4characters");return;}this._name=value;}};user.name="Pete";alert(user.name);//Peteuser.name="";//Nameistooshort...注：从技术上讲，外部代码可以使用user._name直接访问name。然而，这里有一个众所周知的约定，以下划线"开头的属性是内部属性，不应从对象外部访问。第五，兼容性访问器的一个重要用途是它们允许通过使用getter和setters”“Normal”数据属性来控制和调整这些属性的行为。开始使用数据属性name和age来实现用户对象：functionUser(name,age){this.name=name;this.age=age;}letjohn=newUser("John",25);alert(john.age);//25但情况可能会发生变化。可能决定存储生日而不是年龄，因为它更精确和方便：现在应该做什么仍然使用age属性的旧代码呢？您可以尝试找到所有这些地方并修复它们，但这会花费很多时间，而且如果很多其他人都在使用该代码，则可能很难完成所有修复。加一个age的getter解决这个问题：functionUser(name,birthday){this.name=name;this.birthday=birthday;//根据当前日期和生日计算年龄Object.defineProperty(this,"age",{get(){lettodayYear=newDate().getFullYear();returntodayYear-this.birthday.getFullYear();}});}letjohn=newUser("John",newDate(1992,6,1));alert(john.birthday);//birthday是可访问的alert(john.age);//...age也是可访问的现在旧代码可以使用，并且有一个很好的附加属性。6.小结本文基于JavaScript基础，介绍getter和setter函数的使用。对于属性，通过案例的样式，详细说明了运行效果图的展示。同时，对相关内容进行扩充，希望能帮助大家更好地理解。欢迎大家积极尝试。有时候看别人实现很简单，但是到了自己实现的时候，总会出现各种各样的问题。不要野心太大，努力理解得更深刻。代码很简单，希望对大家学习有所帮助。
