浅谈Javascript数据属性与访问器属性


Posted in Javascript onJuly 26, 2016

ES5中对象的属性可以分为‘数据属性'和‘访问器属性'两种。

数据属性一般用于存储数据数值,访问器属性对应的是set/get操作,不能直接存储数据值。

数据属性特性:value、writable、enumerable、configurable。

解释:configurable:true/false,是否可以通过delete删除属性,能否修改属性的特性,能否把属性修改为访问器属性,默认false;

enumerable:true/false,是否可以通过for in循环返回,默认false;

writable:true/false,是否可以修改属性的值,默认false;

value:undefined,设置属性的值,默认undefined。

访问器属性特性:set、get、enumerable、configurable。

解释:configurable:true/false,是否可以通过delete删除属性,能否修改属性的特性,能否把属性修改为访问器属性,默认false;

enumerable:true/false,是否可以通过for in循环返回,默认false;

set:function,读取属性值时调用的函数;

get:function,修改属性值时调用的函数。

将属性添加到对象或修改现有属性的特性使用Object.defineProperty() 或 Object.defineproperties()方法;

Object.defineProperty(object, propertyname, descriptor):

参数解释:object:需要添加或修改属性的对象;

propertyname:属性的名称,字符串格式;

descriptor:属性的描述,设置数据属性或访问器属性的特性。

实例分析:

数据属性:

var emp = {

name:'tom'

};

 

Object.defineProperty(emp,'name',{

writable:false

});

emp.name = 'jery';
console.log(emp.name);//输出tom,因为已经设置了writable为false



Object.defineProperty(emp,'age',{

configurable:false,

writable:true,

value:22

});

console.log(emp.age);//输出22,因为设置了value为22

emp.age = 25;

console.log(emp.age);//输出25,设置了writable为true

delete emp.age;

console.log(emp.age);//输出25,设置了configurable为false,此属性删除不了

访问器属性:

var emp ={

_name:'tom',

_age:20

};



Object.defineProperty(emp,'name',{

get:function(){

return this._name;

}

});

console.log(emp.name);//输出tom,由get方法返回_name的值

emp.name = 'jery';

console.log(emp.name);//输出tom,没有set方法,修改不了_name的值

 

Object.defineProperty(emp,'age',{

configurable:true,

get:function(){

 return this._age;

}

set:function(age){

this._age = age;

}

});

emp.age = 25;
console.log(emp.age)//输出25,emp.age=25是使用set方法将25赋值给_age,emp.age是使用get方法将_age的读取出来

delete emp.age;

console.log(emp.age);//输出undefined,configurable为true,可以使用delete方法将emp.age属性删除

 备注:访问器属性可以起到很好的保护作用,当只有get方法时,就实现只读不能写;反之,只有set时,便是只能写入而不能读取

以上就是小编为大家带来的浅谈Javascript数据属性与访问器属性全部内容了,希望大家多多支持三水点靠木~

Javascript 相关文章推荐
用JS实现的一个include函数
Jul 21 Javascript
javascript中的变量是传值还是传址的?
Apr 19 Javascript
基于Jquery的文字滚动跑马灯插件(一个页面多个滚动区)
Jul 26 Javascript
一个简单的瀑布流效果(主体形式自写)
May 27 Javascript
Jquery实现自定义tooltip示例代码
Feb 12 Javascript
js检验密码强度(低中高)附图
Jun 05 Javascript
jquery动态增加删减表格行特效
Nov 20 Javascript
JS中的eval 为什么加括号
Apr 13 Javascript
Angular.Js中ng-include指令的使用与实现
May 07 Javascript
angular第三方包开发整理(小结)
Apr 19 Javascript
微信小程序实现搜索指定景点周边美食、酒店
May 18 Javascript
JS如何把字符串转换成json
Feb 21 Javascript
js判断空对象的实例(超简单)
Jul 26 #Javascript
全面了解构造函数继承关键apply call
Jul 26 #Javascript
JS面试题---关于算法台阶的问题
Jul 26 #Javascript
对Js OOP编程 创建对象的一些全面理解
Jul 26 #Javascript
jQuery仿京东商城楼梯式导航定位菜单
Jul 25 #Javascript
又一枚精彩的弹幕效果jQuery实现
Jul 25 #Javascript
EasyUI加载完Html内容样式渲染完成后显示
Jul 25 #Javascript
You might like
MySQL授权问题总结
2007/05/06 PHP
php编程实现获取excel文档内容的代码实例
2011/06/28 PHP
一个PHP并发访问实例代码
2012/09/06 PHP
php判断是否为ajax请求的方法
2016/11/29 PHP
浅谈PHP的反射机制
2016/12/15 PHP
用js实现的仿sohu博客更换页面风格(简单版)
2007/03/22 Javascript
基于KMP算法JavaScript的实现方法分析
2013/05/03 Javascript
JQuery获取与设置HTML元素的内容或文本的实现代码
2014/06/20 Javascript
JS数组(Array)处理函数整理
2014/12/07 Javascript
jQuery中toggle()函数的使用实例
2015/04/17 Javascript
js上传图片及预览功能实例分析
2015/04/24 Javascript
JavaScript实现select添加option
2015/07/03 Javascript
详解Javascript中prototype属性(推荐)
2016/09/03 Javascript
原生JS下拉加载插件分享
2016/12/26 Javascript
带你了解session和cookie作用原理区别和用法
2017/08/14 Javascript
解决ie img标签内存泄漏的问题
2017/10/13 Javascript
nodejs使用express获取get和post传值及session验证的方法
2017/11/09 NodeJs
setTimeout时间设置为0详细解析
2018/03/13 Javascript
Vue实现点击时间获取时间段查询功能
2020/08/21 Javascript
微信小程序非跳转式组件授权登录的方法示例
2019/05/22 Javascript
前端性能优化建议
2020/09/17 Javascript
简单了解python协程的相关知识
2019/08/31 Python
推荐值得学习的12款python-web开发框架
2020/08/10 Python
基于CentOS搭建Python Django环境过程解析
2020/08/24 Python
Python中BeautifulSoup通过查找Id获取元素信息
2020/12/07 Python
python中yield的用法详解
2021/01/13 Python
详解如何使用Pytest进行自动化测试
2021/01/14 Python
HTML5 拖放功能实现代码
2016/07/14 HTML / CSS
布里斯班女装时尚品牌:Adrift
2017/12/28 全球购物
五年级音乐教学反思
2014/02/06 职场文书
领导班子四风表现材料
2014/08/23 职场文书
生产现场禁烟通知
2015/04/23 职场文书
作弊检讨书范文
2015/05/06 职场文书
离婚民事起诉状
2015/08/03 职场文书
python 利用PyAutoGUI快速构建自动化操作脚本
2021/05/31 Python
AngularJS实现多级下拉框
2022/03/25 Javascript