js中的对象有一些内部才用的特性,这些特性是为了实现javascript引擎用的,因此在javascript中不能直接访问它们。

有两种属性:数据属性 && 访问器属性

数据属性

  • [[ configurable ]]: 表示能否通过 delete 删除属性然后重新定义属性,能否修改属性的特性,或者能否把属性修改为访问器属性。直接在对象上定义的属性,它们这个特性的默认值为 true;
  • [[ enumerable ]]: 表示能否通过 for-in 循环返回属性。直接在对象上定义的属性,它们这个特性的默认值为 true;
  • [[ writable ]]: 表示能否修改属性的值。直接在对象上定义的属性,它们这个特性的默认值为 true;
  • [[ value ]]: 包含这个属性的数据值。读取属性值的时候,从这个位置读;写入属性的时候,把新值保存在这个位置。这个特性的默认值为 undefined ;

要修改属性的特性,必须使用 ES5 的 Object.definePrototype() 方法。这个方法接受三个参数:

1、属性所在的对象。

2、属性的名字。

3、描述符对象。属性必须是:configurableenumerablewritablevalue中的一个或多个。

var obj = {};
Object.defineProperty(obj, 'name', {writable: false,  // 不能修改值value: '张三'
})
console.log(obj.name); // 张三
obj.name = '李四';
console.log(obj.name); // 张三,  writable设为 false 后,值就没法修改了。
var person = {name: '李四',age: 24
}
delete person.name;
console.log(person); // {age: 24}
Object.defineProperty(person, 'age', {configurable: false
})
delete person.age;
console.log(person);// {age: 24} configurable特性设为 false 后,就没法使用 delete 删除了。
复制代码

把 configurable 设置为 false 后,就不能用 delete 删除属性,而且,也不能修改 除 writable 外的特性。

var obj = {};
Object.defineProperty(obj, "name", {configurable: false,value: '张三'
})// 会抛出错误
Object.defineProperty(obj, "name", {configurable: true,value: '张三'
})
复制代码

也就是说,可以多次调用 Object.defineProperty()方法修改同一个属性,但在把 configurable特性设置为 false 后就有限制了。

在调用Object.defineProperty()方法创建一个新的属性时,如果不指定,configurableenumerablewritable 特性的默认值都是 false,如果是修改已存在的属性,就不会有这个限制。

访问器属性

访问器属性没有数据值,有getset函数。读取访问器属性时,会调用 get函数,在写入值时会调用set函数。

访问器属性有如下四个特性:

  • [[ configurable ]]: 表示能否通过 delete 删除属性,从而重新定义属性。能否修改属性的特性,或者能否把属性修改为数据属性。直接在对象上定义的属性,它们这个特性的默认值为 true;
  • [[ enumerable ]]: 表示能否通过 for-in 循环返回属性。直接在对象上定义的属性,它们这个特性的默认值为 true;
  • [[ get ]]: 读取属性时,调用的函数。默认值为 undefined;
  • [[ set ]]: 写入属性时,调用的函数。默认值为 undefined;

访问器属性不能直接定义,必须通过Object.defintProperty()来定义。

"use strict"
let person = {name: '张三',age: 25
}
Object.defineProperty(person, 'oldAge', {get: function () {return this.age + 1;},set: function (newValue) {if (newValue > this.age) {this.age = newValue - 1;this.name = '李四'} else {this.age = newValue + 1;this.name = "王五"}}
})person.oldAge = 28;
console.log(person); // {name: '李四', age: 27};
复制代码

上面定义了一个 person 对象。默认有两个属性, "name"、"age"。新增了一个访问器属性 "oldAge"。它包含了两个函数。 get 函数用来返回值。set函数,当为 "oldAge"写入值的时候,会调用。把 oldAge 设置为 27 后,调用 set 函数,改变了 person 对象的 "name" 和 "age" 属性值。

不一定非要同时指定 setget函数。只指定 get函数,意味着属性不能写,严格模式会报错。只指定了set函数,属性就不能读取,严格模式同样会报错。


定义多个属性

ES5 定义了一个 Object.defineProperties() 方法,可以通过描述符一次定义多个属性。这个方法,接受两个对象参数:第一个是要添加和修改其属性的对象,第二个就是要设置的属性的对象。

let car = {};
Object.defineProperties(car, {createYear: {writable: false,value: 2010},color: {writable: true,value: 'block'},severalYear: {get: function () {return parseInt(new Date().getFullYear()) - this.createYear},set: function (newValue) {if (newValue > 2010) {this.color = 'red';}} }
})
console.log(car.createYear); // 2010
console.log(car.color);  // 'block'
console.log(car.severalYear); // 8
car.severalYear = 2015;
console.log(car.createYear); // 2010
console.log(car.color);  // 'red'
console.log(car.severalYear);  // 8
复制代码

需要注意的是:虽然我们设置 car.severalYear = 2015. 但是car.severalYear的值并没有改变。因为为访问器属性写入值的时候,只是会去执行 set 函数,而真实的值只能是通过get函数返回。


读取属性的特性

使用 ES5 的 Object.getOwnPropertyDescriptor()方法,可以取得给定属性的描述符。这个方法接受两个参数:

1、属性所在的对象。

2、属性名称。

返回值是一个对象,如果是数据属性,这个对象的属性有:configurableenumerablewritablevalue。 如果是一个访问器属性,对象的属性有:configurableenumerablegetset

