有时候大家可能会纳闷,在使用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. C语言中static的作用及C语言中使用静态函数有何好处

    转自:http://www.jb51.net/article/74830.htm 在C语言中,static的作用有三条:一是隐藏功能,二是保持持久性功能,三是默认初始化为0. 在C语言中,static ...

  2. Java JDBC数据库链接

    好久没有编写有关数据库应用程序啦,这里回顾一下java JDBC. 1.使用Java JDBC操作数据库一般需要6步: (1)建立JDBC桥接器,加载数据库驱动: (2)连接数据库,获得Connect ...

  3. C# 的三种序列化方法

    序列化是将一个对象转换成字节流以达到将其长期保存在内存.数据库或文件中的处理过程.它的主要目的是保存对象的状态以便以后需要的时候使用.与其相反的过程叫做反序列化. 序列化一个对象 为了序列化一个对象, ...

  4. linux loop device介绍

    在Linux中,有一种特殊的块设备叫loop device,这种loop device设备是通过影射操作系统上的正常的文件而形成的虚拟块设备.因为这种设备的存在,就为我们提供了一种创建一个存在于其他文 ...

  5. htmlDOM树

    原文: https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_shadow_DOM Shadow DOM API  研究一 ...

  6. VS2008+Windows DDK 7的环境配置

    Mark offers some third party utilities. That's good, but I will show a more handy way (IMHO): how to ...

  7. [Node.js]27. Level 5: URL Building & Doing the Request

    Let's create a page which calls the twitter search API and displays the last few results for Code Sc ...

  8. Linux-cpu分析-vmstat

    转载:https://blog.csdn.net/ty_hf/article/details/63394960 一. 前言 为了更方便的理解本篇内容含义,所以请最好看看如下繁琐的概念,更容易理解. 没 ...

  9. Struts2远程代码执行漏洞预警

    近期struts2 框架再现高危远程命令执行漏洞,漏洞编号S2-045,CVE编号CVE-2017-5638.利用此漏洞可对使用了struts2框架的网站进行远程命令执行,对服务器造成威胁.请相关单位 ...

  10. CSS实现水平垂直居中方式

    1.定位 核心代码实现请看示例代码中的注释: <!DOCTYPE html> <html lang="zh"> <head> <meta ...