构造函数的含义

构造函数是指通过传入的参数来返回一个新的对象的函数，在JavaScript中，用new关键字来进行调用的函数称为构造函数，一般首字母要大写。

构造函数的使用

function Person(name, age, height, width) {this.name = namethis.age = agethis.height = heightthis.width = width}const zr = new Person('zr', 17, 172, 62)console.log(zr.name) // 'zr'console.log(zr.age) // 17console.log(zr.height) // 172console.log(zr.width） // 62

使用对象字面量创建一系列同一类型的对象时，这些对象可能具有一些相似的特征(属性)和行为(方法)，此时会产生很多重复的代码，把这些重复性的特征和属性抽象出来，做成构造函数，可以实现代码复用。举个浅显的例子，比如要生产10000个不同的纸盒子，如果按照常规的方法，就需要手动裁10000次纸，画10000次图案，这样太费时费工，而且如果数量进一步扩大，会造成更大的麻烦。但是如果造一个机器，机器中有盒子的模型，在造盒子之前只需要将盒子的尺寸和图案当做参数输入进去，那么生产盒子的效率就会大幅提高，盒子生产出来之后里边装什么东西，再进行差异化处理就行，需要汉堡的时候放汉堡，需要放披萨的时候放披萨，各自使用就好。这里边这个机器就相当于构造函数，可以反复使用生产一些自带属性和特征的初始对象。

现在我们将上面的代码改造一下

function Person(name, age, height, width) {this.name = namethis.age = agethis.height = heightthis.width = widththis.sayHi = function () {console.log('Hi' + this.name)}}Person.type = '人类的构造函数'const zr = new Person('zr', '17', '172', '62')const zz = new Person('zz', '17', '172', '50')zr.sayHi() // Hizrzz.sayHi() // Hizzconsole.log(zz.type, zr.type) // undefined undefinedconsole.log(Person.type) // 人类的构造函数

此时每个新的对象调用的sayHi方法都是不一样的，可以更灵活的创建每一个新的对象。

Perons.type只能通过构造函数来进行方法，构造函数构造出来的对象是访问不到的，也就是静态属性

在es6之后有class语法糖，能让我们更简单的创建类和实例化类。类就相当于构造函数，都是通过传入的参数和内部的逻辑返回一个不同功能的新对象。

结语

构造函数简单来说就是通过传入的参数，通过函数内部的逻辑返回一个带有特定功能的对象，每个对象间都互不影响，可以增加代码的灵活性。

JS中的构造函数的含义和用法相关推荐

java this$0_java中this$0的含义及用法
java中this$0的含义及用法 (2012-01-19 22:43:33) 标签: 杂谈 java中this$0的含义及用法,具体case是这样的: 通过测试工具去探测界面UI上的控件FlatBu ...
JS中 new Date() 各方法的用法
JS中 new Date() 各方法的用法 1.new Date() 参数篇 a.返回类型为国标时间, b.无参数时可以直接返回输出时的时间, c.有参数时则返回对应时间的国标时间, d.日期中间的符 ...
js中substr,substring,indexOf,lastIndexOf的用法
js中substr,substring,indexOf,lastIndexOf等的用法 1.substr substr(start,length)表示从start位置开始,截取length长度的字符串 ...
JS中关于构造函数、原型链、prototype、constructor、instanceof、__proto__属性
在Javascript不存在类(Class)的概念,javascript中不是基于类的,而是通过构造函数(constructor)和原型链(prototype chains)实现的.但是在ES6中引入 ...
js中substr,substring,indexOf,lastIndexOf的用法小结
2019独角兽企业重金招聘Python工程师标准>>> js中substr,substring,indexOf,lastIndexOf等的用法 1.substr substr(sta ...
js中定时器与延时器的用法
js中定时器的主要语法有以下四个: 添加定时器: setTimeout("js语句",时间) setInterval("js语句",时间) 删除定时器(此处的t ...
简述JS中 appy 和 call 的详细用法
Apply 和 Call 两个老生常言的方法,使用过程的一些细节还是有很大的异同,具体使用情况可以参照下面例子详细回顾一下. 区别和详解:js中call()和apply()的用法 1.关于call() ...
html页面的text用法,js中innerHTML，innerText，outerHTML用法总结
如何获取DIV里面的内容,在js中为大家提供了三种方法,分别是outerHTML.innerHTML和innerText,这里要注意大小写!看起来长得很像,那么到底怎么使用以及它们之间有什么区别,我想 ...
js中获取时间new date()的用法
获取时间: var myDate = new Date();//获取系统当前时间获取特定格式的时间: 1 myDate.getYear(); //获取当前年份(2位) 2 myDate.getFul ...

JS中的构造函数的含义和用法

构造函数的含义

构造函数的使用

结语

JS中的构造函数的含义和用法相关推荐

最新文章

热门文章