关于JavaScript中Get/Set访问器
-
有时候大家可能会纳闷,在使用JavaScript的时候,只需要给一个系统变量赋值就可以触发一系列操作去相应。
但是我们在写Js的时候,修改了一个自定义变量,却连个P都没有。是不是很郁闷呢?
其实,我们现在就可以做类似系统变量那样的功能了!
做个假设,我们有一个变量,要求可以输入出生年份并自动计算当前年龄。
如:
12345// 定义一个年龄变量并赋予初始值
var age =
18
;
// 我们手动输入的出生年份
age =
1994
;
// 此时age=?
大家可能说我最后的这个疑问有毛病,骂我是SB。。。没关系。。。刚才我们提过需求了嘛……
按需求来说,age这个时候应该是等于20。
很明显要做这个操作我们要调用一个函数来进行处理,但是能不能不手动调用函数来完成这个功能呢?
下面我们来介绍一下此章主角 Get/Set访问器!
说明了,就是我们可以限制一个变量是否可以被访问或是否可以被重写。
另外还有一个功能是,我们在访问或重写时可以执行其他语句进行处理。
使用方法一:
这个时候我们再写如下代码来进行操作。12345678910var age =
18
;
var test = {
get age (){
return
age;
},
set age (value){
if
(value >
100
) age=
new
Date().getFullYear() - value;
else
age = value;
}
};
如何?是不是正确的显示了20这个数字?12test.age =
1994
;
alert(test.age);
可是以上方法比较麻烦也不好理解。我们来看看第二种方法是否更有实用性:
使用以下代码测试:1234567function Person() {
var age =
new
Date().getFullYear() -
18
;
Object.defineProperty(
this
,
"age"
, {
get: function () { alert(
"内部存储数据为:"
+ age);
return
new
Date().getFullYear() - age; },
set: function (value) { age = value; }
});
}
123var p =
new
Person();
p.age =
1994
;
alert(
"外部获取到的数据为:"
+ p.age);
具体使用哪种方法按照需求进行选择。
拓展知识:
问:为什么以前没听过Get/Set访问器?
答:因为这是ECMAScript 5新增特性,比较新,所以以前自然是没有了。
问:我可以在什么样的浏览器中运行?
答:具体的我没测试过,但是就我本机环境来说这些版本的浏览器可以运行(Chrome 32、IE 9、FireFox 28、Opera 19、Safari 5.1.7)。
如有其它问题请评论讨论~谢谢!~撒花~~~
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
· 阿里最新开源QwQ-32B,效果媲美deepseek-r1满血版,部署成本又又又降低了!
· 单线程的Redis速度为什么快?
· SQL Server 2025 AI相关能力初探
· AI编程工具终极对决:字节Trae VS Cursor,谁才是开发者新宠?
· 展开说说关于C#中ORM框架的用法!