標題們

# h1 title
## h2 title

javascript - Scope

2016年9月22日

透過下面的例子瞭解javascript是怎麼運作的

var foo = "bar";
function bar() {
	var foo ="baz";
}
function bax(foo){
	foo = "bam";
	bam = "yay";
}

我原本的認知是第一行的code就是一次的宣告指令

但其實可以透過另一種方式來看這段程式碼

就是把自己當成naive top down compiler

並把compile拆成宣告跟執行兩個步驟

javascript - Hoisting

2016年9月22日

hoisting 是在javascript執行時的一個行為

javascript會在編譯的過程先將所有宣告(declarations)的變數做reference

javascript - This

2016年9月22日

this有四種綁定的方式

主要是以callsite發生的時機來決定

callsite就是()被執行的位置

1. Default binding rule

如果是在 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之外

Pseudo-Classes and Pseudo-Elements

2016年9月26日

回想自己在前端開發的路上

先學會了一些HTML tags跟一點點的CSS, javascript就開始寫網頁了

接著就是jQuery,Bootstrap,AngularJS等等一大堆的框架

並沒有好好的將網頁三劍客(HTML, CSS, Javascript)踏實的走好

因此想透過閱讀經典前端書籍

建立穩固的知識點

先學走，再學跑

CSS: The Missing Manual

用 Modernizr 來判斷瀏覽器是否支援 html5 的 features

2016年9月26日

先到modernizr下載modernizr的js檔案

並且選擇自己需要的features再按build

就會取得一個 modernizr-custom.min.js 的檔案

Font-Size

2016年9月27日

CSS提供了非常多font-size的單位

用在網頁顯示上的 keywords, ems, exes, pixels, percentages
用在列印的 picas, points, inches, centimeters, millimeters.

Transform

2016年9月27日

CSS中的Transform可以直接改變網頁中的元素

套用Transform之後並不會改變元素本來在HTML中版面的位置或大小

而是顯示上被改變了

用下面的例子可以看到放大的元素不會因為放大而自動往下排版

而是直接覆蓋過附近的元素

Transition

2016年9月27日

Transition可以讓元素在兩個不同的CSS style之間作轉換

讓網站更具互動性

2016

十月

九月

Jhao Cheng Wu

2016

十月

九月

Jhao Cheng Wu

Hexo Markdown 的使用

標題們

# h1 title

## h2 title

javascript - Scope

javascript - Hoisting

javascript - This

1. Default binding rule

javascript - Closure

Pseudo-Classes and Pseudo-Elements

用 Modernizr 來判斷瀏覽器是否支援 html5 的 features

Font-Size

Transform

Transition