1. 普通函數和閉包函數的區別，閉包攜帶了執行的環境
2. 宏任務和微任務的區別
宏任務 由宿主環境API創建的任務 例如： setTimeout
微任務 由執行環境創建的任務 例如： promise
3. 12.toString() 會報錯 Uncaught SyntaxError: Invalid or unexpected token
原因是這時候12. 會被當做省略了小數點後面部分的數字而看成一個整體，所以我們要想讓點單獨成爲一個 token，就要加入空格，這樣寫：
12 .toString()
4. 零寬字符
var a = "\uFEFF", b = 'b', c = 'c', d = b + a + c;
console.log(d) // bc
console.log(d.length) // 3
console.log(d.indexOf(a)) // 1
5. var 變量提升與with作用域
var a = 1;
function foo() {
var o= {a:3}
with(o) {
var a = 2;
}
console.log(o.a); // 2
console.log(a); // undefined
}
foo();
在這個例子中，我們引入了 with 語句，我們用 with(o) 創建了一個作用域，並把 o 對象加入詞法環境，在其中使用了var a = 2;語句。
在預處理階段，只認var中聲明的變量，所以同樣爲 foo 的作用域創建了 a 這個變量，但是沒有賦值。
在執行階段，當執行到var a = 2時，作用域變成了 with 語句內，這時候的 a 被認爲訪問到了對象 o 的屬性 a，所以最終執行的結果，我們得到了 2 和 undefined
6. 函數聲明
console.log(foo); // 函數體
function foo(){
}
function 聲明出現在 if 等語句中的情況有點複雜，它仍然作用於腳本、模塊和函數體級別，在預處理階段，仍然會產生變量，它不再被提前賦值
console.log(foo); // undefined
if(true) {
function foo(){
}
}
7. 如何選中SVG元素中的a標籤
<svg width="100" height="28" viewBox="0 0 100 28" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <desc>Example link01 - a link on an ellipse </desc>
<a xlink:href="http://www.w3.org">
<text y="100%">name</text>
</a>
</svg>
svg|a { stroke:blue; stroke-width:1;}
8. 僞元素選擇器
<div>
<p id=a>First paragraph</p>
<p>Second paragraph</p>
</div>
div>p#a {
color:green;
}
div::first-line {
color:blue;
}
這段代碼最終結果第一行是藍色，因爲 p 是塊級元素，所以僞元素出現在塊級元素之內，所以內層的 color 覆蓋了外層的 color 屬性。
如果我們把 p 換成 span，結果就是相反的
<div>
<span id=a>First paragraph</span><br/>
<span>Second paragraph</span>
</div>
div>span#a {
color:green;
}
div::first-line {
color:blue;
}
這段代碼的最終結果是綠色，這說明僞元素在 span 之外
9. area連接，可以實現點擊圖片不同的位置連接到不同的地址
<p>
Please select a shape:
<img src="shapes.png" usemap="#shapes"
alt="Four shapes are available: a red hollow box, a green circle, a blue triangle, and a yellow four-pointed star.">
<map name="shapes">
<area shape=rect coords="50,50,100,100"> <!-- the hole in the red box -->
<area shape=rect coords="25,25,125,125" href="red.html" alt="Red box.">
<area shape=circle coords="200,75,50" href="green.html" alt="Green circle.">
<area shape=poly coords="325,25,262,125,388,125" href="blue.html" alt="Blue triangle.">
<area shape=poly coords="450,25,435,60,400,75,435,90,450,125,465,90,500,75,465,60"
href="yellow.html" alt="Yellow star.">
</map>
</p>
10. iframe標籤的使用
let elemEF = document.createElement("iframe");
elemEF.src = 'http://**.'
elemEF.style.display = 'none';
document.body.appendChild(elemEF);
11. 正則表達式match 和exec 的使用
const re_date = /(\d{4})-(\d{2})-(\d{2})/;
console.log(re_date.exec('1999-12-30'))
// ["1999-12-30", "1999", "12", "30", index: 0, input: "1999-12-30", groups: undefined]
'a1a2a3'.match(/a\d/gy)
// ["a1", "a2", "a3"]
'a1a2a3'.match(/a\d/g)
// ["a1", "a2", "a3"]
12. ES6擴展運算符的靈活運用方式 ... spread
let obj = {a: 1};
console.log({...obj, a: 2}) // {a: 2}