前端變化得太快,腦容量不夠只好記錄在這邊。
# h1 title## h2 title 繼續閱讀
Looking for my next adventure!
# h1 title## h2 title
透過下面的例子瞭解javascript是怎麼運作的
12345678910
var foo = "bar";function bar() { var foo ="baz";}function bax(foo){ foo = "bam"; bam = "yay";}
我原本的認知是第一行的code就是一次的宣告指令
但其實可以透過另一種方式來看這段程式碼
就是把自己當成naive top down compiler
並把compile拆成宣告跟執行兩個步驟
hoisting 是在javascript執行時的一個行為
javascript會在編譯的過程先將所有宣告(declarations)的變數做reference
this有四種綁定的方式
主要是以callsite發生的時機來決定
callsite就是()被執行的位置
如果是在 strict mode , this 指向的是 undefined
若不是 strict mode , this 指向的事 global object
Closure is when a "function" "remembers" its lexical scope even when the function is executed outside that lexical scope. Closure 是指說一個function記住了他在被定義的當下時的lexical scope,即使function在執行的時候是在當時的lexical scope之外
回想自己在前端開發的路上
先學會了一些HTML tags跟一點點的CSS, javascript就開始寫網頁了
接著就是jQuery,Bootstrap,AngularJS等等一大堆的框架
並沒有好好的將網頁三劍客(HTML, CSS, Javascript)踏實的走好
因此想透過閱讀經典前端書籍
建立穩固的知識點
CSS: The Missing Manual
先到modernizr下載modernizr的js檔案
並且選擇自己需要的features再按build
就會取得一個 modernizr-custom.min.js 的檔案
CSS提供了非常多font-size的單位
用在網頁顯示上的 keywords, ems, exes, pixels, percentages 用在列印的 picas, points, inches, centimeters, millimeters.
CSS中的Transform可以直接改變網頁中的元素
套用Transform之後並不會改變元素本來在HTML中版面的位置或大小
而是顯示上被改變了
用下面的例子可以看到放大的元素不會因為放大而自動往下排版
而是直接覆蓋過附近的元素
Transition可以讓元素在兩個不同的CSS style之間作轉換
讓網站更具互動性