网站首页 > 技术文章 正文
以下为个人读书笔记,以记录常看、加深印象为目的。不喜勿评 感激。
一、构造函数模式中 - 对象的 constructor 属性
1、以 创建Person对象及其实例 为例:
要创建Person的新实例,必须使用new操作符,以这种方式调用构造函数会经历以下4个步骤:
1、创建一个对象;
2、将构造函数的作用域赋给新对象(此时this指向了这个新对象);
3、执行构造函数中的代码(为这个新对象添加属性);
4、返回新对象。
代码示例:
2、① 上述代码中的 person1 和 person2 分别保存着Person 对象的一个不同的实例;
② 这俩实例都有一个 constructor(构造函数)属性,该属性指向Person。
③ 对象的 constructor 属性 最初是用来标识对象类型的。创建自定义的构造函数意味着将来可以将它的实例标识为一种特殊的类型。所以person1 person2 既是 Object 的实例,也是Person的实例。
二、原型模式中 - 函数的 prototype 属性
1、首先每个函数都有 prototype 属性,它是一个指针,指向一个对象,而这个对象包含可以由特定类型的所有实例共享的属性和方法。
或者可以这么理解:prototype 就是通过调用构造函数而创建的那个对象实例的原型对象。
使用原型对象的好处就是:让所有对象实例 共享 它所包含的属性和方法。
2、只要创建了一个新函数,就会根据一组特定的规则为该函数创建一个prototype 属性,这个属性指向函数的原型对象。
默认情况下,所有原型对象会自动获得一个constructor (构造函数)属性,这个属性包含一个指向prototype 所在函数的指针。
Person.prototype.constructor = Person
3、创建了自定义的构造函数之后,其原型对象默认获得 constructor 属性,至于其他方法,则都是从Object 继承而来。当 调用 构造函数 创建一个新实例之后,该实例的内部 将包含 一个指针 (内部属性),指向构造函数的原型对象。
4、通过 isPrototypeOf() 方法来确定对象之间是否存在构造及其实例这种关系。返回的是true / false。
语法:构造函数.prototype.isPrototypeOf(实例对象)
代码:
5、对于上面代码,可这么分析:实例 person1 / person2 内部是否有指向Person.prototype 的指针(constructor)。
6、小编在学习的过程中发现一个问题,问题如下:
如果将第三行注释掉,换成 Person.name ,那么其值为“Person”,其 实例的 name 为undefined。
原因是因为:上述代码中 Person 为空的构造函数,通过向Person的原型对象Person.prototype中添加属性及方法。而函数本身拥有name特殊属性,函数名是不可修改。
7、*** 重点:每当代码读取某个对象的某个属性时,都会执行一次搜索,目标是具有名字的属性,从对象实例本身开始,如果找不到则向实例内部 constructor 所指向的原型对象中搜索。
8、hasOwnProperty() 检测一个属性存在何处(实例中、还是原型中)。
9、遍历属性,将对象中的属性加以遍历输出,方法主要有俩:
① for in 枚举出来的属性:包括存在实例中的属性,也包括原型中的属性。
② Object.keys()
keys中将保存一个数组,数组中包括所有原型属性的名称(键),如果通过Person的实例调用,则为空,除非实例中的属性被新建,返回的则为实例中的属性。
9中涉及代码如下:
10、更简单的原型语法:
为了实现更好的封装效果,省去每次添加属性及方法时敲入 Person.prototype ,常做的则是通过对象字面量法重写整个对象:
但这种方式的结果是:constructor 不再指向 Person了,而是Object构造函数。所以为了明确指向原型的身份,要添加: constructor : Person
11、原型模式的缺点:
a、省略了函数初始化传参环节;
b、由共享所致的同名属性问题。
可以 组合使用 构造函数模式 和原型模式,构造函数模式用于 定义实例属性,原型模式用于定义方法和共享属性。这样每个实例都会拥有自己的属性,且共享着原型属性及方法。
接下来会记录其他模式、继承、闭包、私有域等相关笔记。 希望大家多多关注哦!
猜你喜欢
- 2025-05-02 对象 (基础详解)(对象指的是)
- 2025-05-02 JavaScript的核心易错点知识梳理(js的重点)
- 2025-05-02 网络钓鱼攻击使用隐形Unicode Trick隐藏JavaScript
- 2025-05-02 本想搞清楚ESM和CJS模块的转换问题,没想到写完我的问题更多了
- 2025-05-02 19个基本的JavaScript面试问题及答案(都是实用技巧)免费送
- 2025-05-02 day11:前端面试题(js)(前端面试题汇总.pdf)
- 2025-05-02 前端面试:JavaScript 中有几种数据类型?
- 2025-05-02 前端开发基础-JavaScript(三)(前端开发的基础)
- 2025-05-02 小白教你JavaScript 第二讲(javascript教程 csdn)
- 2025-05-02 JS学习笔记:三、数据类型(js数据类型有)
- 最近发表
- 标签列表
-
- cmd/c (64)
- c++中::是什么意思 (83)
- 标签用于 (65)
- 主键只能有一个吗 (66)
- c#console.writeline不显示 (75)
- js判断是否空对象 (63)
- pythoncase语句 (81)
- es6includes (73)
- sqlset (64)
- phprequire_once (61)
- localstorage.removeitem (74)
- vector线程安全吗 (70)
- & (66)
- java (73)
- org.redisson (64)
- cannotinstantiatethetype (62)
- js数组插入 (83)
- gormwherein (64)
- linux删除一个文件夹 (65)
- mac安装java (72)
- outofmemoryerror是什么意思 (64)
- flask文件上传 (63)
- eacces (67)
- 查看mysql是否启动 (70)
- 无效的列索引 (74)