一道考察運算子優先順序的JS面試題

小結

最近遇到乙個有意思的js相關的題目，看了網上的一些講解，感覺不是那麼靠譜。自己查閱資料後，做了一下總結。

題目

function foo()
return this;
}foo.getname = function()
foo.prototype.getname = function()
var getname = function()
function getname()
foo.getname();//2
getname(); //4
foo().getname(); //1
getname(); //1
new foo.getname(); //2 
new foo().getname(); //3
new new foo().getname(); //3

最後的輸出結果，我已經在**的注釋中寫了，下面我開始對這7個輸出結果進行一一分析。

分析1. foo.getname()

這個很簡單了，取的是建構函式foo的getname屬性

2 .getname

這裡涉及到了變數提公升的相關知識，我們把**進行一下更改

var getname = function()
function getname()

更改如下

var getname;
function getname()
getname= function()

這樣你就知道為啥會輸出4了

3. foo().getname()

foo().getname()會先執行左側的foo(),執行的結果是返回this，這個this指向的就是window，所以執行結果相當於window.getname()。但是需要注意的是foo()的內部定義了乙個全域性變數getname，它會覆蓋函式外部的getname,所以，window.getname()實際執行的是foo()內部的getname()，所以輸出結果就是1。

4. getname()

同上面，此時全域性的getname是foo()內部的那個getname，所以輸出結果就是1。

5. new foo.getname()

在講解下面的這幾個列子時，我們需要對操作符的優先順序有一定的了解，這裡是運算子優先順序的傳送門。

圖中我們可以看到()圓括號的優先順序最高，其次就是.點運算子。這裡面有一點是需要特別注意的，那就是排在19的new (帶引數列表)和函式呼叫，以及排在18的new (無引數列表)。

下面我們再來分析new foo.getname()的執行順序：

執行foo.getname，得到f

執行new f()

所以執行結果就是2，你可以進行如下驗證new (foo.getname)()

6. new foo().getname()

有了上面的運算子的優先順序，我們再來看看這個列子

new foo()的到m, m是乙個foo的例項

m.getname()

輸出結果就是3，你可以進行如下驗證 ( ( new foo() ).getname )()

7. new new foo().getname()

new foo()得到m, 即new m.getname()；

m.getname得到函式f

new f()

輸出結果就是3。你可以進行如下驗證new ( ( new foo() ).getname )()

小結看了我上面的解釋你可能還是有所疑惑的，關鍵點在於這個new foo().getn()和new foo.getn()的區別。這裡我說一下我個人的理解，new運算子會優先匹配帶()的表示式。比如new foo()，因為new+foo+()的優先順序比new + foo的優先順序高，所以會執行new foo()而不是(new foo)()。你可以在上面的例項中測試一下(new foo).getname()的結果，肯定就是3啦。

根據上面的描述，我們再來看看列子7new new foo().getname():

首先是.運算子，先執行其左側new new foo()，先執行new foo()得到例項物件foo，然後表示式如下new foo.getname()，此時左側表示式只剩下new 操作符，但是new操作符可以理解為對()貪婪的，它不會立即執行new foo，而是等待foo.getname的執行結果f，然後執行new f()。

由此我的結論就是new操作符是對()貪婪的，遇到()它就立即執行，沒有遇到，它就等待。

一道考察運算子優先順序的JS面試題

js運算子優先順序

運算子優先順序 C 運算子優先順序

運算子優先順序 Python 運算子優先順序

一道考察運算子優先順序的JS面試題

js運算子優先順序

運算子優先順序 C 運算子優先順序

運算子優先順序 Python 運算子優先順序

相關推薦