当前位置：首页 > news >正文

详解JavaScript中属性getter和setter

news 2024/9/27 12:13:18

6.6 属性getter和setter

属性值可以用1个或者2个方法替代，getter和setter.

由这两个定义的属性称作存取器属性(accessor property)，不同于数据属性，只有一个简单的值。有读写属性，只能写，只能读，可以读写。

代码实现:

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>6.6 属性getter和setter</title><script>var p={x:1.0,y:1.0,get r(){return Math.sqrt(this.x*this.x+this.y*this.y);},set r(newvalue){var oldvalue=Math.sqrt(this.x*this.x+this.y*this.y);var ratio=newvalue/oldvalue;//比率this.x*=ratio;this.y*=ratio;},get theta(){return Math.atan2(this.y,this.x);//赛塔，反切}}</script></head><body><h1>6.6 属性getter和setter</h1></body>
</html>

页面效果：

产生严格自增的序列号

代码实现：

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>产生严格自增的序列号</title><script>//这个对象产生严格自增的序列号var serialnum={//包含下一个序列号//$符号暗示这个属性是一个私有属性$n:0,get next(){return this.$n++;//返回当前值，然后自增},set next(n){if (n >= this.$n) {this.$n=n;} else{throw "设置的序列号的值不能比当前值小！"}}}</script></head><body><h1>产生严格自增的序列号</h1><textarea name="" id="" cols="100" rows="18" readonly>//这个对象产生严格自增的序列号var serialnum={//包含下一个序列号//$符号暗示这个属性是一个私有属性$n:0,get next(){return this.$n++;//返回当前值，然后自增},set next(n){if (n >= this.$n) {this.$n=n;} else{throw "设置的序列号的值不能比当前值小！"}}}</textarea></body>
</html>

页面效果：

产生随机数的对象

代码实现：

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>产生随机数的对象</title><script>//这个对象有可以返回随机数的存取器属性var random={get octet(){return Math.floor(Math.random()*256);},get unit16(){return Math.floor(Math.random()*65535);},get int16(){return Math.floor(Math.random()*65535)-32768;}}</script></head><body><h1>产生严格自增的序列号</h1><textarea name="" id="" cols="90" rows="13" readonly>//这个对象有可以返回随机数的存取器属性var random={get octet(){return Math.floor(Math.random()*256);},get unit16(){return Math.floor(Math.random()*65535);},get int16(){return Math.floor(Math.random()*65535)-32768;}}</textarea></body>
</html>