JavaScript对象

一、JavaScript 对象的特征

对象有几个特点:
-对象具有唯一标识性:即使完全相同的两个对象,也并非同一个对象。
-对象具有状态:
-对象具有行为:

1、对象具有唯一标识的内存地址,所以对象具有唯一的标识。
例:

const o1 = { a: 1 }
const o2 = { a: 1 }

console.log(o1 === o2) // false

2.JavaScript中将状态和行为统一抽象为“属性”
例:

const o = {
  a: 1,
  b() {
      console.log(this.a)
    }
}

3、JavaScript 中对象独有的特色是:对象具有高度的动态性,这是因为 JavaScript 赋予了使用者在运行时为对象添改状态和行为的能力。

const o = { a: 1 }

o.b = 2
console.log(o.a, o.b) // 1 2

二、JavaScript 对象的两类属性

对于JavaScript来说,属性并非只是简单地名称和值。JavaScript 的属性被设计成比别的语言更加复杂的形式,它提供了数据属性和访问器属性(getter/setter)两类。
1、数据属性具有四个特征:
value:就是属性的值。
writable:决定属性能否被赋值。默认值:true
enumerable:决定 for in 能否枚举该属性。默认值:true
configurable:决定该属性能否被删除或者改变特征值。默认值:true

访问器(getter/setter)属性,也有四个特征值:
getter:函数或undefined,在取属性值时被调用。
setter:函数或undefined,在设置属性值时被调用。
enumerable:是决定for in是否可枚举该属性。
configurable:决定该属性是否被删除或者改变特征值。

2、我们可以使用内部函数 getOwnPropertyDescripter来查看数据属性

const o = { a: 1 }

o.b = 2
Object.getOwnPropertyDescriptor(o,"a") // {value: 1, writable: true, enumerable: true, configurable: true} 
Object.getOwnPropertyDescriptor(o,"b") // {value: 2, writable: true, enumerable: true, configurable: true}

要想改变属性特征或者定义访问器属性,我们可以使用 Object.defineProperty

const o = { a: 1 }

Object.defineProperty(o, 'a', { value: 2 })
Object.defineProperty(o, 'b', { value: 3, writable: false,  enumerable: false, configurable: false} )
o.b = 4
console.log(o.a) // 2
console.log(o.b) // 3

Object.getOwnPropertyDescriptor(o,"a") // {value: 2, writable: true, enumerable: true, configurable: true} 
Object.getOwnPropertyDescriptor(o,"b") // {value: 3, writable: false, enumerable: false, configurable: false} 

3、在创建对象时,也可以使用get和set关键字来创建访问器属性。

const o = {
  get a() {
    return 1
   }
}

console.log(o.a) // 1

访问器属性跟数据属性不同,每次访问属性都会执行 getter 或者 setter 函数。

例子:

const o = {
  set a(newValue) {
      console.log('hello')
    }
}

o.a = 1 // hello
const person = {
  firstname: 'John',
  lastname: 'Doe',
  get fullname() {
    return this.firstname + ' ' + this.lastname
  },
  set fullname(fullname) {
    fullname = fullname.split(' ')
    this.firstname = fullname[0]
    this.lastname - fullname[1]
  }
}

console.log(person.fullname) // John Doe
person.fullanme = 'Jane Roe'
console.log(person.firstname) // Jane
console.log(person.lastname) // Roe

你可能感兴趣的:(JavaScript对象)