面向对象编程思想

什么是面向对象

面向对象是一个非常伟大的"编程思想/方式"，依据"对象、类、实例"来构建一门语言，这样我们后期不论是学习还是开发，都应该按照类和实例来进行操作。

这样做的好处：实例既可以具备自己独有的一些私有属性方法，也可以具备类赋予他们的公共的属性和方法，私有和公有的属性方法可以进行有效的管理。

面向对象 OOP：javascript、java、php、python、C#(ASP.NET)、Go、Ruby... 面向过程 POP：C

对象、类、实例

对象：万物皆对象，它是一个泛指 类：对象的一个具体细分(大类/小类、内置类、自定义类...)，类的别称为"构造函数/构造器" 实例：类中的一个具体事物

JS 中常见的内置类

1. 数据类型相关：每一种数据类型都偶有一个自己所属的类（Number、String、Boolean、Symbol、BigInt，Array、RegExp、Error、Function、Object...）
2. 元素对象相关：每一个 dom 元素都有自己所属的类 (比如 div 的 HTMLDivElement，p 标签的 HTMLParagraphElement)，当然，他们还有自己的大类(父类) HTMLElement

HTMLDivElement -> HTMLElement -> Element -> EventTarget(提供了 dom 二级事件绑定方法 addEventListener) -> Object

3. 元素集合/节点集合： 比如 getElementsByTagName("") 得到的是一个元素集合 HTTMLLCollection， document.querySelectorAll("") 得到的是一个节点集合 NodeList，NodeList 本身就提供了很多方法，比如 entries，forEach，item，keys，values等

思考题

document.getElementById('元素ID');
	// -> document 被称之获取的上下文 [context]
	// 特点：getElementById 方法的上下文只能是 document，为什么？

var node = document.getElementsByTagName('P')[0];

node.querySelector('元素ID')
    // 特点：querySelector 的上下文可以使任何一个 DOM 对象(P、DIV、SPAN等)，为什么？

其实我们按着原型链一直上上找，发现元素访问 querySelector 方法继承自 Element，而任何一个 dom 对象都继承自 Element，所以所有的元素节点实例的原型链都挂在了 querySelector 方法。 而 getElementById 不存在于元素节点的原型链上，只存在于 Document 类的原型对象上，故元素访问不到 getElementById 方法。