在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問(wèn)答/HTML/ js的一道函數(shù),變量基礎(chǔ)題。進(jìn)來(lái)看看

js的一道函數(shù),變量基礎(chǔ)題。進(jìn)來(lái)看看

function Foo(){
    bar=function(){console.log(1)};
    return this;
}

Foo.bar=function(){console.log(2)}
Foo.prototype.bar=function(){console.log(3)};
var bar = function(){console.log(4)}
function bar(){
    console.log(5);
}



new bar();
Foo.bar();
Foo().bar();
bar();
new Foo().bar()
//4 2 1 1 3

這樣瀏覽器編譯后又有函數(shù)提升和變量提升了,最后會(huì)變成什么結(jié)果,為什么new bar會(huì)打印4,console.log(5)是不是被永久覆蓋了?

回答
編輯回答
安于心

1.聲明提升,所以var bar和后面的函數(shù)定義就是5都被提升了
2.提升之后繼續(xù)執(zhí)行,bar被賦值為4的函數(shù)體,所以5的被覆蓋

2017年6月23日 16:38
編輯回答
荒城

一點(diǎn)一點(diǎn)講:
第一步,js解釋器對(duì)js代碼進(jìn)行解析編譯,這個(gè)時(shí)候會(huì)進(jìn)行你知道的函數(shù)聲明提升步驟。
這是源代碼:

function Foo() {
    bar = function() { console.log(1) };
    return this;
}

function bar() {
    console.log(5);
}

Foo.bar = function() { console.log(2) }
Foo.prototype.bar = function() { console.log(3) };
var bar = function() { console.log(4) }

聲明提升轉(zhuǎn)化后代碼:

function Foo(){
    bar=function(){console.log(1)};
    return this;
}

Foo.bar=function(){console.log(2)}
Foo.prototype.bar=function(){console.log(3)};

var bar = undefined;

function bar(){
    console.log(5);
}

bar = function(){console.log(4)}

看到了吧,bar函數(shù)被進(jìn)行了覆蓋,相當(dāng)于以下代碼:

function Foo(){
    bar=function(){console.log(1)};
    return this;
}

Foo.bar=function(){console.log(2)}
Foo.prototype.bar=function(){console.log(3)};

var bar = function(){console.log(4)}

第二步,接著往下執(zhí)行

new bar();//4 這句沒(méi)什么好解釋的,上面就一個(gè)bar函數(shù),使用new操作符執(zhí)行,自然是 4
Foo.bar();//2 這句也簡(jiǎn)單,函數(shù)上直接賦值的靜態(tài)方法,F(xiàn)oo.bar = function() { console.log(2) },自然是2;

第三步,接著往下

Foo().bar(); 
// 這行代碼信息比較過(guò),首先調(diào)用了 Foo函數(shù),函數(shù)里面對(duì)bar進(jìn)行了 重新賦值,然后返回了this,注意理解一下,這里的this是誰(shuí),明說(shuō)了吧,因?yàn)镕oo在全局直接調(diào)用的的,根據(jù)誰(shuí)調(diào)用this指向誰(shuí)原則,這是默認(rèn)是window。
// 所以現(xiàn)在 bar進(jìn)行了重新定義為: bar = function() { console.log(1) };
接著又執(zhí)行了bar函數(shù),根據(jù)上面重新定義的函數(shù)運(yùn)行結(jié)果,自然是 1

第四步

bar();//再次調(diào)用bar函數(shù),相信這里不用在解釋了吧,和上面那步一樣,自然是1

第五步,再往下

new Foo().bar();
// 首先 對(duì)Foo進(jìn)行new操作符,實(shí)例化Foo類,這里不用關(guān)系全局bar再次賦值的問(wèn)題,因?yàn)槭莕ew操作符,返回的就是 這個(gè)類的實(shí)例,所以返回值是 Foo的實(shí)例。
// 接著執(zhí)行了Foo的實(shí)例上的 bar函數(shù),那么 先從實(shí)例上查找bar函數(shù),發(fā)現(xiàn)找不到(Foo上有一個(gè)靜態(tài)的bar函數(shù),但是不是實(shí)例的方法,只能通過(guò)構(gòu)造函數(shù)調(diào)用),然后接著從原型鏈上查找,發(fā)現(xiàn)原型鏈Prototype上恰好有一個(gè)bar方法,找到后就直接調(diào)用,自然是  3
2017年12月10日 06:54
編輯回答
蟲児飛

這里主要是函數(shù)聲明提升,函數(shù)表達(dá)式不提升。提升后的代碼為

var bar;
function Foo() {
    bar = function() { console.log(1) };
    return this;
}

function bar() {
    console.log(5);
}

Foo.bar = function() { console.log(2) }
Foo.prototype.bar = function() { console.log(3) };
bar = function() { console.log(4) }


new bar();//4
Foo.bar();//2  由于Foo中未聲明bar bar找到全局變量并賦值
Foo().bar();// 1
bar();// 1
new Foo().bar()//3
2017年5月24日 15:04
編輯回答
毀了心
function bar(){
    console.log(5);
}

會(huì)函數(shù)提升,等于在最上面
然后被 var bar = function () {} 覆蓋掉

2018年2月8日 01:33