关于JavaScript中Get/Set访问器
-
有时候大家可能会纳闷,在使用JavaScript的时候,只需要给一个系统变量赋值就可以触发一系列操作去相应。
但是我们在写Js的时候,修改了一个自定义变量,却连个P都没有。是不是很郁闷呢?
其实,我们现在就可以做类似系统变量那样的功能了!
做个假设,我们有一个变量,要求可以输入出生年份并自动计算当前年龄。
如:
// 定义一个年龄变量并赋予初始值
var age = 18;
// 我们手动输入的出生年份
age = 1994;
// 此时age=?大家可能说我最后的这个疑问有毛病,骂我是SB。。。没关系。。。刚才我们提过需求了嘛……
按需求来说,age这个时候应该是等于20。
很明显要做这个操作我们要调用一个函数来进行处理,但是能不能不手动调用函数来完成这个功能呢?
下面我们来介绍一下此章主角 Get/Set访问器!
说明了,就是我们可以限制一个变量是否可以被访问或是否可以被重写。
另外还有一个功能是,我们在访问或重写时可以执行其他语句进行处理。
使用方法一:
var age = 18;
var test = {
get age (){
return age;
},
set age (value){
if(value > 100) age= new Date().getFullYear() - value;
else age = value;
}
};这个时候我们再写如下代码来进行操作。
test.age = 1994;
alert(test.age);如何?是不是正确的显示了20这个数字?
可是以上方法比较麻烦也不好理解。我们来看看第二种方法是否更有实用性:
function 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; }
});
}使用以下代码测试:
var 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)。
如有其它问题请评论讨论~谢谢!~撒花~~~
关于JavaScript中Get/Set访问器的更多相关文章
- javascript中数据属性与访问器属性
1.数据属性 Configurable:true|false,表示能否通过delete将属性删除,默认为true.当把属性的Configurable设置为false后,该属性不能通过delete删除, ...
- JavaScript 数据属性和访问器属性
在JavaScript中对象被定义为"无序属性的集合,其属性可以包含基本值.对象或函数."通俗点讲,我们可以把对象理解为一组一组的名值对,其中值可以是数据或函数. 创建自定义对象通 ...
- JavaScript ECAMScript5 新特性——get/set访问器
之前对get/set的理解一直有误,觉得get set 是对象属性方法.看了别人的博客也有很多疑问,今天系统的做了很多测试终于弄明白了.(自己通过看书和写demo测试的,如有不对欢迎大家批评指正) g ...
- JavaScript 属性类型(数据属性 访问器属性)
ECMA-2把对象定义为:“无序属性的集合,其属性可以包含基本值.对象或者函数.” 严格来说,这就相当于说对象是一组没有特定顺序的值.对象的属性或方法都有一个名字,而每个名字映射到一个值.我们可以把E ...
- js中属性类型:数据属性与访问器属性
js中属性类型分为两种:数据属性和访问器属性 在js中,对象都是由名值对构成的,名:就是我们所说的属性名,值就是属性对应的值(基本值.对象.方法). ECMA-262第5版定义了只有内部才用的特性,描 ...
- C#中的GET和SET访问器
我们在学习C#语法的属性时,都要首先和GET,SET访问器打交道,从英文的字面意思上理解,GET应该就是获得什么什么,而SET应该是设置什么什么,那我们看一下,官方是怎么定义这对访问器的:get是读取 ...
- JavaScript 中的数据类型
Javascript中的数据类型有以下几种情况: 基本类型:string,number,boolean 特殊类型:undefined,null 引用类型:Object,Function,Date,Ar ...
- 深入理解JavaScript中的属性和特性
深入理解JavaScript中的属性和特性 JavaScript中属性和特性是完全不同的两个概念,这里我将根据自己所学,来深入理解JavaScript中的属性和特性. 主要内容如下: 理解JavaSc ...
- javascript中的属性类型
ECMA-262第5版在定义只有内部才用的特性(attribute)时,描述了属性(property)的各种特性.ECMA-262定义这些特性是为了实现javascript引擎用的,因此在javasc ...
随机推荐
- 未知高度的图片在div设置垂直居中
方法一: 该方法是将外部容器的显示模式设置成display:table,img标签外部再嵌套一个span标签,并设置span的显示模式为display:table-cell,这样就可以很方便的使用ve ...
- dobbo 服务配置详解(解决超时重试问题)
<!-- reference method --> <dubbo:reference interface="com.xx.XxxService"> ...
- vs2013 密钥_
vs2013 密钥 最佳答案: BWG7X-J98B3-W34RT-33B3R-JVYW9
- Solr添加SolrDocument报错
今天写了一个solr入库接口,使用了SolrServer.addBean接口,结果报错:Caused by: org.apache.solr.client.solrj.impl.HttpSolrSer ...
- procedure
create or replace procedure get_username as begin v_id in number:=1 select * from uc_t_staff t where ...
- Linux内核设计基础(四)之虚拟文件系统
先来看一下写文件函数write的运行过程: ret = write(fd, buf, len); write适用于各种文件系统.它首先运行sys_write(),而正是这个sys_write()进行实 ...
- angular5使用httpclient时解决跨域问题
跨域问题的环境: 在本地开发时,使用命令行ng s开启服务,访问地址为http://localhost:4200 假设调用数据接口的服务地址为http://localhost:8088/api/dat ...
- Android 的事件传递机制,详解
Android 的事件传递机制,详解 前两天和一个朋友聊天的时候.然后说到事件传递机制.然后让我说的时候,忽然发现说的不是非常清楚,事实上Android 的事件传递机制也是知道一些,可是感觉自己知道的 ...
- win7,8,10取得|取消管理员权限
取得: Windows Registry Editor Version 5.00[HKEY_CLASSES_ROOT\*\shell\runas]@=”管理员取得所有权”“NoWorkingDirec ...
- tensorflow serving 打印调试log
启动时添加环境变量 export TF_CPP_MIN_VLOG_LEVEL=1 ,这样可以打印VLOG(1)的log