JavaScript 是一種有趣的語言，我們都喜歡它，因為它的性質(zhì)。瀏覽器是JavaScript的主要運行的地方，兩者在我們的服務中協(xié)同工作。JS有一些概念，人們往往會對它掉以輕心，有時可能會忽略不計。原型、閉包和事件循環(huán)等概念仍然是大多數(shù)JS開發(fā)人員繞道而行的晦澀領域之一。正如我們所知，無知是一件危險的事情，它可能會導致錯誤。

接下來，來看看幾個問題，你也可以試試想想，然后作答。

問題1：瀏覽器控制臺上會打印什么？

var a = 10;function foo() { console.log(a); // ?? var a = 20;}foo();

問題2：如果我們使用 let 或 const 代替 var，輸出是否相同？

var a = 10;function foo() { console.log(a); // ?? let a = 20;}foo(); 

問題3：“newArray”中有哪些元素？

var array = [];for (var i = 0; i < 3; i++) { array.push(() => i);}var newArray = array.map(el => el());console.log(newArray); // ?? 

問題4：如果我們在瀏覽器控制臺中運行'foo'函數(shù)，是否會導致堆棧溢出錯誤？

function foo() { setTimeout(foo, 0); // 是否存在堆棧溢出錯誤?}

問題5: 如果在控制臺中運行以下函數(shù)，頁面(選項卡)的 UI 是否仍然響應

function foo() { return Promise.resolve().then(foo);} 

問題6: 我們能否以某種方式為下面的語句使用展開運算而不導致類型錯誤

var obj = { x: 1, y: 2, z: 3 };[...obj]; // TypeError

問題7：運行以下代碼片段時，控制臺上會打印什么？

var obj = { a: 1, b: 2 };Object.setPrototypeOf(obj, { c: 3 });Object.defineProperty(obj, "d", { value: 4, enumerable: false });// what properties will be printed when we run the for-in loop?for (let prop in obj) { console.log(prop);}

問題8：xGetter() 會打印什么值？

var x = 10;var foo = { x: 90, getX: function() { return this.x; }};foo.getX(); // prints 90var xGetter = foo.getX;xGetter(); // prints ??

答案

現(xiàn)在，讓我們從頭到尾回答每個問題。我將給您一個簡短的解釋，同時試圖揭開這些行為的神秘面紗，并提供一些參考資料。

問題1： undefined

使用var關鍵字聲明的變量在JavaScript中會被提升，并在內(nèi)存中分配值undefined。 但初始化恰發(fā)生在你給變量賦值的地方。 另外，var聲明的變量是函數(shù)作用域的，而let和const是塊作用域的。 所以，這就是這個過程的樣子：

var a = 10; // 全局使用域function foo() { // var a 的聲明將被提升到到函數(shù)的頂部。 // 比如:var a console.log(a); // 打印 undefined // 實際初始化值20只發(fā)生在這里 var a = 20; // local scope}