属性描述符

JavaScript提供了一个内部数据结构,用于描述对象的值,控制其行为,例如该属性是否可写、是否可配置、是否可修改以及是否可枚举等。这个内部数据结构被称为‘属性描述符’。
每个属性都有自己对应的属性描述符,保存该属性的元信息。

{value:'前端',writable:false,enumerable:true,configurable:false,get:undefined,set:undefined
}

对象里目前存在的属性描述符有两种主要形式:数据描述符和存取描述符

数据描述符

数据描述符是一个具有值的属性,该值可能是可写的,也可能不是可写的。数据描述符具有以下可选键值:

  • value:该属性对应的值,可以是任何有效的JavaScript值(数值,对象,函数等)。默认为undefined
  • writable:当该属性的writable为true时,value才能被赋值运算符改变。默认为false
  • configurable:当该属性的configurable为true时,该属性描述符才能够被改变,同时该属性也能从对应的对象上被删除,默认为false
  • enumerable:当该属性的enumerable为true时,该属性才能够出现在对象的枚举属性中,默认为false

存取描述符

存取描述符是由getter-setter函数对描述的属性。存取描述符具有以下可选键值:

  • get:给属性提供getter的方法,如果没有getter则为undefined。当访问该属性时,该方法会被执行,方法执行时没有参数传入,但是会传入this对象
  • set:给属性提供setter的方法,如果没有setter则为undefined。当属性值修改时,触发执行该方法。该方法将接受唯一参数,即该属性新的参数值。
  • configurable:当该属性的configurable为true时,该属性描述符才能够被改变,同时该属性也能从对应的对象上被删除,默认为false
  • enumerable:当该属性的enumerable为true时,该属性才能够出现在对象的枚举属性中,默认为false。

获取属性描述符

Object.getOwnPropertyDescriptor()方法返回指定对象上一个自有属性对应的属性描述符。

Object.getOwnPropertyDescriptor(obj,prop)
  • obj:需要查找的目标对象
  • prop:目标对象内属性名称(String类型)
  • 返回值:如果指定的属性存在于对象上,则返回其属性描述符对象,否则返回undefined
var obj={}
obj.attr='前端';console.log(Object.getOwnPropertyDescriptor(obj,'attr'));

设置属性描述符

1.Object.defineProperty()方法为对象定义新属性或修改现有属性,并返回该对象

Object.defineProperty(obj,prop,descriptor);
  • obj:要在其上定义属性的对象
  • prop:要定义或修改的属性的名称
  • descriptor:将传递给函数的对象
  • 返回值:被传递给函数的对象

2.Object.defineProperties()方法为对象定义一个或多个新属性或修改现有属性,并返回该对象

Object.defineProperties(obj,props)
  • obj:要在其上定义属性的对象
  • props:要定义其可枚举属性或修改的属性描述符的对象
  • 返回值:被传递给函数的对象

属性描述符的可选键值

1.value:表示目标属性对应的值。可以是任何有效的JavaScript值(数值,对象,函数等)。默认为undefined

var obj={};
obj.name='张三';var attr=Object.getOwnPropertyDescriptor(obj,'name');
console.log(attr.value);Object.defineProperty(obj,'name',{value:'李四'});
console.log(obj.name);

2.writable:Boolean值,表示目标属性的值是否可以被修改。当该属性的writable为true时,value才能被赋值运算符改变。默认为false

var obj={};
Object.defineProperty(obj,'attr',{value:'前端',writable:false
});
console.log(obj.attr);
obj.attr=100;
console.log(obj.attr);

3.configurable:Boolean值,表示目标属性的描述符是否可以修改。当该属性的configurable为true时,该属性描述符才能够被改变,同时该属性也能从对应的对象上被删除。默认为false

var obj=Object.definePropety({},'attr',{value:'大前端',configurable:false
});Object.definePropety(obj,'attr',{value:100});
Object.definePropety(obj,'attr',{writable:true});
Object.definePropety(obj,'attr',{enumerable:true});
Object.definePropety(obj,'attr',{configurable:true});

4.enumerable:Boolean值,表示目标属性是否可遍历。当该属性的enumerable为true时,该属性才能够出现在对象的枚举属性中。默认为false
如果对象的属性的enumerable的值为false,以下三种操作取不到该属性:

  • for...in语句
  • Object.keys()方法
  • JSON.stringify()方法
var obj={};
Object.defineProperty(obj,'attr',{value:'前端',enumerable:false});
for(var key in obj){console.log(key);}
console.log(Object.keys(obj));
console.log(JSON.stringify(obj));

属性描述符的存取器

对象的属性除了可以直接定义以外,还可以使用存取器进行定义。其中setter为存值函数,使用属性描述符中的set;getter为取值函数,使用属性描述符中的get

var obj=Object.defineProperty({},'attr',{get:function(){return '前端';},set:function(){console.log('setter:'+value);}
});console.log(obj.attr);
obj.attr=100;

JavaScript中除了上述存取器的写法之外,还提供了以下写法:

var obj={get attr(){return '前端';},set attr(value){console.log('setter:'+value);}
}console.log(obj.attr);
obj.attr=100;

防篡改

定义的对象默认在任何时候、任何位置,无论有意义的还是无意义的都可以修改对象的属性或方法。
而这些篡改可能会影响对象的内置属性或方法,从而导致对象的正常功能可能无法使用。
1.禁止扩展:禁止为对象扩展新的属性或方法

var obj={};
Object.preventExtensions(obj);
obj.attr='前端';
console.log(Object.isExtensible(obj));
console.log(obj.attr);

