有时候大家可能会纳闷,在使用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访问器的更多相关文章

  1. javascript中数据属性与访问器属性

    1.数据属性 Configurable:true|false,表示能否通过delete将属性删除,默认为true.当把属性的Configurable设置为false后,该属性不能通过delete删除, ...

  2. JavaScript 数据属性和访问器属性

    在JavaScript中对象被定义为"无序属性的集合,其属性可以包含基本值.对象或函数."通俗点讲,我们可以把对象理解为一组一组的名值对,其中值可以是数据或函数. 创建自定义对象通 ...

  3. JavaScript ECAMScript5 新特性——get/set访问器

    之前对get/set的理解一直有误,觉得get set 是对象属性方法.看了别人的博客也有很多疑问,今天系统的做了很多测试终于弄明白了.(自己通过看书和写demo测试的,如有不对欢迎大家批评指正) g ...

  4. JavaScript 属性类型(数据属性 访问器属性)

    ECMA-2把对象定义为:“无序属性的集合,其属性可以包含基本值.对象或者函数.” 严格来说,这就相当于说对象是一组没有特定顺序的值.对象的属性或方法都有一个名字,而每个名字映射到一个值.我们可以把E ...

  5. js中属性类型:数据属性与访问器属性

    js中属性类型分为两种:数据属性和访问器属性 在js中,对象都是由名值对构成的,名:就是我们所说的属性名,值就是属性对应的值(基本值.对象.方法). ECMA-262第5版定义了只有内部才用的特性,描 ...

  6. C#中的GET和SET访问器

    我们在学习C#语法的属性时,都要首先和GET,SET访问器打交道,从英文的字面意思上理解,GET应该就是获得什么什么,而SET应该是设置什么什么,那我们看一下,官方是怎么定义这对访问器的:get是读取 ...

  7. JavaScript 中的数据类型

    Javascript中的数据类型有以下几种情况: 基本类型:string,number,boolean 特殊类型:undefined,null 引用类型:Object,Function,Date,Ar ...

  8. 深入理解JavaScript中的属性和特性

    深入理解JavaScript中的属性和特性 JavaScript中属性和特性是完全不同的两个概念,这里我将根据自己所学,来深入理解JavaScript中的属性和特性. 主要内容如下: 理解JavaSc ...

  9. javascript中的属性类型

    ECMA-262第5版在定义只有内部才用的特性(attribute)时,描述了属性(property)的各种特性.ECMA-262定义这些特性是为了实现javascript引擎用的,因此在javasc ...

随机推荐

  1. 未知高度的图片在div设置垂直居中

    方法一: 该方法是将外部容器的显示模式设置成display:table,img标签外部再嵌套一个span标签,并设置span的显示模式为display:table-cell,这样就可以很方便的使用ve ...

  2. dobbo 服务配置详解(解决超时重试问题)

    <!-- reference method -->     <dubbo:reference interface="com.xx.XxxService">  ...

  3. vs2013 密钥_

    vs2013 密钥 最佳答案: BWG7X-J98B3-W34RT-33B3R-JVYW9

  4. Solr添加SolrDocument报错

    今天写了一个solr入库接口,使用了SolrServer.addBean接口,结果报错:Caused by: org.apache.solr.client.solrj.impl.HttpSolrSer ...

  5. procedure

    create or replace procedure get_username as begin v_id in number:=1 select * from uc_t_staff t where ...

  6. Linux内核设计基础(四)之虚拟文件系统

    先来看一下写文件函数write的运行过程: ret = write(fd, buf, len); write适用于各种文件系统.它首先运行sys_write(),而正是这个sys_write()进行实 ...

  7. angular5使用httpclient时解决跨域问题

    跨域问题的环境: 在本地开发时,使用命令行ng s开启服务,访问地址为http://localhost:4200 假设调用数据接口的服务地址为http://localhost:8088/api/dat ...

  8. Android 的事件传递机制,详解

    Android 的事件传递机制,详解 前两天和一个朋友聊天的时候.然后说到事件传递机制.然后让我说的时候,忽然发现说的不是非常清楚,事实上Android 的事件传递机制也是知道一些,可是感觉自己知道的 ...

  9. win7,8,10取得|取消管理员权限

    取得: Windows Registry Editor Version 5.00[HKEY_CLASSES_ROOT\*\shell\runas]@=”管理员取得所有权”“NoWorkingDirec ...

  10. tensorflow serving 打印调试log

    启动时添加环境变量 export TF_CPP_MIN_VLOG_LEVEL=1 ,这样可以打印VLOG(1)的log