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

ECMAScript 6 reflect

רן בר-זיק ינואר 1, 2017 7:07 am אין תגובות

API חדש ונחמד לבדיקות של אובייקטים, פונקציות ושאר ירקות. חלאס עם הבלגן! מעכשיו הכל דרך Reflect.

המאמר הקודםECMAScript 6 proxy
המאמר הבאECMAScript 6 – שימוש בארגומנטים
כדאי תמיד להשאר מעודכנים! אם יש לכם טלגרם, בדקו את ערוץ הטלגרם של האתר שבו אני מעדכן על פוסטים חדשים 🙂 אם אתם רוצים ללמוד תכנות באופן מקיף ומסודר, הצטרפו לאלפי הלומדים בפרויקט "ללמוד ג'אווהסקריפט בעברית" שמלמד לתכנת בג'אווהסקריפט, ב-Node.js ובריאקט וגם מלמד על תרומה לקוד פתוח. גם ספרים דיגיטליים וגם ספרים מודפסים. בשיתוף הקריה האקדמית אונו ובתמיכת חברות מובילות כגון Wix, Outbrain, Elementor, Iron Source, Chegg, Really Good ועוד.

אובייקט ה-reflect הוא אחת מהתוספות החשובות והמשמעותיות ל-ES6 ולא רבים שמים אליו לב וחבל. בגדול, מדובר בדרך משמעותית וטובה יותר לקבל מידע על אובייקט.

אני חושב שאני אתחיל עם דוגמה ואז אני אחפור מעט יותר:


Object.getOwnPropertyDescriptor(1, 'foo')

getOwnPropertyDescriptor הוא מתודה ידועה שבה מקבלים מידע על תכונה מסוימת של אובייקט. במקרה הזה, העברתי 1 בתור אובייקט. 1 הוא לא ממש אובייקט והייתי מצפה לשגיאה מסוימת. אבל במקרה של object יש לנו undefined. לעומת זאת, אם אני אשתמש ב-reflect, אני אקבל שגיאה יותר נורמלית:


Reflect.getOwnPropertyDescriptor(1, 'foo')

אפשר לראות ששם המתודה של Reflect הוא זהה לזה של Object. בעצם, ה-Object מתיישן ו-Reflect מחליף אותו בתור ספק הגישה העיקרי לפעולות של אובייקטים, אבל לא רק. הנה דוגמה נאה ל-apply:


var ages = [11, 33, 12, 54, 18, 96];

// Function.prototype style:
var youngest = Math.min.apply(Math, ages);
var oldest = Math.max.apply(Math, ages);

כאן אני מוצא את המינימום והמקסימום באמצעות apply, אבל כאמור Reflect אמורה להכיל את כל עניין המטא-תכנות – כלומר פעולות על קטעי תוכנה אחרים (כמו פונקציות apply למשל). אם אני רוצה להשתמש ב-Reflect, אני יכול להשתמש ב-apply באופן מאוד אינטואיטיבי:


var ages = [11, 33, 12, 54, 18, 96];

// Reflect style:
var youngest = Reflect.apply(Math.min, Math, ages);
var oldest = Reflect.apply(Math.max, Math, ages);

לא משהו מפיל, אבל בהחלט משהו יעיל. הרציונל מאחורי ה-Reflect הוא כאמור לרכז את כל הפעולות שאנו עושים על תוכנה או חלק מתוכנה כמו apply, get, set, call וחבריהם במקום אחד וכן למנוע אפשרות תיאורטית שמישהו שינה את call או את get או כל פעולה אחרת ב-prototype וחירב לכם את העסק.

הנה דוגמה נוספת במשהו קצת יותר מוחשי: סינגלטון. לפני עידן ה-Reflect, ככה זה נראה:


class Greeting {

    constructor(name) {
        this.name = name;
    }

    greet() {
      return `Hello ${name}`;
    }

}

// ES5 style factory:
function greetingFactory(name) {
    var instance = Object.create(Greeting.prototype);
    Greeting.call(instance, name);
    return instance;
}


יש לנו כאן קלאס, שעליו למדנו במאמר הקודם ופונקציה שאיתו אני יוצא את הקלאס. עם ES5 אני משתמש ב-object.create לעומת זאת, אני יכול להשתמש ב-Reflect.construct:


class Greeting {

    constructor(name) {
        this.name = name;
    }

    greet() {
      return `Hello ${name}`;
    }

}

// ES6 style factory
function greetingFactory(name) {
    return Reflect.construct(Greeting, [name], Greeting);
}


אחד הדברים החזקים הוא שב-Reflect יש גם אפשרות למחוק תכונה, דבר שעד כה הייתי צריך לעשות עם המילה השמורה delete:


//ES5
var myObj = { foo: 'bar' };
delete myObj.foo;
assert(myObj.hasOwnProperty('foo') === false);

//ES6
myObj = { foo: 'bar' };
Reflect.deleteProperty(myObj, 'foo');
assert(myObj.hasOwnProperty('foo') === false);

כאמור, לא משהו שיפיל אתכם מהכיסא. אבל סוף סוף לכל הפעולות 'מטא תכנות' – כלומר כאלו שהאינפוט שלהן הוא אובייקט/פונקציה יש בית אחד שהוא Reflect. רשימה מלאה של תכונות ה-Reflect אפשר למצוא ב-MDN.

Reflect אמור לשחק יפה מאוד עם proxy שעליו כבר דיברנו. למען האמת הפלט של Reflect מאוד דומה לפלט של ה-trap המתאים של proxy. אם אתם משתמשים ב-proxy, סביר להניח שתצטרכו להחזיר Reflect כי זה יהיה לכם יותר קל. הנה דוגמה של מימוש proxy ו-reflect:


var handler = {
  get () {
    return Reflect.get(...arguments)
  }
}
var target = { a: '111' }
var proxy = new Proxy(target, handler);
console.log(proxy.a); //111

במקרה הזה ה-trap הוא על get ואני מחזיר את מה שאני מקבל באמצעות Reflect.get שהוא זהה ל-trap.

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

השארת תגובה

ביטול

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

ללמוד לתכנת ג'אווהסקריפט בעברית שגייס יותר משלוש מאות אלף שקל ולמעלה מ-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 | הצהרת הנגישות של האתר | אבטחת מידע ודיווח על בעיית אבטחת מידע

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