对于搞明白什么是普通函数与构造函数,首先我觉得我们应该对函数有一定的了解才行:
函数的作用就是封装一段可以重复执行的代码片段
那么为了区分这两个概念,我将它们作一个比较来说比较好:
第一点:从命名规范上来看(并不是主要区别)
function personNum(){} personNum(); //这是普通函数,它命名的规范一般采用驼峰命名法(首字母小写)
Function PersonNum(){} var p=new PersonNum() p(); //这是构造函数,规范命名一般采用大驼峰命名法(首字母大写)
第二点:在于调用函数的方式:(最主要的区别)
还拿上面的例子来讲:
普通函数的调用一般是: 函数名称();
构造函数的调用: new 函数名();
第三点:在于函数内部this的指向问题
普通函数:this指向的是调用这个函数的对象,如果这个对象没有,那么默认指向window
构造函数:this指向的是新创建的对象
第四点:在于返回值
普通函数的返回值由return 决定
构造函数的返回值默认返回的是新创建的对象(注意:
1.构造函数的返回值return+基本数据类型 //例:return true; 这种情况返回的还是构造 //函数所创建出来的实例
2.构造函数的返回值return+对象 //例:return {“a”:”哈哈”}; 这种情况返回的就是这个对象
)
它们具体的调用过程为:
普通函数:直接执行函数内部的各种操作
(this指向的是调用这个函数的对象,如果这个对象没有,那么默认指向window
它的返回值由return决定)
构造函数:1.在构造函数的内部创建一个新对象
2.给对象赋值,执行各种操作: this.c=”” , this.say=function(){}
3.默认返回这个新创建的对象
可以通过下面这个例题练习一下:
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="utf-8"> 5 </head> 6 <body> 7 <script> 8 function foo(){ 9 var f2=new foo2(); //这是一个构造函数,它的this是foo2{},f2={a:3} 10 console.log(f2); //2.{a:3} 11 console.log(this); //3.window 12 return true; 13 } 14 function foo2(){ 15 console.log(this);//1.foo2{} 16 this.age=30; 17 return{a:3}; 18 } 19 var f1=foo(); //这是一个普通函数,它的this是window 20 console.log(f1); //普通函数的返回值由return决定 true 21 </script> 22 </body> 23 </html>