ES6 Symbol

Emrah
2 min readDec 28, 2017

--

ES6 ile birlikte gelen bize bir cesit UUID gorevi goren primitive tiptir. Ornegin bir uygulamada renkler icin constant veri tipine ihtiyacimiz olsun ve bunu su sekilde uygulayalim

var color = {
BLUE : 'blue',
RED : 'red',
YELLOW: 'yellow'
}

Simdi bu kullanarak basit bir mesaj ureten bir fonksiyon uretelim. Bu fonksiyon gonderilen renk verisini bir switch icinde kontol edip ona gore bir mesaj uretip geri donduruyor.

function colorMessageBuilder(myColor){
switch (myColor){
case color.BLUE:
return "hey blue!";
case color.RED:
return "hey red!";
case color.YELLOW:
return "hey yellow!";
}
}

Uygulamamizin gunler sonra bircok gelistiricinin elinden gectigini farzedin. Bir baska gelistirici yeni bir renk constanti LIGHT_BLUE adinda yeni bir consant yaratmis oldugunu dusunun, ama bu sefer gelistirici bir hata yapiyor ve bu constant degerinin karsiligindaki essiz (unique) olmasi gereken string degerine 'blue' giriyor. Yani su sekilde;

var color = {
BLUE : 'blue',
RED : 'red',
YELLOW: 'yellow',
LIGHT_BLUE: 'blue'
}

LIGHT_BLUE: 'blue've LIGHT_BLUE: 'blue' satirlarina dikkat edin, burada essiz olmasi gereken blue string bilgisi iki kere tekrarlanmis. Mesaj ureten fonksiyonumuzu asagidaki gibi duzenlersek LIGHT_BLUE rengi ile cagirdigimizda hey light blue! diye bir mesaj beklesek de bu string cakismasindan dolayi hey blue! diye yanlis mesaj alacagiz.

function colorMessageBuilder(myColor){
switch (myColor){
case color.BLUE:
return "hey blue!";
case color.RED:
return "hey red!";
case color.YELLOW:
return "hey yellow!";
case color.LIGHT_BLUE:
return "hey light blue!";
}
}

cunku myColor == color.BLUE ve mycolor == color.LIGHT_BLUE ikisi de true dondugu icin ilk true veren case durumunda fonksiyon mesaji donecektir. Ornegin bu sekilde fonksiyonu cagirdigimizda hey light blue! beklerken hey blue! mesaji aliriz;

var message = colorMessageBuilder(color.LIGHT_BLUE);
console.log(message); // "hey blue!";

ES6 ile birlikte bu gibi pirimitive veri cakismasini onlemek icin symbol diye yeni bir primitive tanitmistir. static olarak cagirdigimiz Symbol() fonksiyonu her seferinde essiz bir primitive symbol uretecek bu sayede asla cakisma olmayacak. eger kodumuzuda constant color tanimimizda symbol kullanacak olursak;

var color = {
BLUE : Symbol(),
RED : Symbol(),
YELLOW: Symbol(),
LIGHT_BLUE: Symbol()
}
function colorMessageBuilder(myColor){
switch (myColor){
case color.BLUE:
return "hey blue!";
case color.RED:
return "hey red!";
case color.YELLOW:
return "hey yellow!";
case color.LIGHT_BLUE:
return "hey light blue!";
}
}
var message = colorMessageBuilder(color.LIGHT_BLUE);
console.log(message); //"hey light blue!"

asla cakisma olmayacak ve dogru olan bekledigimiz hey light blue! mesajini alacagiz.

Unutmamak gerekli, asla new Symbol() ile yeni bir symbol uretmiyoruz cunku bu fonksiyon static bir method. Bu nedenle new keyword kullanmiyoruz aksi taktirde TypeError: Symbol is not a constructor hatasi aliriz.

--

--