אינטרנט ישראל
  • ראשי
  • אודות רן בר-זיק ואינטרנט ישראל
  • ערוץ טלגרם
  • קבלו עדכונים במייל
  • התחברו אלי בטוויטר
  • התחברו אלי בלינקדאין
  • ספר ג'אווהסקריפט
  • ראשי
  • אודות רן בר-זיק ואינטרנט ישראל
  • ערוץ טלגרם
  • קבלו עדכונים במייל
  • התחברו אלי בטוויטר
  • התחברו אלי בלינקדאין
  • ספר ג'אווהסקריפט
ראשי » מדריכים » ECMAScript 6 » ECMAScript 6 symbol

ECMAScript 6 symbol

רן בר-זיק דצמבר 18, 2016 7:07 am 4 תגובות

על היכולת החדשה ב-ES6 ליצור מסמן ייחודי

המאמר הקודםECMAScript 6 – לולאת for of
המאמר הבאECMAScript 6 proxy
כדאי תמיד להשאר מעודכנים! הרשמו לעדכונים של האתר במייל! - המייל יישלח כל יום ראשון בעשר בבוקר ויכיל אך ורק את המאמרים שהתפרסמו באינטרנט ישראל. ללא ספאם, ללא הצפות, ללא בלגנים. אם יש לכם טלגרם, בדקו את ערוץ הטלגרם של האתר שבו אני מעדכן על פוסטים חדשים 🙂 אם אתם רוצים ללמוד תכנות באופן מקיף ומסודר, הצטרפו לאלפי הלומדים בפרויקט "ללמוד ג'אווהסקריפט בעברית" שמלמד לתכנת בג'אווהסקריפט, ב-Node.js ובריאקט. הפרויקט הוא הפרויקט הספרותי המוביל בהדסטארט. בשיתוף הקריה האקדמית אונו.

האמת היא ש-Symbol זה פיצ'ר קצת מוזר ב-ECMAScript 6, אני קודם אסביר עליו ואז אני אסביר למה הוא טוב. התווכחתי עם כמה מתכנתים נוספים בנוגע אליו. אני חושב שהשימושים המעשיים שלו מאוד מוגבלים, אם בכלל והם חושבים שיש מצב שנראה את זה. מה שכן, הוא יחסית פשוט אז כדאי לעבור עליו.

באופן עקרוני, Symbol זה סוג פרימיטיבי של מידע ייחודי, מיוחד שאינו חוזר על עצמו ואינו ניתן לשינוי. מייצרים אותו עם Symbol (ללא new כי זה פרימיטיב).


var oneSymbol = Symbol();
var twoSymbol = Symbol();
console.log(oneSymbol === twoSymbol); //false

מה שנכנס לתוך משתנה oneSymbol הוא ה-Symbol. ערך ייחודי לחלוטין שנשמר ברפרנס. אי אפשר לקבוע דבר בנוגע לערך הזה מלבד דבר קיומו. אם אייצר עוד Symbol ואכניס אותו ל-twoSymbol, הוא לא יהיה אותו הדבר ומדובר בשני ערכים שונים לחלוטין.

לשם דיבאגינג בלבד, אני יכול להכניס תיאור ל-symbol, אבל הוא יהיה זמין בקונסול בלבד:


var oneSymbol = Symbol('this is a descriptive description');
console.log(oneSymbol); //Symbol(this is a descriptive description)

ככה זה יראה, אגב:

var oneSymbol = Symbol('this is a descriptive description'); console.log(oneSymbol) VM330:2 Symbol(this is a descriptive description)

אם נעשה ל-Symbol typeof, נראה שהוא בסך הכל Symbol:


var oneSymbol = Symbol();
console.log(typeof oneSymbol); //"symbol"

נשאלת השאלה למה צריך את זה, וזו שאלה מצוינת. כאשר ה-Symbol הוא לא גלובלי, השימושים שלו מועטים – בדרך כלל בכל פעם שצריך משהו ייחודי (ולפעמים צריך). יש כאלו שמשתמשים ב-Symbol כדי לסמלץ משתנה פרטי ב-class. הנה דוגמה:


class Something {
    constructor(){
var property = Symbol();
        this[property] = 'test';
    }
}

var instance = new Something();

console.log(instance[property]); //undefined, can only access with access to the Symbol

אבל לדעתי זה משהו שעדיף לא לעשות עם Symbol. הכוח הגדול של Symbol הוא דווקא בצד הגלובלי.

Symbol.for – גלובלי

פה זה כבר מתחיל להיות מעניין. בואו נעבור במהירות על ה-API.

בניגוד ל-Symbol רגיל, עם Symbol.for אני יכול לקבוע 'מפתח' ל-Symbol שהוא יוצר symbol ייחודי למפתח הזה. ואני אדגים:


var oneSymbol = Symbol.for('foo');
var secondSymbol = Symbol.for('foo');

console.log(oneSymbol === secondSymbol); //true

אם יש לי Symbol גלובלי, אני יכול למצוא אותו בקלות עם מתודת forKey:


var oneSymbol = Symbol.for('foo');
console.log(Symbol.keyFor(oneSymbol)); //foo