let car = {};
Object.defineProperties(car, {createYear: {writable: false,value: 2010},color: {writable: true,value: 'block'},severalYear: {get: function () {return parseInt(new Date().getFullYear()) - this.createYear},set: function (newValue) {if (newValue > 2010) {this.color = 'red';}} }
})let descriptpor = Object.getOwnPropertyDescriptor(car, "createYear");
console.log(descriptpor);
// { value: 2010,
//   writable: false,
//   enumerable: false,
//   configurable: false }let fangdescriptpor = Object.getOwnPropertyDescriptor(car, "severalYear");
console.log(fangdescriptpor); // 看下图
复制代码

在 JavaScript 中可以针对任何对象-----包括 DOM 和 BOM 对象使用 Object.getOwnPropertyDescriptor()方法。

转载于:https://juejin.im/post/5abce33e6fb9a028cf328eb2

面向对象--内部属性类型相关推荐

  1. JavaScript面向对象之Object类型

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

  2. 《大话Java性能优化》面向对象及基础类型相关部分

    3.1 面向对象及基础类型 3.1.1 采用Clone()方式创建对象 Java语言里面的所有类都默认继承自java.lang.Object类,在java.lang.Object类里面有一个clone ...

  3. python面向对象类属性_python面向对象之类属性和类方法案例分析

    本文实例讲述了python面向对象之类属性和类方法.分享给大家供大家参考,具体如下: 目标 类的结构 类属性和实例属性 类方法和静态方法 01. 类的结构 1.1 术语 -- 实例 使用面相对象开发, ...

  4. 三. python面向对象(私有属性和私有方法 私有静态方法 私有类方法)

    一. 私有属性(封装) # 侠义 上的封装 面向对象的三大特性之一 # 属性 和 方法都隐藏起来 不让你看到 # 如果要让内部属性不被外部属性直接访问 在属性前加上两个下划线__ # 在python中 ...

  5. JavaScript 中对象的属性类型

    对象的属性类型 JavaScript 中的对象的属性包括数据属性和访问器属性,在 JavaScript 引擎的内部实现中定义了用于描述属性(property)的特性(attribute).规范中将特性 ...

  6. swift面向对象之属性

    swift面向对象之属性 swift属性 存储属性 可以存储常量和变量 惰性存储属性 语法:lazy var 变量 惰性存储属性只有在用的时候才会完成真正的初始化,刚开始的初始化代码只是类型占位,并没 ...

  7. JavaScript面向对象之Function类型

    JavaScript面向对象之Function类型 下面是我对Function类型的总结,希望对您有帮助. "函数式编程"是一种"编程范式"(programmi ...

  8. JS对象中的属性类型、属性定义和属性读取

    理解对象 ES5中的对象是指无序的属性的集合.(属性可以是基本值.对象和函数). 对象的属性类型有两种,一种是数据属性,是数据值的保存位置:另一种是访问器属性,包含getter和setter函数. 1 ...

  9. 9.Java面向对象-方法参数类型及返回值类型、权限修饰符、内部类、匿名内部类

    9.Java面向对象-方法参数类型及返回值类型.权限修饰符.内部类.匿名内部类 一.类名作为形式参数 A:案例演示: 类名作为形式参数当你以后看到一个方法的形参要一个 类 类型,你就传递一个该类的对象 ...

最新文章

  1. 在ListView中使用BaseAdapter进行适配
  2. 52次课(mysql用户管理、常用sql语句、 mysql数据库备份恢复)
  3. Android应用开发—PendingIntent:如何判断两个PendingIntent对等
  4. h5微信本地调试 vue_vueh5中使用微信sdk
  5. Highcharts 显示图表
  6. 关于类的sizeof问题
  7. 【库】JavaScript——滚动条( 不是很完善 )
  8. linux sysvinit 机制,Linux基于SysVinit和systemd实现开机自启动服务
  9. FileInputStreamFileOutputStream 和 BufferedInputStreamBufferedOutputStrem的性能测试小案例
  10. 遇到slideUp Down 问题
  11. 判断系统(服务器)中是否存在后门程序的2个工具
  12. 新cBSS灰度发布Git管理流程
  13. linux 添加快捷命令,linux 添加快捷指令
  14. Excel.Application组件使用方法,适合应用于使用EXCEL组件做WEB应用开发。
  15. Android studio运行出现Unable to determine application id: com.android.tools.idea.run.ApkProvisionExcepti
  16. 基于SpringBoot开发一套完整的项目(四)准备工作
  17. 全网19套超热门表情包,小狗头、国王排名等我全部整理来了
  18. JS中操作IE浏览器的一些方法整理
  19. 计算机培训艺术字体,Word2019中使用艺术字,设置文字倒置
  20. wxpython动态实时绘图_wxPython 画图板

热门文章

  1. crontab详解-如何让脚本自动定时运行,设置、启动 linux定时器
  2. java暂停的方法_Java使用join方法暂停当前线程
  3. c语言0x00如何不截断_binary 和 varbinary 用法全解
  4. recv函数_第五十二章、send和recv函数
  5. Mac配置Java环境变量等
  6. 第五天学习Java的笔记(if,switch顺序结构)
  7. PADS 9.5安装教程附安装包资源
  8. Anaconda简介及其下载 安装 配置 使用 卸载
  9. 安装 | Window下Visual Studio VS2015 VS2017 各版本下载地址
  10. oracle 重建em失败,11gr2 EM重建出现问题,求高人指点