javascript面向对象——constructor属性(构造函数属性)

什么是constructor属性?它来自哪里?又将会指向何处?
什么是constructor属性?
constructor是构造函数属性。
它来自哪里?
其实constructor属性是来自 prototy原型属性 所指向的那个对象的属性,如果不明白这里的“那个对象”具体指的是哪个对象,可以看看我上一章讲的 javascript面向对象——prototype属性(原型属性) ,里面有着详细的讲解。
又将指向何处?
从constructor属性的字面意思我们就不难看出,它指向的永远都是构造函数。
例如:
我们看看下面代码:
function myfile(name,age){
this.webname = name;
this.age = age;
}
myfile.prototype.getname = function () {
return this.age;
}
var myfile1 = new myfile("zhang",3);
console.info(myfile1.constructor);
console.info(myfile.constructor);
console.info(myfile.prototype.constructor);
这里我打印了在3种不同情况下所输出的constructor构造函数属性的内容,我将谷歌浏览器控制台打印出的结果截图如下:

是的正如我们看见的为什么 console.info(myfile1.constructor);打印出的结果与 console.info(myfile.prototype.constructor);打印出的结果会是一样的,而console.info(myfile.constructor);打印出的结果却是 ƒ Function() { [native code] },其实这个很好理解,如果你看了我的上一章讲解的 javascript面向对象——prototype属性(原型属性) 那么我相信这个地方就会很容易理解,其实我们首先要清楚constructor构造函数属性, 它是谁的属性? 它是原型属性prototype所指向的那个对象的属性。 那么在这个对象中这个属性它又指向谁呢!? 它指向的是构造函数也就是上面代码中的 function myfile(name,age){this.webname = name; this.age = age;}这一部分,其值就是这个构造函数中的对象。
那么肯定会有人疑问,既然 constructor构造函数属性 指向的是是构造函数,那么打印出的结果是构造函数这个可以理解但是为什么 console.info(myfile.prototype.constructor);打印的也是构造函数呢!?它指向的可不是构造函数,是的我们知道实例化对象指向的一直都是prototype原型属性所指向的对象。如果想解决这个问题,那么我们首先应该弄明白两个问题。
1、实例化对象到底指向的是谁?
2、实例化对象到底继承的是谁?
首先我们还是用一个实例来引入,用图片看结果然后在总结:
代码部分:
function myfile(name,age){
this.webname = name;
this.age = age;
}
myfile.prototype.getname = function () {
return this.age;
}
var myfile1 = new myfile("zhang",3);
console.info(myfile1.constructor);
打印结果图片如下:

总结:代码执行的结果在控制台上显示的内容如上图,打印出的是构造函数的代码也就是代码部分
function myfile(name,age){
this.webname = name;
this.age = age;
}
的的内容,有人肯定会想,哎!!!这不很明显嘛,实例化对象指向的就是构造函数啊!继承的也是构造函数。
那么我们来运行另外一句代码: console.info(myfile1.getname());打印出的结果却是3。

什么情况在上面的构造函数中并没有 getname()这个函数对象啊!为什么会打印出结果3呢!我们可以仔细看看 getname()这个对象是在什么地方出现的,是的它是通过原型属性直接定义的,通过上面的两次打印我们可以很明显的发现实例化对象不仅能够打印出构造函数还能够打印出通过原型链来创建的属性以及属性值,换句话说,也就是实力化的对象继承的对象并不全是构造函数,而是指向了一个我们看不见的对象,这个对象里面包含的有构造函数,还有通过原型链来创建的属性,那么这个对象是什么呢!其实我们在创建构造函数的时候,每个构造函数都会有一个prototype原型属性,这个原型属性会指向一个我们看不见的对象,我们可以通过原型属性来创建固定不变的属性并赋值,如: myfile.prototype.getname = function () {return this.age;}这个时候原型属性所指向的对象不仅包含了构造函数还包含了通过原型属性所创建出来的一些属性。
上面两个问题的答案就出来了:
1、实例化对象到底指向的是谁?
答:实例化对象指向的永远是prototype原型属性所指向的那个对象,是通过实例化对象的内部属性[[prototype]]来实现的。
2、实例化对象到底继承的是谁?
答:其实实例化对象继承的还是prototype原型所指向的那个虚拟的对象。
总结constructor(构造函数属性):
这个时候我们在来看看 console.info(myfile1.constructor); console.info(myfile.constructor);
console.info(myfile.prototype.constructor);三个为什么第一个跟第三个的值是一样的但是第二个会出现 ƒ Function() { [native code] } 。
console.info(myfile.prototype.constructor);其实就是在告诉计算机我们要的结果是prototype原型属性所指向的那个对象中的构造函数,而因为 console.info(myfile1.constructor);本来就是直接继承的就是prototype原型属性所指的对象所以这两个命令打印出的结果自然也都是来之那个虚拟的对象中,这就是为什么这两个代码所执行出来的结果是一样的原因。至于 console.info(myfile.constructor);执行出来的结果是 ƒ Function() { [native code] } 就更好理解了, native code 的意思就是 本机代码 其实意思就是告诉我们,我们所执行的 console.info(myfile.constructor);代码就是构造函数它自己本身,不能所执行这条代码会报错,只是控制台会更智能一些的告诉我们,我们需要打印的就是它自己而已。
现在你知道了constructor构造函数属性是属于谁的属性吗?
答:
1、它是prototype原型属性所指向的那个虚拟对象的属性。
2、它是实例化对象的属性。
从上面的例子中我们也能推断出上面的两条答案是成立的。
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值