先来看这个代码: function Person(name,age){ this.name=name; this.age=age; this.sayHi=function(){ console.log("姓名:"+this.name+",年龄:"+this.age); }; //return this; 隐式返回了this(当前创建的那个对象) } var p1=new Person("ZDL",22); var p2=new Person("SLL",21); p1.sayHi(); //姓名:ZDL,年龄:22 p2.sayHi(); //姓名:SLL,年龄:21 和其它语言一样,这里使用new运算符创建了一个对象。 我们知道,函数有多钟调用方式,使用了new调用一个函数 就是构造函数调用模式. 创建Person的实例,经历了以下几个步骤: 1.创建一个新的对象。 2.将构造函数的作用域赋给新对象. 3.执行构造函数中的代码(给对象做了一些初始化) 4.返回这个创建的对象. 系统隐式的返回了this.这样变量p1才得到了新对象的引用 我们来看下面的代码: 1. function Person(name,age){ this.name=name; this.age=age; this.sayHi=function(){ console.log("姓名:"+this.name+",年龄:"+this.age); }; return this; } var p1=new Person("SLL",21); p1.sayHi(); //姓名:ZDL,年龄:22 发现运行效果和之前的一样,这说明,系统在暗地里确实是返回了this. 还是觉得有疑惑的话,我们再来看看返回其它对象会怎么样 2. function Person(name,age){ this.name=name; this.age=age; this.sayHi=function(){ console.log("姓名:"+this.name+",年龄:"+this.age); }; //return "我返回的是字符串"; /*如果返回的不是对象,而是其它的话,p1得到的还是原来创建的对象,而不是我们自己返回的字符串 这里不知道原因是什么,可能是系统会对返回值最检查。 不管如何,我们知道在这个构造函数里确实是返回了东西就行。 */ return {name:1,age:22}; } var p1=new Person("SLL",21); p1.sayHi(); //TypeError: p1.sayHi is not a function 这是因为我们返回另一个对象,这个对象没有sayHi方法. console.log(p1);// Object { name=1, age=22} 这里确实是我们返回的对象 3.我们再来看看这个Person作为普通函数调用会怎么样 var t= Person("ZDL",22); console.log(t); //undefined 因为作为普通函数,不会隐式返回this,属性值都被添加到window对象上了 window.sayHi();////姓名:ZDL,年龄:22 改变this指针,在另一个对象的作用域中调用 var o={}; Person.call(o,"雪奇",21); console.log(o);//Object { name="雪奇", age=21, sayHi=function()} o.sayHi(); //姓名:雪奇,年龄:21
转载请注明:副业 and 脱单研究所 » JS中的构造函数