作者:爱一个人没有错
出处:https://segmentfault.com/a/1190000037559919
背景分析
当我们需要,多个结构相同(例如属性名相同,属性值不同)的对象时如何定义)?例如:
var p1={x:10,y:20}var p2={x:30,y:40}var p3={x:50,y:60}
在如上代码中,假如属性比较多,构建对象时需要反复对属性进行编写,代码的重复量就比较大,同样会加大我们的工作量,那如何对其进行优化呢?
JS中构造函数定义
JS中的构造函数允许我们对JS对象进行抽象,提取对象结构进行封装,
然后构建对象时基于构造函数定义的结构进行实例化.
传统方式构造函数定义
![c043e5bb2f7091e4756a0445dcd2a582.png](https://img-blog.csdnimg.cn/img_convert/c043e5bb2f7091e4756a0445dcd2a582.png)
class结构方式的构造函数定义
在ES6标准中,又推出了定义JS构造函数的一种新的玩法,例如:
![71b8b39c772bc89befa03a1f7735762e.png](https://img-blog.csdnimg.cn/img_convert/71b8b39c772bc89befa03a1f7735762e.png)
JS中构造函数应用
无论是传统方式还是新的es6方式,对象的构建和使用方式是不变的。
![a4bf58fb5d1268f16e69c88c544ed500.png](https://img-blog.csdnimg.cn/img_convert/a4bf58fb5d1268f16e69c88c544ed500.png)
![2e4d5c2b5ebd33ffe804b053042d6120.png](https://img-blog.csdnimg.cn/img_convert/2e4d5c2b5ebd33ffe804b053042d6120.png)
总结(Summary)
本小节中重点讲解了JS中构造函数存在的意义,应用场景,构造函数的定义,以及基于构造函数构建对象的方式。
作者:爱一个人没有错
出处:https://segmentfault.com/a/1190000037559919