閉包(closure)在 JavaScript 中佔著重要的地位,但閉包本人其實不太好搞,先從與閉包密不可分的 ── 作用範圍(Scope)開始下手吧!這篇將從執行背景空間(execution context)開始介紹,一步步看 JavaScript 引擎是如何追蹤程式碼的執行,然後…等時機到了就會知道什麼是閉包了(吧)。
閉包(closure)在 JavaScript 中佔著重要的地位,但閉包本人其實不太好搞,先從與閉包密不可分的 ── 作用範圍(Scope)開始下手吧!這篇將從執行背景空間(execution context)開始介紹,一步步看 JavaScript 引擎是如何追蹤程式碼的執行,然後…等時機到了就會知道什麼是閉包了(吧)。
什麼是定格動畫?簡單來說,是一種動畫技術,它的原理是將每幀不同的圖像快速播放,因人眼有視覺暫留,所以會產生動畫效果。小時候玩的手翻書就是以這樣的原理來達成動畫的效果!
在 JavaScript 中,改變函數內部 this 的指向常見的方式有 call()
、apply()
、bind()
,而這三種方式又存在些微差異。
或許你沒聽過 Block Formatting Context,但你肯定有用過!其實在切版時,常常會使用到 BFC,只是你沒有意識到而已,如果能夠有意識的使用 BFC,對於版面的掌控非常有幫助。
每個元素都是一個個的盒子(box),這些盒子在 in flow 下會如何排列就要看該盒子處在什麼樣的佈局環境,而 formatting context (格式化上下文) 指的就是佈局環境,不同類型的佈局環境會有不同的佈局規則,換句話說,處在不同類型佈局環境裡的盒子,排列方式會有所不同。
Line box 就像筆記本上的線框,一行一行的垂直堆疊,裡面裝著文字或是 inline-level boxes,而我們可以利用 text-align 與 vertical-align 屬性操控 inline-level boxes 在 line box 裡的水平與垂直對齊。
Visual formatting model (視覺格式化模型) 對於排版來說是很重要的觀念,但不是那麼平易近人且有點抽象,在初次看 W3C 規範 時一定是霧煞煞,強烈建議先釐清幾個重要名詞的定義,會發現繞來繞去,講的其實都是相同的概念。
Containing block,中文常被翻譯為包含塊,它其實代表的是一個「區域」,一個由 box model 的 content edge 或 padding edge (若有設定 padding)所圍繞的範圍,它攸關元素的定位、寬高、內距與外距的計算,所以必須清楚知道元素的 containing block 是誰,才不會使畫面失控。
Update your browser to view this website correctly. Update my browser now