深入JS面向对象

最新推荐文章于 2024-05-17 13:52:13 发布

葡萄已熟透

最新推荐文章于 2024-05-17 13:52:13 发布

阅读量210

点赞数

分类专栏： JavaScript 文章标签： javascript 原型模式前端

本文链接：https://blog.csdn.net/weixin_49123501/article/details/127858239

版权

JavaScript 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

深入JS面向对象

1. JS面向对象

2.对属性操作的控制

属性直接定义在对象内部，或者直接添加到对象内部的，不能对这个属性进行一些限制：比如这个属性是否是可以通过delete删除的？这个属性是否在for-in遍历的时候被遍历出来？
如果我们想要对一个属性进行比较精准的操作控制，那么我们就可以使用属性描述符
- 通过属性描述符可以精准的添加或修改对象的属性
- 属性描述符需要使用 Object.defineProperty 来对属性进行添加或者修改；

3.Object.defineProperty()

Object.defineProperty() 方法会直接在一个对象上定义一个新属性，或者修改一个对象的现有属性，并返回此对象

Object.defineProperty(obj, prop, descriptor)

可接收三个参数：
- obj要定义属性的对象
- prop要定义或修改的属性的名称或 Symbol
- descriptor要定义或修改的属性描述符
返回值：
- 被传递给函数的对象

4.属性描述符分类

属性描述符的类型有两种：
- 数据属性（Data Properties）描述符（Descriptor）
- 存取属性（Accessor 访问器 Properties）描述符（Descriptor）

5.数据属性描述符有如下四个特性：（value、writable特有）

6.存储属性描述符有如下四个特征：（get、set特有）

7.对象方法补充

8.构造函数

构造函数也是一个普通的函数，从表现形式来说，和千千万万个普通的函数没有任何区别
那么如果这么一个普通的函数被使用new操作符来调用了，那么这个函数就称之为是一个构造函数

9.new 操作符调用的作用

如果一个函数被使用new操作符调用了，那么它会执行如下操作：
- 在内存中创建一个新的对象（空对象）
- 这个对象内部的[[prototype]]属性会被赋值为该构造函数的prototype属性
- 构造函数内部的this，会指向创建出来的新对象
- 执行函数的内部代码（函数体代码）
- 如果构造函数没有返回非空对象，则返回创建出来的新对象

10.对象的原型

JavaScript当中每个对象都有一个特殊的内置属性 [[prototype]]，这个特殊的对象可以指向另外一个对象。这个属性可以称之为对象的原型（隐式原型）

作用：

当我们通过引用对象的属性key来获取一个value时，它会触发 [[Get]]的操作
这个操作会首先检查该属性是否有对应的属性，如果有的话就使用它
如果对象中没有改属性，那么会访问对象[[prototype]]内置属性指向的对象上的属性

11.函数的原型 prototype

所有的函数都有一个prototype的属性

函数作为对象来说, 它也是有[[prototype]] 隐式原型
函数因为它是一个函数，所以它还会有一个显示原型属性: prototype

new操作符
- 在内存中创建一个新的对象（空对象）
- 这个对象内部的[[prototype]]属性会被赋值为该构造函数的prototype属性

JS面向对象补充

1.认识class定义类

按照前面的构造函数形式创建类，不仅仅和编写普通的函数过于相似，而且代码并不容易理解，在 ES6（ECMAScript2015）新的标准中使用了class关键字来直接定义类

类本质上依然是构造函数、原型链的语法糖

2.类和构造函数的异同

类和构造函数的特性其实是一致的

3.类的构造函数

在创建对象的时候给类传递一些参数：

每个类都可以有一个自己的构造函数（方法），这个方法的名称是固定的constructor；
当我们通过new操作符，操作一个类的时候会调用这个类的构造函数constructor；
每个类只能有一个构造函数，如果包含多个构造函数，那么会抛出异常

当我们通过new关键字操作类的时候，会调用这个constructor函数，并且执行如下操作：

在内存中创建一个新的对象（空对象）
这个对象内部的[[prototype]]属性会被赋值为该类的prototype属性
构造函数内部的this，会指向创建出来的新对象
执行构造函数的内部代码（函数体代码）
如果构造函数没有返回非空对象，则返回创建出来的新对象；

// 类的声明
class Person {
  // 类的构造方法
  // 注意: 一个类只能有一个构造函数
  // 1.在内存中创建一个对象 moni = {}
  // 2.将类的原型prototype赋值给创建出来的对象 moni.__proto__ = Person.prototype
  // 3.将对象赋值给函数的this: new绑定 this = moni
  // 4.执行函数体中的代码
  // 5.自动返回创建出来的对象
  constructor(name, age) {
    this.name = name
    this.age = age
  }
}