关于javascript:js面向对象编程你需要知道这些

javascript 中对象由 key 和 value 组成，key 是标识符，value 能够为任意类型

1、通过构造函数

var obj = new Object()
obj.name = 'alice'
obj.age = 18

2、通过字面量

var obj = {
  name: 'alice',
  age: 18
}

对属性进行精准的操作，比方定义属性是否可被删除、遍历或批改

1、语法

// 定义一个属性
Object.defineProperty(Object, PropertyKey, attributes)
// 定义多个属性
Object.defineProperties(Object, properties)

2、属性描述符特色

属性	形容	通过对象定义时默认值	通过属性描述符定义时默认值
configurable	定义属性是否可被删除、从新定义	true	false
enumerable	定义属性是否可被枚举，如通过 for in/Object.keys	true	false
writable	是否可被批改	true	false
value	读取属性和批改的时候操作的值	undefined	undefined
get	获取属性时会执行的函数	undefined	undefined
set	设置属性时会执行的函数	undefined	undefined

3、属性描述符的分类

属性描述符分为数据属性描述符和读取属性描述符，数据属性描述符用来定义属性，读取属性描述符用于为函数中不违心裸露的属性来进行读取和设置的操作

不同属性描述符可操作的属性也不一样

分类	configurable	enumerable	writable	value	get	set
数据属性描述符	√	√	√	√	×	×
存取属性描述符	√	√	×	×	√	√

4、定义
给 obj 对象增加 skill 属性，属性的形容为不可删除或从新定义、不可批改、可枚举

var obj = {
  name: 'alice',
  age: 18
}

Object.defineProperty(obj, 'skill', {
  configurable: false,
  writable: false,
  enumerable: true,
  value: 'flying',
})
console.log(obj)

delete obj.skill
console.log(obj)

obj.skill = 'swimming'
console.log(obj)

所以下面删除和批改都是有效的操作，执行后果如下

1、获取对象的属性描述符

getOwnPropertyDescriptor
getOwnPropertyDescriptors

2、操作属性

preventExtensions 禁止新增属性
seal 关闭属性，即禁止新增、删除属性
freeze 解冻属性，即禁止新增、批改、删除属性

3、查问属性

isExtensible 查问是否可新增属性
isSealed 查问是否是关闭的属性
isFrozen 查问是否是解冻的属性

var user = {
  name: 'kiki',
  age: 18
}
console.log('getOwnPropertyDescriptor', Object.getOwnPropertyDescriptor(user, 'name'))
console.log('getOwnPropertyDescriptors', Object.getOwnPropertyDescriptors(user))

Object.preventExtensions(user)
console.log('isExtensible', Object.isExtensible(user))
user.skill = 'flying'
console.log('user', user)

Object.seal(user)
console.log('isSealed', Object.isSealed(user))
delete user.age
console.log('user', user)

Object.freeze(user)
console.log('isFrozen', Object.isFrozen(user))
user.name = 'alice'
console.log(user)

以上代码执行后果如下

1、隐式原型

每一个对象都有隐式原型，可通过 Object.getPrototypeOf 或者__proto__（存在浏览器兼容问题）获取，查找元素时，如果本身对象没有，会向原型上查找

var obj = {}
console.log(obj.__proto__)
console.log(Object.getPrototypeOf(obj))
console.log(obj.name)

obj.__proto__.name = 'alice'
console.log(obj.name)

对象的隐式原型指向空对象

2、显式原型

每个函数除了有隐式原型，还有显式原型 prototype，prototype 中有一个属性 constructor 指向函数本人

function foo(){}
console.log(foo.__proto__)
console.log(foo.prototype)
console.log(Object.getOwnPropertyDescriptors(foo.prototype))

在构造函数中，通过 new 关键字能够批量创建对象

1、定义形式

function foo()
var f = new foo()

2、new 关键字的操作

在内存中创立一个新对象（空对象）
对象的__proto__属性被赋值为构造函数的 prototype 属性
构造函数的 this，将指向创立的对象
执行构造函数的代码
如果函数没有返回非空对象，则返回创立的新对象

3、在内存中的体现
new 关键字会将创立的对象的__proto__属性赋值为构造函数的 prototype 属性

function Person(){}
var p1 = new Person()
var p2 = new Person()
console.log(p1.__proto__ === Person.prototype) // true
console.log(p1.__proto__ === p2.__proto__) // true

图示如下

以上就是面向对象编程的局部内容，下一篇记录 js 中实现继承的形式，对于 js 高级，还有很多须要开发者把握的中央，能够看看我写的其余博文，继续更新中~

关于javascript:js面向对象编程你需要知道这些

创建对象的形式

属性描述符

对象的其它办法

原型

构造函数