浅谈Javascript数据属性与访问器属性
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 数据属性和访问器属性
在JavaScript中对象被定义为"无序属性的集合,其属性可以包含基本值.对象或函数."通俗点讲,我们可以把对象理解为一组一组的名值对,其中值可以是数据或函数. 创建自定义对象通 ...
- JavaScript数据属性与访问器属性
ES5中对象的属性可以分为‘数据属性’和‘访问器属性’两种. 数据属性一般用于存储数据数值,访问器属性对应的是set/get操作,不能直接存储数据值. 数据属性特性:value.writable.en ...
- JavaScript | 数据属性与访问器属性
属性类型 数据属性 - 包含一个数据值的位置,可以读取和写入值 [writable] 是否能修改属性的值 true [enumerable] 是否通过for in 循环返回属性(是否可以被枚举) tr ...
- javascript数据属性和访问器属性
var book={ _year:2004, edition:1};Object.defineProperty(book,"year",{ get:function(){ retu ...
- JavaScript 属性类型(数据属性和访问器属性)
数据属性 数据属性包含一个数据值的位置.在这个位置可以读取和写入值.数据属性有 4 个描述其行为的特性. [[Configurable]]:表示能否通过 delete 删除属性从而重新定义属性,能否修 ...
- javascript对象属性——数据属性和访问器属性
ECMA-262第五版在定义时,描述了属性property的各种特征,定义这些特性是为了实现javascript引擎用的,为了表示该特性是内部值,规范把它们放在了两对儿方括号中,例如[[Enumera ...
- JavaScript中的数据属性和访问器属性
在学习JavaScript原型(prototype)和原型链(prototype chain)知识的时候,发现数据属性和访问器属性的重要性,通过不断的查找相关知识,浅显理解如下,若有差错,希望不吝赐教 ...
- Js中的数据属性和访问器属性
Js中的数据属性和访问器属性 在javaScript中,对象的属性分为两种类型:数据属性和访问器属性. 一.数据属性 1.数据属性:它包含的是一个数据值的位置,在这可以对数据值进行读写. 2.数据属性 ...
- js中属性类型:数据属性与访问器属性
js中属性类型分为两种:数据属性和访问器属性 在js中,对象都是由名值对构成的,名:就是我们所说的属性名,值就是属性对应的值(基本值.对象.方法). ECMA-262第5版定义了只有内部才用的特性,描 ...
随机推荐
- C# AVI Image 转换
AVI视频库 http://download.csdn.net/download/qc_id_01/9970151 Avi视频文件的编码有很多,这个库只支持部分Avi文件,有些Avi文件不支持,具体哪 ...
- 【POJ1011】Sticks
[题目概括] 现在有\(n\)个长度不超过\(50\)的木棍,请你把这些小木棍拼成若干根长度相同的木棍. 请你最小化拼成后的长度. [思路要点] 考虑枚举最后的长度,然后判断是否可以,这样就不需要最优 ...
- python模块turtle简单用法
##初始化turtle:t = turtle.Turtle() 或者 t = turtle.Pen()##查询turtle状态#位置t.position() #箭头朝向,箭头朝向按照顺时针或者逆时针偏 ...
- Linux命令-磁盘管理(一)
Linux命令-磁盘管理(一) Linux cd命令 Linux cd命令用于切换当前工作目录至 dirName(目录参数). 其中 dirName 表示法可为绝对路径或相对路径.若目录名称省略,则变 ...
- AtCoder AGC036C GP 2 (组合计数)
题目链接 https://atcoder.jp/contests/agc036/tasks/agc036_c 题解 终于有时间补agc036的题了. 这题其实不难的来着--我太菜了考场上没想出来 首先 ...
- MiracleSnow网页设计HTML5+CSS3+JS全套视频教程
终于把这套课程讲完了,虽然时间隔了很长,但也算有始有终了,这是在YY讲课中我自己录的,讲了网页设计的基础,这也是我第一次给那么多人讲课,讲的不好多多包涵. 前几次视频和课件是分开的,后几次都打包在一起 ...
- JavaWeb-SpringBoot_一个类实现腾讯云SDK发送短信
腾讯云应用列表 传送门 使用Gradle编译项目 传送门 SDK&API:qcloudsms_java 传送门 package com.Gary.sms.controller; import ...
- 两种建立堆的方法HeapInsert & Heapify
参考 堆排序中两种建堆方法的比较 第一种方法HeapInsert 它可以假定我们事先不知道有多少个元素,通过不断往堆里面插入元素进行调整来构建堆. 它的大致步骤如下: 首先增加堆的长度,在最末尾的地方 ...
- 并发编程--Concurrent-工具类介绍
并发编程--Concurrent-工具类介绍 并发编程--Concurrent-工具类介绍 CountDownLatch CylicBarrier Semaphore Condition 对象监视器下 ...
- Zookeeper基础命令操作
转载链接:https://blog.csdn.net/dandandeshangni/article/details/80558383 安装参考链接https://blog.csdn.net/qiun ...