2.密封对象:禁止扩展新的属性或方法,禁止配置现有的属性或方法的描述符,仅允许读写属性的值

var sealed={};
Object.seal(sealed);
Object.isSealed(sealed);Object.isExtensible(sealed);

3.冻结对象:禁止对对象执行任何修改操作

var frozen={1:81};
Object.isFrozen(frozen);
Object.freeze(frozen);
Object.isFrozen(frozen);Object.isSealed(frozen);
Object.isExtensible(frozen);

javaScript中的Object类型相关推荐

  1. 为什么要在JavaScript中使用静态类型? (使用Flow进行静态打字的4部分入门)

    by Preethi Kasireddy 通过Preethi Kasireddy 为什么要在JavaScript中使用静态类型? (使用Flow进行静态打字的4部分入门) (Why use stati ...

  2. javascript优缺点_为什么要在JavaScript中使用静态类型? 优缺点

    javascript优缺点 by Preethi Kasireddy 通过Preethi Kasireddy 为什么要在JavaScript中使用静态类型? 优缺点 (Why use static t ...

  3. 创建健壮的isArray()函数(JavaScript中判断对象类型的种种方法)

    我们知道,JavaScript中检测对象类型的运算符有:typeof.instanceof,还有对象的constructor属性: 1) typeof 运算符 typeof 是一元运算符,返回结果是一 ...

  4. JavaScript面向对象之Object类型

    大家都知道对象都是属于Object类型的.下面是一些详细总结,希望可以帮助到有需要的小伙伴. JavaScript面向对象之Object类型 在JS中所有的对象都拥有同一个父级,就是Object. O ...

  5. 解析JavaScript中的字符串类型与字符编码支持

    JavaScript中的字符串也像Python那样支持反斜杠的转移,并且字符集方面默认为Unicode,下面就来详细解析JavaScript中的字符串类型与字符编码支持 定义 字符串就是零个或多个排在 ...

  6. 为什么要在JavaScript中使用静态类型? 我们是否应该使用它们?

    by Preethi Kasireddy 通过Preethi Kasireddy 为什么要在JavaScript中使用静态类型? 我们是否应该使用它们? (Why use static types i ...

  7. thrift如何定义Java中的object类型

    目录 thrift如何定义Java中的Object类型 方法一:使用联合(union) 方法二:使用特殊类型(binary) 终极方法:序列化 thrift如何定义Java中的Object类型 由于t ...

  8. 详解Javascript中的Object对象

    本文地址:http://luopq.com/2016/02/28/Object-in-Javascript/,转载请注明 Object是在javascript中一个被我们经常使用的类型,而且JS中的所 ...

  9. javascript中对变量类型的判断

    在JavaScript中,有5种基本数据类型和1种复杂数据类型,基本数据类型有:Undefined,Null,Boolean, Number和String:复杂数据类型是Object,Object中还 ...

  10. javascript中对变量类型的推断

    本文正式地址:http://www.xiabingbao.com/javascript/2015/07/04/javascript-type 在JavaScript中,有5种基本数据类型和1种复杂数据 ...

最新文章

  1. 利用PCA进行数据降维
  2. 深度学习笔记:Tensorflow手写mnist数字识别
  3. mysql query 原理_[转]MySQL的Query Cache原理
  4. OstrichNet 简易统计信息收集工具
  5. 左神直通BAT算法(进阶篇)-上
  6. oracle执行计划explain,Oracle 常见的执行计划步骤(explain结果的Description数据参考)...
  7. Catch the moments of your life. Catch them while you're young and quick.
  8. c++ 线程函数(类成员函数作为线程函数使用)
  9. STM32 TIM高级定时器死区时间的计算
  10. 在vue中使用turn.js
  11. vos3000外呼系统话机或网关注册掉线或未注册怎样解决
  12. 初创公司如何选择企业级服务器配置
  13. check mk 监控 oracle
  14. nachos源码阅读 (内存管理)
  15. STM32系列之HAL库开发
  16. 智能突触《Continual Learning Through Synaptic Intelligence》(SI)
  17. [转] Real-World Concurrency
  18. mysql编写1到n的奇数和_输入一整数n,输出1~n之间的奇数和(若n为奇数则包括n) 编程...
  19. 机器学习笔记之狄利克雷过程(四)从概率图角度认识狄利克雷过程
  20. ArcGIS教程:半变异函数与协方差函数

热门文章

  1. Atitit SOW项目工作说明书 目录 1. SOW工作说明书(Statement of Work,简称SOW) 1 2. 项目工作范围 1 3. 工作期限和工作量估计 1 4. 交付成果(源码
  2. Atitit 提升扩展性指标与方法总结 目录 1. 扩展性常见指标 1 1.1. 代码简洁,应业务变动调整修改少 1 1.2. 免编译 1 1.3. 是否支持热部署 2 2. 常见的方法策略 2
  3. Atitti opencv2.4 实现的人脸检测 attilax总结
  4. Atitit 判断判断一张图片是否包含另一张小图片
  5. Atitit.java 虚拟机的构成 与指令分类 与 指令集合 以及字节码查看工具javjap
  6. paip.gui控件form窗体的原理实现以及easyui的新建以及编辑实现
  7. 路孚特:金融行业数据复杂 成本高 难获取 看路孚特如何打破困局
  8. 2022趋势洞见之“云网端融合”
  9. 2018 OpenInfra Days China官方盛典邀您莅临!文末有福利!
  10. 【优化分类】基于matlab改进的人工蜂群算法优化SVM分类【含Matlab源码 1833期】