一道筆試題引發的思考

soasme 發布于2019-08-20 18:24 / 3238人閱讀

摘要：前兩天做了一份筆試題按照執行順序列出下面代碼的打印內容可能有些小朋友會被里面那個立即執行函數嚇傻。和將指向改變至，也就是了。

前兩天做了一份筆試題：按照執行順序列出下面代碼的打印內容

var name = "The Window";
var object = {
    name : "The Object",
    getNameFunc : function(){
        (() => {
            console.log(this.name)
        })()
        return function(){
            console.log(this.name)
        };
    }
};
var func = object.getNameFunc();
func();
func.call(object);
func.apply(object);

可能有些小朋友會被里面那個立即執行函數嚇傻。沒關系，先看答案，整段代碼輸入瀏覽器，輸出如下：

The Object

The Window

The Object

OK, 一個一個來分析。

執行順序從上往下，這句var func = object.getNameFunc();會產生第一個輸出：The Object
想搞明白為什么輸出這個，必須先知道，this指向誰？
首先，想知道this指向誰，不能看它在哪里被定義，而要看它在哪里被調用，運行object.getNameFunc()時，顯而易見地，調用這個函數的是object，立即執行函數里面的this指向object，this.name自然就是object.name。

因此輸出The Object

那么，接下來，func被賦了什么值？整個getNameFunc()函數嗎？

并不是的，object.getNameFunc()函數運行的時候，閉包那段代碼沒有被執行，只是作為返回結果賦給了func，因此事實上var func = object.getNameFunc()這句等價于：

var func = function() {
     console.log(this.name)
}

現在func跟object就已經沒什么關系了，func里面的this自然指向window。
因此第二句執行語句func()相似于（注意用詞，我這里用的是相似，不是相等）：

object.getNameFunc()() //是的，我沒打錯，兩個括號

嘻嘻，是不是有點蒙圈？

上面說了，由于object.getNameFunc()執行后，會對外暴露出一個匿名函數，即return返回的那個匿名函數

function () {
    console.log(this.name)
}

所以object.getNameFunc()()會調起立即執行函數

(function () {
    console.log(this.name)
})()

注意 —— object.getNameFunc()()這個寫法只是為了能調用閉包函數，如果在真的在瀏覽器跑object.getNameFunc()()，事實上會順序執行輸出兩個結果：一個是立即執行函數的結果，一個是閉包函數的結果。

由于object.getNameFunc()賦值給了func，因而使用func()就可以只調用閉包，而不觸碰那個立即執行函數。這幾句話要小心理解！

通常一個變量未被聲明就使用，會指向window.undefined，然而this是不會指向undefined的，像我們平時定義一個普通函數

function app() {}
// 調用
app()
// 實際上是這樣調用的
window.app()

所以this會指向window，func()自然也等于window.func()，調用方是window，this.name即是window.name。

理解了上面那些，接下來的兩句反倒是簡單了。

func.call(object);
func.apply(object);

call和apply將this指向改變至object，this.name也就是object.name了。

本來寫這篇博客之前還是有點繞的，寫完之后腦子就清晰了，相信以后這類題能輕松答上。

GPU云服務器云服務器筆試題前端筆試題大數據筆試題 java 筆試題

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/84454.html

一道setTimeout async promise執行順序的筆試題引發的思考

摘要：如果你要問他和誰當進去的快，要從下面兩個方面考慮結束時。至于什么，查了很多的資料，了解到一個瀏覽器環境只能有一個事件循環，而一個事件循環可以有多個任務隊列。 ====據說這是今日頭條去年的一道筆試題，主要考察的是setTimeout async promise執行順序～先雙手奉上這道題目～ async function async1() { consol...

soasme 2019-08-23 13:53 評論0 收藏0
一道2016年nice的校招筆試題引發的思考

摘要：注意點這個代碼是嚴格依賴環境的，例如中和是連續的，在編譯器中，和之間有一個空間。注意點當把與交換之后，程序將不會出現死循環，但是程序的越界訪問報錯是少不了的。注意點這種優化是無差別的，即無論你的代碼是否越界，都會進行這樣的優化。目錄聲明原題題目詳細解析運行結果：題目...

shixinzhang 2021-11-24 09:39 評論0 收藏0
一道筆試題引發的Promise筆記

摘要：對象是一個返回值的代理，這個返回值在對象創建時未必已知。這使得異步方法可以像同步方法那樣返回值異步方法會返回一個包含了原返回值的對象來替代原返回值。前言近來參加校招筆試，發現有好幾道關于Promise的題目。然而我都沒有了解過。所以，這篇文章以網易筆試的一道題開始，記錄關于Promise的那些事。文章地址：http://lsxj615.com/2016/08/04... 筆試題 c...

_Suqin 2019-08-22 10:34 評論0 收藏0
一道三目運算測試題引發的思考

摘要：因為加法的優先級比條件運算符高，所以先運算加號，是字符串拼接，結果是非空字符串，在中字符串的布爾類型為。知識點三目運算為真執行為假執行運算優先級在中布爾類型只有以下種情況為假，其他都為真。一、測試題原題：以下代碼的輸出是？ var val = false; alert(val is + val ? true : false); 解析： 1. 此題考察的知識點：三目運算、**運...

SHERlocked93 2019-08-20 18:35 評論0 收藏0
一道JS試題引發的思考

摘要：也給當初出入迷宮的我不小考驗，一道題目可以引發許多思考，今天寫下的只是今時今日的想法，到未來也許還有別樣的看法。對于回調函數，可以對其傳入三個參數分別是當前元素，元素索引，調用的數組。 [1,2,3].map(parseInt) 這道JS題目，相信大家并不會陌生。也給當初出入JS迷宮的我不小考驗，一道題目可以引發許多思考，今天寫下的只是今時今日的想法，到未來也許還有別樣的看法。...

xiao7cn 2019-08-19 18:47 評論0 收藏0