[JavaScript][CoffeeScript] Degisken/Fonksiyon Etki Alanlari

JavaScript'te alisilmisin disinda -PHP'nin disinda!- bir etki alani prensibi mevcut. Ust seviyede tanimlamis oldudugunuz bir degisken ya da fonksiyona asagi seviyelerden ulasabilirsiniz. Alt seviyeden ust seviyeye ise hayir. (Yani bunun yontemleri var ancak konuyla alakali olmadigindan dolayi pas geciyorum.)

Beni bu arastirmaya iten "CoffeeScript'teki -> ile => arasindaki farkin nedenir nedir?" sorusuydu. Sorunun cevabi yukaridaki bilginin varligindan haberi olan kisiler icin gayet net olarak dokumante edilmis CoffeeScript tarafindan. Durumu aciklamaya calisalim:

	$('#menu a').click(function(event)
	{
	// $(this)
	// Bize '#menu a'ya ait tiklanmis olan elementi gosterecektir.
	$('#menu li').each(function(index)
	{
	// $(this)
	// Bize '#menu li'ye ait elementleri isaret edecektir.
	});
	});

view raw 1_scope.js hosted with ❤ by GitHub

Peki ya yukaridaki gibi bir kodlamada ust seviyedeki elementi secmek istersek? Ki buyuk ihtimalle oyle bir seye ihtiyaciiz olacaktir. Oyleyse asagidaki gibi yapip baska bir degiskene atamak gerekli, referans gosterip elbette.

	$('#menu a').click(function(event)
	{
	$me = $(this);
	$('#menu li').each(function(index)
	{
	// $(this)
	// Bize '#menu li'ye ait elementleri isaret edecektir.
	//$me
	// Bize '#menu a'ya ait tiklanmis olan elementi gosterecektir.
	});
	});

view raw 2_scope.js hosted with ❤ by GitHub

Islem bu kadar. Simdi gelelim bunun CoffeeScript ile olan iliskisine:

CoffeeScript ile calisiyorken nesne tabanli calismak zorunda hissediyorsunuz kendinizi, "class" etiketini gordukten sonra, ehehe. Elbette boyle bir durumda this kelimesi sizin icin gerekli oluyor, gerci bu ornekte sinif tanimlanmiyor ancak yine de ilintili. Lafi da  fazla uzatmadan CoffeeScript'in kendi ornegi uzerinden olayi aciklamak istiyorum:

	Account = (customer, cart) ->
	@customer = customer
	@cart = cart
	$('.shopping_cart').bind 'click', (event) ->
	# Burada @ bize bind'in icerisindeki 'this'e yonlendirecek,
	# haliyle asagidaki degiskenler hata verecektir. Cunku
	# bind'in icerisinde bunlar tanimli degil!
	@customer.purchase @cart

view raw 3_scope.coffee hosted with ❤ by GitHub

Sorun kendini bellli ettigine gore cozumune de asagidan ulasabilirsiniz:

	Account = (customer, cart) ->
	@customer = customer
	@cart = cart
	$('.shopping_cart').bind 'click', (event) =>
	# -> yerine => kullandiktan sonra CoffeeScript artik @ 'i
	# kullandigimizda bind'e degil, sinifin kendisine atif yapacaktir.
	# yani artik degiskenlerimiz sinifta tanimli oldguklarindan dolayi
	# artik erisilebilir durumda olacaktirlar.
	@customer.purchase @cart
	# Peki ya burada bind'in kendisine atif yapmak icin ne gerekli?
	# Uzuuun uzun 'this' yazilmasi gerekli. Biliyorum Coffee'nin
	# kisa sozdizimine alistiktan sonra buyuk bir zulum bu ancak
	# mecburiyet... :)

view raw 4_scope.coffee hosted with ❤ by GitHub

Bu kadar... :)