js实例化以及constructor探究

js实例化以及constructor探究

先来一个构造函数：

function Person(name){
this.name=name;
}

对其添加原型链：

Person.prototype={
getName:function(){

return this.name;

}
}

对其实例化：

var person=new Person('xiaopu');

这样完成一个基本的构造函数加原型链的组合封装。

我们不去探究原型链的过程这个可以参考前边的文章

我们来主要研究一下实例化过程，以及实例化前后constructor的指向问题：

实例化过程：

实例化其实是一个new的过程，在这里将其分为四步去执行

1.实例一个object对象

2.将构造函数的作用域置入该object

3.将构造函数赋值到object

4.执行object代码

在这个过程中首先是实例化一个object，所以新的实例person实际是通过Object继承而来的。

也就是说person instanceof Object==person instanceof Person==true

constructor指向：

每个构造函数都有一个prototype属性，这个属性指针指向的是一个object，

每个对象都有一个constructor指针，这个指针指向的是创建该对象实例的构造函数。

当然函数也是对象也会有constructor属性例如Person.constructor就指向了Function,因为Function是它的构造函数，也就是说Person是Function的实例。

上面代码我们重写如下:

function Person(name){

this.name=name;

}

var person=new Person('xiapu');

此时Person.prototype是一个空对象，

而person.constructor指向的是Person，Person.prototype.constructor指向的也是Person

当我们显示的对构造函数进行原型扩展后

Person.prototype={
getName:function(){return this.name}

}

这个时候person.constructor以及Person.prototype.constructor都指向的是Object而不是Person

究其原因，是因为一个新对象赋值给了Person.prototype，此时的Person.prototype是一个object的实例。

这个object的constructor指向的肯定就是object的构造函数类Object，所以二者的constructor都会指向Object

如果constructor对于你的判断很重要可以在原型中添加constructor并将其赋值为Person

Person.prototype={
constructor:Person,

getName:function(){return this.name}
}

而如果以Person.prototype.getName=function(){return this.name}去定义原型对象，

此时的constructor就不存在新建一个object过程，那么二者的指向依然会是Person

但是如果一开始用对象方式声明prototype然后又用原型链去声明原型属性那么此时二者的constructor依然指向的是Object，因为对象方式声明的prototype已经覆盖了原先构造函数中存在的原型链。

即：Person.prototype={};

Person.prototype.getName=function(){return this.name}

js实例化以及constructor探究相关推荐

【推荐】关于JS中的constructor与prototype【转】
最初对js中 object.constructor 的认识: 在学习JS的面向对象过程中,一直对constructor与prototype感到很迷惑,看了一些博客与书籍,觉得自己弄明白了,现在记录如下 ...
关于JS中的constructor与prototype
在学习JS的面向对象过程中,一直对constructor与prototype感到很迷惑,看了一些博客与书籍,觉得自己弄明白了,现在记录如下: 我们都知道,在JS中有一个function的东西.一般人们 ...
js设计模式之Constructor（构造器）
说明:最近正在看Addy Osmani写的<JavaScript设计模式>这本书,故记一下读书笔记与大家分享.本文的内容基本上都出自那本书,如果觉得不错可以去买一本看看. 9.1Const ...
[转载]Node.js模块化机制原理探究
转载地址:https://segmentfault.com/a/1190000008371376 前言 Node应用是由模块组成的,Node遵循了CommonJS的模块规范,来隔离每个模块的作用域,使 ...
Node.js模块化机制原理探究
前言 Node应用是由模块组成的,Node遵循了CommonJS的模块规范,来隔离每个模块的作用域,使每个模块在它自身的命名空间中执行. CommonJS规范的主要内容: 模块必须通过 module. ...
bilibili视频下载 (node.js)
前言 SESSDATA 后面的 ; 分号必需写上,否则请求失败或报错. 后面的实现主要是练习下 js 的特性,使用时看接口就好. node的控制台刷新显示不清楚,将就下默认的计时器显示.这里设置了回调 ...
js原生常用知识点总结
Javascript是一个脚本语言,作为网页的行为层. js的引入方式 * 内部引入:使用script标签,在script标签中写js代码: * 外部引入:使用script的src属性,引入一个外部的 ...
node mocha_如何使用Mocha和Assert测试Node.js模块
node mocha The author selected the Open Internet/Free Speech Fund to receive a donation as part of t ...
前端复习8：JS高级
前端复习8:JS高级 1.对象 1.1 面向过程与面向对象 1.2 对象与类 2 构造函数和原型 2.1 构造函数 2.2 构造原型prototype 2.2 对象原型 2.3 constructor ...

js实例化以及constructor探究

js实例化以及constructor探究相关推荐

最新文章

热门文章