JavaScript中setter和getter方法介绍


Posted in Javascript onJuly 11, 2016

javascript中的setter、getter是平时接触比较少的方法,其本身也并不是标准方法,只在非ie浏览器里支持(ie内核也许有其他方法可以做到呢?暂时不知其解),但是加以利用可以做许多事情,比如:

1、对数据的访问限制:

a.value是对value变量的getter方法调用,如果在getter方法实现中抛出异常,可以阻止对value变量的访问

2、对dom变量进行监听:

window.name是一个跨域非常好用的dom属性(大名鼎鼎,详见百度),如果覆盖window.name的setter实现则可以实现跨页面的内存异步通信

3、自己发挥想象力,能做的事情好多滴

以下皆转:
首先,我们先来快速了解什么是Getters和Setters,以及它们为什么很有用。然后,我们来看看现在都有哪些平台支持Gettets和Setters。

Getters和Setters

Getters和Setters使你可以快速获取或设置一个对象的数据。一般来说,一个对象拥有两个方法,分别用于获取和设置某个值,比如:

{
getValue: function(){
return this._value;
},
setValue: function(val){
this._value = val;
}
}

用这种方式写JavaScript的一个明显的好处是:你可以用它来隐藏那些不想让外界直接访问的属性。最终的代码看起来就像下面这样(用闭包保存新创建的Filed对象的value):

function Field(val){
var value = val;
this.getValue = function(){
return value;
};
this.setValue = function(val){
value = val;
};
}

于是我们可以这样使用:

var field = new Field("test");
field.value
// => undefined
field.setValue("test2")
field.getValue()
// => "test2"

我们来模拟上例中的 “隐藏的value属性”,我们的代码就像这样:

function Field(val){
var value = val;
this.__defineGetter__("value", function(){
return value;
});
this.__defineSetter__("value", function(val){
value = val;
});
}

但是呢,你不喜欢这样写,而倾向在对象的prototype中定义getters和setters(私有变量写在哪并不重要),我们可以用另一种语法。

function Field(val){
this.value = val;
}
Field.prototype = {
get value(){
return this._value;
},
set value(val){
this._value = val;
}
};

这种语法看起来很不可思议,但是使用过一段时间之后,接受它也很容易。

接下来是另一个例子,它允许外界获取一个username数组,但是却不能获取原始的,隐藏的user对象。

function Site(users){
this.__defineGetter__("users", function(){
// JS 1.6 Array map()
return users.map(function(user){
return user.name;
});
};
}

记住以下几点:

一个对象内,每个变量只能有一个getter或setter。(因此value可以有一个getter和一个setter,但是value绝没有两个getters)
删除getter或setter的唯一方法是:delete object[name]。delete可以删除一些常见的属性,getters和setters。
如果使用__defineGetter__或__defineSetter__,它会重写之前定义的相同名称的getter或setter,甚至是属性(property)。

平台

支持的浏览器有:

Firefox
Safari 3+
Opera 9.5

以上所述是小编给大家介绍的JavaScript中setter和getter方法介绍的全部叙述,希望对大家有所帮助,如果大家想了解更多内容,敬请关注三水点靠木。

Javascript 相关文章推荐
javascript测试题练习代码
Oct 10 Javascript
使用js检测浏览器的实现代码
May 14 Javascript
jquery和javascript的区别(常用方法比较)
Jul 04 Javascript
JavaScript运动减速效果实例分析
Aug 04 Javascript
浅析Javascript匿名函数与自执行函数
Feb 06 Javascript
Bootstrap风格的WPF样式
Dec 07 Javascript
JavaScript如何一次性展示几万条数据
Mar 30 Javascript
JavaScript编程设计模式之观察者模式(Observer Pattern)实例详解
Oct 25 Javascript
利用Javascript实现一套自定义事件机制
Dec 14 Javascript
使用live-server快速搭建本地服务器+自动刷新的方法
Mar 09 Javascript
原生JS封装_new函数实现new关键字的功能
Aug 12 Javascript
微信小程序列表时间戳转换实现过程解析
Oct 12 Javascript
jQuery 3.0 的 setter和getter 模式详解
Jul 11 #Javascript
仿百度换肤功能的简单实例代码
Jul 11 #Javascript
全面了解JavaScirpt 的垃圾(garbage collection)回收机制
Jul 11 #Javascript
全面理解闭包机制
Jul 11 #Javascript
js 判断一组日期是否是连续的简单实例
Jul 11 #Javascript
利用css+原生js制作简单的钟表
Apr 07 #Javascript
js仿百度切换皮肤功能(html+css)
Jul 10 #Javascript
You might like
PHP学习之PHP变量
2006/10/09 PHP
用PHP的ob_start();控制您的浏览器cache!
2007/02/14 PHP
PHP中array_slice函数用法实例详解
2014/11/25 PHP
pace.js页面加载进度条插件
2015/09/29 Javascript
js使用cookie记录用户名的方法
2015/11/26 Javascript
vue动态生成dom并且自动绑定事件
2017/04/19 Javascript
详解JS获取HTML DOM元素的8种方法
2017/06/17 Javascript
Angular2 http jsonp的实例详解
2017/08/31 Javascript
javascript  删除select中的所有option的实例
2017/09/17 Javascript
详解10分钟学会vue滚动行为
2017/09/21 Javascript
Angular5集成eventbus的示例代码
2018/07/19 Javascript
JavaScript去掉数组重复项的方法分析【测试可用】
2018/07/19 Javascript
layui 给数据表格加序号的方法
2018/08/20 Javascript
详解node字体压缩插件font-spider的用法
2018/09/28 Javascript
JS 逻辑判断不要只知道用 if-else 和 switch条件判断(小技巧)
2020/05/27 Javascript
python实现360皮肤按钮控件示例
2014/02/21 Python
Python中map,reduce,filter和sorted函数的使用方法
2015/08/17 Python
python 循环while和for in简单实例
2016/08/16 Python
Python实现统计给定字符串中重复模式最高子串功能示例
2018/05/16 Python
使用Numpy读取CSV文件,并进行行列删除的操作方法
2018/07/04 Python
python 中如何获取列表的索引
2019/07/02 Python
Python3之字节串bytes与字节数组bytearray的使用详解
2019/08/27 Python
pytorch中的上采样以及各种反操作,求逆操作详解
2020/01/03 Python
浅谈opencv自动光学检测、目标分割和检测(连通区域和findContours)
2020/06/04 Python
JD Sports意大利:英国篮球和运动时尚的领导者
2017/10/29 全球购物
JD Sports德国官网:英国领先的运动鞋和运动服饰零售商
2018/02/26 全球购物
欧洲有机婴儿食品最大的市场:Organic Baby Food(供美国和加拿大)
2018/03/28 全球购物
英国在线购买马术服装:EQUUS
2019/07/12 全球购物
求职简历推荐信范文
2013/12/02 职场文书
光盘行动倡议书
2014/02/02 职场文书
仓库规划计划书
2014/04/28 职场文书
机关职员工作检讨书
2014/10/23 职场文书
教你用Python爬取英雄联盟皮肤原画
2021/06/13 Python
Python 全局空间和局部空间
2022/04/06 Python
Python使用Opencv打开笔记本电脑摄像头报错解问题及解决
2022/06/21 Python
Python pyecharts案例超市4年数据可视化分析
2022/08/14 Python