Slide 1

Slide 1 text

JavaScript Closure Ping-Yen Tsai 1 / 10

Slide 2

Slide 2 text

JavaScript 函式裡還可以宣告函式 f u n c t i o n f ( ) { g ( ) ; f u n c t i o n g ( ) { a l e r t ( 1 ) ; } } f ( ) ; / / 1 g ( ) ; / / R e f e r e n c e E r r o r : g i s n o t d e f i n e d 2 / 10

Slide 3

Slide 3 text

裡面的函示可以存取外面函示的變數 f ( ) ; f u n c t i o n f ( ) { v a r c = 0 ; g ( ) ; a l e r t ( c ) ; / / 1 g ( ) ; a l e r t ( c ) ; / / 2 f u n c t i o n g ( ) { + + c ; } } 3 / 10

Slide 4

Slide 4 text

Closure = 函式 + 函式外變數 f u n c t i o n f ( ) { v a r c = 0 ; f u n c t i o n g ( ) { + + c ; } } 函式與函式外變數生存期間一致 v a r h = f ( ) ; f u n c t i o n f ( ) { v a r c = 0 ; f u n c t i o n g ( ) { + + c ; } r e t u r n g ; } 4 / 10

Slide 5

Slide 5 text

Closure Sample v a r h 1 = f ( ) ; h 2 = f ( ) ; h 1 ( ) ; / / 1 h 1 ( ) ; / / 2 h 2 ( ) ; / / 1 f u n c t i o n f ( ) { v a r c = 0 ; f u n c t i o n g ( ) { a l e r t ( + + c ) ; } r e t u r n g ; } 5 / 10

Slide 6

Slide 6 text

Closure Sample v a r h = ( f u n c t i o n ( ) { v a r c = 0 ; r e t u r n f u n c t i o n ( ) { + + c ; } } ) ( ) ; 6 / 10

Slide 7

Slide 7 text

Global 變數 v a r c = 0 ; v a r h = f u n c t i o n ( ) { a l e r t ( + + c ) ; } ; h ( ) ; / / 1 h ( ) ; / / 2 h ( ) ; / / 3 Closure v a r h = ( f u n c t i o n ( ) { v a r c = 0 ; r e t u r n f u n c t i o n ( ) { a l e r t ( + + c ) ; } ; } ) ( ) ; h ( ) ; / / 1 h ( ) ; / / 2 h ( ) ; / / 3 7 / 10

Slide 8

Slide 8 text

達成近似 Java Class Private Member 效果 8 / 10

Slide 9

Slide 9 text

Google Maps JavaScript API v3 範例 Using closures in event listeners 9 / 10

Slide 10

Slide 10 text

Free variables and bound variables - Wikipedia 10 / 10