סבבה, נכון? אבל מה שחזק ממש הוא שה-Symbol שיווצר הוא אותו Symbol על פני חלקים שונים באפליקציה שלי. כלומר אם יש קוד שמייצר Symbol ב-iframe למשל וקוד שמייצר ב-window, זה יהיה אותו Symbol! אני אדגים:


var frame = document.createElement('iframe')
document.body.appendChild(frame)
console.log(Symbol.for('foo') === frame.contentWindow.Symbol.for('foo'))

בקוד הזה אני יוצר iframe ומדביק אותו ל-window שלי. אני יוצר Symbol גם ב-iframe וגם באפליקציה שלי ונראה שהתוצאה תהיה true.

זה מאוד מגניב וגם עלול להיות שימושי אם אני רוצה לחלוק מידע בין iframe ל-window. באופן אישי? הייתי משתמש בזה אך ורק אם אצטרך אי פעם מסמן ייחודי למשהו.

כדאי תמיד להשאר מעודכנים! הרשמו לעדכונים של האתר במייל! - המייל יישלח כל יום ראשון בעשר בבוקר ויכיל אך ורק את המאמרים שהתפרסמו באינטרנט ישראל. ללא ספאם, ללא הצפות, ללא בלגנים. אם יש לכם טלגרם, בדקו את ערוץ הטלגרם של האתר שבו אני מעדכן על פוסטים חדשים 🙂 אם אתם רוצים ללמוד תכנות באופן מקיף ומסודר, הצטרפו לאלפי הלומדים בפרויקט "ללמוד ג'אווהסקריפט בעברית" שמלמד לתכנת בג'אווהסקריפט, ב-Node.js ובריאקט. הפרויקט הוא הפרויקט הספרותי המוביל בהדסטארט. בשיתוף הקריה האקדמית אונו.
למדריך המלא של ECMAScript 6
ECMAScript 6

4 תגובות

  1. Haim Litvak הגב דצמבר 19, 2016 בשעה 4:42 pm

    לדעתי במקום
    console.log(instance.property); //undefined, can only access with access to the Symbol

    היה צריך להיות
    console.log(instance[property]); // prints test

    כמו כל משתנה אחר שעל פיו תחפש באובייקט.

    • רן בר-זיק הגב דצמבר 27, 2016 בשעה 7:02 am

      אתה צודק כמובן, הדוגמה היתה שגויה… תיקנתי 🙂 תודה!

    • נתן הגב יוני 10, 2019 בשעה 12:42 am

      זה הרבה יותר מורכב ממה שנאמר

  2. אהרון הגב דצמבר 22, 2016 בשעה 8:20 am

    שימושי מאוד. תודה!

השארת תגובה ל-רן בר-זיק

ביטול

ללמוד ג'אווהסקריפט בעברית

ללמוד לתכנת ג'אווהסקריפט בעברית שגייס יותר משלוש מאות אלף שקל ולמעלה מ-2000 תומכים - בואו ללמוד עכשיו איך לתכנת.

רשימת הנושאים
  • מדריכים
    • ריאקט
    • ECMAScript 6
    • ES20XX
    • Node.js
    • Express
    • רספברי פיי
    • Babel
    • docker
    • MongoDB
    • Git
    • לימוד MySQL
    • SASS
    • jQuery
    • CSS3
    • HTML 5
    • SVN
    • LESS
  • פיתוח אינטרנט
    • פתרונות ומאמרים על פיתוח אינטרנט
    • jQuery Scripts
    • jQuery למתקדמים
    • יסודות בתכנות
    • נגישות אינטרנט
  • חדשות אינטרנט
  • מידע כללי על אינטרנט
    • רשת האינטרנט
    • בניית אתרי אינטרנט
  • rss logo

    לכל המאמרים

    לכל המאמרים שפורסמו באינטרנט ישראל משנת 2008 ועד עכשיו.
  • rss logo

    RSS Feed

    משתמשים בקורא RSS? אם כן, עקבו אחרי אינטרנט ישראל באמצעות פיד ה-RSS!
    מה זה RSS?
  • Twitter logo

    עקבו אחרי בטוויטר

    בחשבון הטוויטר שלי אני מפרסם עדכונים מהירים על חדשות בתחום התכנות והיזמות, התרעות על מצבי חירום ורכילות בוערת על תחום הווב.
    מה זה טוויטר?
  • facebook like image

    ערוץ הטלגרם של אינטרנט ישראל

    בערוץ הטלגרם של אינטרנט ישראל אני מפרסם את הפוסטים של באתר וכן עדכונים טכנולוגיים נוספים.
    מה זה טלגרם?
  • github logo

    הפרויקטים שלי בגיטהאב

    הפרויקטים שאני כותב ושוחררו לציבור ברישיון קוד פתוח נמצאים ברובם בגיטהאב.
חיפוש

כל הזכויות שמורות לרן בר-זיק ולאינטרנט ישראל | מדיניות הפרטיות של אתר אינטרנט ישראל | אתר אינטרנט ישראל נגיש לפי תקן WCAG 2.0 AA | הצהרת הנגישות של האתר | אבטחת מידע ודיווח על בעיית אבטחת מידע

גלילה לראש העמוד