A.创立一个新目标
B.将结构函数的作用域赋给新目标(所以this就指向了这个新目标)
C.履行结构函数中的代码
D.回来这个新目标
最终一点就说明晰,咱们只需回来一个新目标即可。其实new操作符首要是把原型链跟实例的this相关起来,这才是最要害的一点,所以咱们假如需求原型链就有必要要new操作符来进行处理。不然this则变成window目标了。
咱们来分析下jQuery的这个结构,以下是咱们常见的类式写法:
var $$ = ajQuery = function(selector) { this.selector = selector; return this } ajQuery.fn = ajQuery.prototype = { selectorName:function(){ return this.selector; }, constructor: ajQuery } var a = new $$('aaa'); //实例化 a.selectorName() //aaa //得到选择器姓名
首要改造jQuery无new的格局,咱们能够通过instanceof判别this是否为当时实例:
var $$ = ajQuery = function(selector) { if(!(this instanceof ajQuery)){ return new ajQuery(selector); } this.selector = selector; return this }
可是留意千万不要像下面这样写:
var $$ = ajQuery = function(selector) { this.selector = selector; return new ajQuery(selector); } Uncaught RangeError: Maximum call stack size exceeded
这样会无限递归自己,然后形成死循环而且溢出。
jQuery为了防止呈现这种死循环的问题,采纳的手法是把原型上的一个init办法作为结构器
var $$ = ajQuery = function(selector) { //把原型上的init作为结构器 return new ajQuery.fn.init( selector ); } ajQuery.fn = ajQuery.prototype = { name: 'aaron', init: function() { console.log(this) }, constructor: ajQuery }
这样的确处理了循环递归的问题,可是又问题来了,init是ajQuery原型上作为结构器的一个办法,那么其this就不是ajQuery了,所以this就彻底引证不到ajQuery的原型了,所以这儿通过new把init办法与ajQuery给别离成2个独立的结构器。
本站欢迎任何方式的转载,但请有必要注明出处,尊重别人劳动成果
转载请注明: 文章转载自:BETWAY官网网 https://www.nucmc.com/show-13-499-1.html
转载请注明: 文章转载自:BETWAY官网网 https://www.nucmc.com/show-13-499-1.html