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 相关文章推荐
utf8的编码算法 转载
Dec 27 Javascript
JavaScript 在各个浏览器中执行的耐性
Apr 06 Javascript
js生成随机数之random函数随机示例
Dec 20 Javascript
JavaScript使用function定义对象并调用的方法
Mar 23 Javascript
jQuery中 delegate使用的问题
Jul 03 Javascript
深入理解Angularjs向指令传递数据双向绑定机制
Dec 31 Javascript
jquery中绑定事件的异同
Feb 28 Javascript
Vue2.0用户权限控制解决方案
Nov 29 Javascript
javascript实现循环广告条效果
Dec 12 Javascript
Vue-cropper 图片裁剪的基本原理及思路讲解
Apr 17 Javascript
浅析vue给不同环境配置不同打包命令
Aug 17 Javascript
vue实现手机号码的校验实例代码(防抖函数的应用场景)
Sep 05 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 UTF8编码内的繁简转换类
2009/07/20 PHP
php数组函数序列之array_values() 获取数组元素值的函数与方法
2011/10/30 PHP
php文件服务实现虚拟挂载其他目录示例
2014/04/17 PHP
PHP中实现接收多个name相同但Value不相同表单数据实例
2015/02/03 PHP
PHP5.3以上版本安装ZendOptimizer扩展
2015/03/27 PHP
基于PHP实现的事件机制实例分析
2015/06/18 PHP
codeigniter实现get分页的方法
2015/07/10 PHP
php实现json编码的方法
2015/07/30 PHP
PHP多维数组遍历方法(2种实现方法)
2015/12/10 PHP
PHP给源代码加密的几种方法汇总(推荐)
2018/02/06 PHP
PHP实现浏览器格式化显示XML的方法示例
2019/01/22 PHP
jQuery 名称冲突的解决方法
2011/04/08 Javascript
jquery中dom操作和事件的实例学习 下拉框应用
2011/12/01 Javascript
js出生日期 年月日级联菜单示例代码
2014/01/10 Javascript
IE中JS跳转丢失referrer问题的2个解决方法
2014/07/18 Javascript
js跨域请求数据的3种常用的方法
2015/12/01 Javascript
AngularJS监听路由变化的方法
2017/03/07 Javascript
node基于async/await对mysql进行封装
2019/06/20 Javascript
解决Layui中layer报错的问题
2019/09/03 Javascript
有关vue 开发钉钉 H5 微应用 dd.ready() 不执行问题及快速解决方案
2020/05/09 Javascript
Python操作SQLite简明教程
2014/07/10 Python
详解Django框架中用context来解析模板的方法
2015/07/20 Python
Python实现简单文本字符串处理的方法
2018/01/22 Python
Python OpenCV实现视频分帧
2019/06/01 Python
Python Numpy库常见用法入门教程
2020/01/16 Python
python神经网络编程实现手写数字识别
2020/05/27 Python
IntelliJ 中配置 Anaconda的过程图解
2020/06/01 Python
Python基于smtplib协议实现发送邮件
2020/06/03 Python
Java的for语句中break, continue和return的区别
2013/12/19 面试题
大专毕业生自我评价分享
2013/11/10 职场文书
奥巴马获胜演讲稿
2014/05/15 职场文书
银行求职自荐书
2014/06/25 职场文书
无犯罪记录证明
2014/09/19 职场文书
婚礼迎宾词大全
2015/08/10 职场文书
如何用JavaScript实现一个数组惰性求值库
2021/05/05 Javascript
基于PyQT5制作一个桌面摸鱼工具
2022/02/15 Python