浅谈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 相关文章推荐
jQuery中的常用事件总结
Dec 27 Javascript
javascript 简单抽屉效果的实现代码
Mar 09 Javascript
js实现收缩菜单效果实例代码
Oct 30 Javascript
谈谈JavaScript中function多重理解
Aug 28 Javascript
JS获取月份最后天数、最大天数与某日周数的方法
Dec 08 Javascript
利用jQuery实现打字机字幕效果实例代码
Sep 02 Javascript
angularJS深拷贝详解
Mar 23 Javascript
Vue.JS实现垂直方向展开、收缩不定高度模块的JS组件
Jun 19 Javascript
jQuery实现基本淡入淡出效果的方法详解
Sep 05 jQuery
解决layui-table单元格设置为百分比在ie8下不能自适应的问题
Sep 28 Javascript
Javascript执行流程细节原理解析
May 14 Javascript
Vue解决echart在element的tab切换时显示不正确问题
Aug 03 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
rrmdir php中递归删除目录及目录下的文件
2011/05/15 PHP
PHP操作文件的一些基本函数使用示例
2014/11/18 PHP
PHP随机生成唯一HASH值自定义函数
2015/04/20 PHP
php array_key_exists() 与 isset() 的区别
2016/10/24 PHP
JQuery 选择和过滤方法代码总结
2010/11/19 Javascript
JavaScript学习笔记之JS对象
2015/01/22 Javascript
JavaScript中的DSL元编程介绍
2015/03/15 Javascript
javascript实现自动输出文本(打字特效)
2015/08/27 Javascript
JavaScript中Promise的使用详解
2017/02/26 Javascript
原生js实现放大镜特效
2017/03/08 Javascript
Vue中的数据监听和数据交互案例解析
2017/07/12 Javascript
最通俗易懂的javascript变量提升详解
2017/08/05 Javascript
Node.js成为Web应用开发最佳选择的原因
2018/02/05 Javascript
基于vue中解决v-for使用报红并出现警告的问题
2018/03/03 Javascript
layer插件select选中默认值的方法
2018/08/14 Javascript
vue根据值给予不同class的实例
2018/09/29 Javascript
通过循环优化 JavaScript 程序
2019/06/24 Javascript
Antd下拉选择,自动匹配功能的实现
2020/10/24 Javascript
Python实现二分法算法实例
2015/02/02 Python
python线程池threadpool实现篇
2018/04/27 Python
Tensorflow 训练自己的数据集将数据直接导入到内存
2018/06/19 Python
python中下标和切片的使用方法解析
2019/08/27 Python
pygame实现俄罗斯方块游戏(基础篇3)
2019/10/29 Python
Django模板之基本的 for 循环 和 List内容的显示方式
2020/03/31 Python
python爬虫基础知识点整理
2020/06/02 Python
python os.rename实例用法详解
2020/12/06 Python
Beauty Expert美国/加拿大:购买奢侈美容产品
2018/12/05 全球购物
激光脱毛、蓝光和护肤:Tria Beauty
2019/03/28 全球购物
软件测试英文面试题
2012/10/14 面试题
什么是lambda函数
2013/09/17 面试题
公务员的自我鉴定
2013/10/26 职场文书
2014年销售人员工作总结
2014/11/27 职场文书
2014年会计人员工作总结
2014/12/10 职场文书
2015年团支书工作总结
2015/04/03 职场文书
nginx简单配置多个server的方法
2021/03/31 Servers
Apache SkyWalking 监控 MySQL Server 实战解析
2022/09/23 Servers