导语 1: 一个构造函数的原型对象, 其实就是这个构造函数的一个属性而已, 属性名叫 prototype, 值是一个对象, 对象中有一些属性和方法, 所以每个构造函数的实例对象都拥有这些属性和方法的使用权.
导语 2: 构造函数需要用 new 操作符来调用, 它本身没有任何意义, 只有实例化后才有生命, 当然你也可以把它当普通函数使用, 那 this 就是指向 Windows 了 (意义不大).
导语 3: 对于构造函数实例化出一个对象经历了什么?
我们看下面这个例子:
这个例子充分说明了, 大佬们创造出构造函数这种东西, 是有特殊用处的, 本身没什么意义, 在实例化后瞬间有了生命.
好了有这些准备工作后, 我们开始写一个构造函数 + 原型用法
废话不多说直接上代码!!!
1, 这个例子中有个构造函数, 名字叫 GetElem, 参数期望传入的是一个元素的 id, 可以获取这个 id 的元素;
2, 实例化一个叫 domOne 的对象, 它传入一个实参为:"old"; 所以它可以获取这个 id 为 old 的元素
3, 在构造函数的原型上定义一个方法叫: changeInner 作用是如果传入了实参就用实参来改变元素的内容
4, 在构造函数的原型上定义一个方法叫: on 作用是根据事件类型和对应函数干一些事情;
domOne 这个实例化对象中并没有这两个方法, 但是没关系, 它的原型对象上拥有啊!!! 所以可以直接用;
您一定会问为何不直接把方法写在构造函数中不就省事了? 原因是这样的话, 每实例化一个对象都要在实例化过程中创建这些方法,
如果实例化太多就消耗性能, 而放在原型对象上就只需要做一次. 这也是构造函数 + 原型优于工厂模式的方面.
最后一张图:
方法可以链接起来写的原因是 在每个方法中 return this (this 指向的是实例对象, 当然可以继续调用它可以调用的方法啦!!!)
来源: https://www.cnblogs.com/yangboy/p/10759911.html