关于javascript:javascript高级程序设计学习笔记-61理解对象

欢送关注前端小讴的github，浏览更多原创技术文章

了解对象

• 面向对象的语言标记：类的概念
• ECMAScript 中没有类的概念
• ECMAScript 定义对象：无序属性的汇合（一组没有特定程序的值），其属性能够蕴含根本值、对象、函数，整个对象能够设想成一个散列表

相干代码 →

• 创立一个 Object 实例，而后为它增加属性和办法

var person = new Object()person.name = 'Nicholas'person.age = 29person.job = 'Software Engineer'person.sayName = function () {  console.log(this.name)}

• 对象字面量创建对象

var person = {  name: 'Nicholas',  age: 29,  job: 'Software Engineer',  sayName: function () {    console.log(this.name)  },}

属性类型

var person = {  name: 'Nicholas',}

• 数据属性蕴含一个数据值的地位，用 Object.defineProperty() 批改默认属性
• 办法接管 3 个参数：属性所在的对象、属性名、描述符对象（描述符对象属性必须是：configurable / enumerable / writable / value，一个或多个）
• 严格模式下，操作会报错

Object.defineProperty(person, 'name', {  writable: false, // 不可批改  configurable: false, // 不可配置  value: 'Nicholas',})console.log(person.name)person.name = 'Greg'console.log(person.name) // 无奈重写delete person.nameconsole.log(person.name) // 无奈删除

• 一旦属性定义为不可配置，不能再变回可配置，再次调用 Object.defineProperty() 办法批改除 writable 以外的个性都会报错

Object.defineProperty(person, 'name', {  configurable: true, // 试图：不可配置 -> 可配置，因为曾经改为不可配置，因而会报错  value: 'Simon',})

• 可屡次调用 Object.defineProperty() 批改同一属性，一但把 configurable 设置为 false 之后就会有限度了

var book = {  _year: 2004,  edition: 1,}

• 拜访器属性不蕴含数据值，用 Object.defineProperty() 定义属性
• 办法接管 3 个参数：属性所在的对象、属性名、描述符对象（和数据属性用法一样）
• 只指定 getter -> 属性不能写；只指定 setter -> 属性不能读
• 严格模式下，只指定 getter 或 setter 均会报错

Object.defineProperty(book, 'year', {  get: function () {    return this._year  },  set: function (newValue) {    if (newValue > 2004) {      this._year = newValue      this.edition += newValue - 2004    }  },})book.year = 2007console.log(book.edition)

• IE8 或更早，定义拜访器属性的办法（遗留的办法，可在浏览器测试，vscode 会报错）

book.__defineGetter__('year', function () {  return this._year})book.__defineSetter__('year', function (newValue) {  if (newValue > 2004) {    this._year = newValue    this.edition += newValue - 2004  }})book.year = 2008console.log(book.edition)

• 调用 Object.defineProperty()、Object.defineProperties()办法时，如果不指定，即非“间接在对象上定义属性”时，那么 configurable、enumerable、writable 均为 false

var book4 = {  year: 2004,}var descriptorBook4 = Object.getOwnPropertyDescriptor(book4, 'year')console.log(  'book4',  descriptorBook4.configurable, // true  descriptorBook4.enumerable, // true  descriptorBook4.writable, // true  typeof descriptorBook4.set, // undefined  typeof descriptorBook4.get // undefined)var book5 = {}Object.defineProperty(book5, 'year', {  value: 2004,})var descriptorBook5 = Object.getOwnPropertyDescriptor(book5, 'year')console.log(  'book4',  descriptorBook5.configurable, // false  descriptorBook5.enumerable, // false  descriptorBook5.writable, // false  typeof descriptorBook4.set, // undefined  typeof descriptorBook4.get // undefined)

定义多个属性

• Object.defineProperties() 同时定义多个属性
• 同时定于多个属性，与别离批改和定义对象的属性的惟一却别，是这些属性都是在同一时间创立的

var book2 = {}Object.defineProperties(book2, {  _year: {    writable: true,    value: 2004,  },  edition: {    writable: true,    value: 1,  },  year: {    get: function () {      return this._year    },    set: function (newValue) {      if (newValue > 2004) {        this._year = newValue        this.edition += newValue - 2004      }    },  },})book2.year = 2008console.log(book2.edition) // 5

读取属性的个性

• Object.getOwnPropertyDescriptor() 获得给定属性的描述符

var book3 = {}Object.defineProperties(book3, {  _year: {    value: 2004,  },  edition: {    value: 1,  },  year: {    get: function () {      return this._year    },    set: function (newValue) {      if (newValue > 2004) {        this._year = newValue        this.edition += newValue - 2004      }    },  },})var descriptor = Object.getOwnPropertyDescriptor(book3, '_year')console.log(descriptor)console.log(descriptor.value) // 2004console.log(descriptor.configurable) // false，非间接在对象上定义属性，默认值为falseconsole.log(typeof descriptor.get) // undefined，数据属性不含get函数var descriptor2 = Object.getOwnPropertyDescriptor(book3, 'year')console.log(descriptor2)console.log(descriptor2.value) // undefined，拜访器属性不含valueconsole.log(descriptor2.configurable) // false，非间接在对象上定义属性，默认值为falseconsole.log(typeof descriptor2.get) // 'function'

总结 & 问点

• 面向对象的语言的标记是什么？JS 的对象是什么？
• 创立 JS 对象都有哪些办法？
• JS 对象有哪些属性类型？其别离有哪些个性？
• 用哪些办法如何批改或定义 JS 对象的属性？
• 用哪个办法如何读取对象属性的个性？