כיצד פועלים אובייקטי פרוקסי ב-JavaScript?

אובייקט proxy של JavaScript מאפשר ליירט ולהתאים אישית את ההתנהגות של אובייקט אחר, מבלי לשנות את המקור.

באמצעות אובייקטי proxy, אתה יכול לאמת נתונים, לספק פונקציונליות נוספת ולשלוט בגישה למאפיינים ופונקציות.

גלה הכל על השימושים באובייקטי פרוקסי וכיצד תוכל ליצור אותם ב-JavaScript.

יצירת אובייקט פרוקסי

ב-JavaScript, אתה יכול ליצור אובייקטי proxy באמצעות ה פרוקסיבַּנַאִי. בנאי זה לוקח שני טיעונים: א יַעַד מתנגד לעטוף את ה-proxy ו-א מטפל אובייקט שהמאפיינים שלו מגדירים את התנהגות ה-proxy בעת ביצוע פעולות.

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

לדוגמה:

const originalObject = {
 פו: "בַּר"
}
const מטפל = {
 לקבל: פוּנקצִיָה(יעד, נכס){
לַחֲזוֹר יעד[נכס];
 },
 מַעֲרֶכֶת: פוּנקצִיָה(יעד, נכס, ערך){
 target[property] = ערך;
 }
};
const proxy = חָדָשׁפרוקסי(OriginalObject, מטפל)

קוד זה יוצר אובייקט יעד, originalObject, עם נכס בודד, פו, וחפץ מטפל, מטפל. אובייקט המטפל מכיל שני מאפיינים, לקבל ו מַעֲרֶכֶת. תכונות אלו ידועות כמלכודות.

מלכודת אובייקט פרוקסי היא פונקציה הנקראת בכל פעם שאתה מבצע פעולה שצוינה על אובייקט פרוקסי. מלכודות מאפשרות ליירט ולהתאים אישית את ההתנהגות של אובייקט ה-proxy. גישה למאפיין מאובייקט ה-proxy קוראת ל- לקבל trap, ושינוי או מניפולציה של מאפיין מאובייקט ה-proxy קורא ל- מַעֲרֶכֶת מַלכּוֹדֶת.

לבסוף, הקוד יוצר אובייקט פרוקסי עם ה- פרוקסי בַּנַאִי. זה עובר originalObject ו מטפל כאובייקט המטרה וכמטפל, בהתאמה.

שימוש באובייקטי פרוקסי

לאובייקטי פרוקסי יש מספר שימושים ב-JavaScript, חלקם כדלקמן.

הוספת פונקציונליות לאובייקט

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

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

לדוגמה:

const userObject = {
 שם פרטי: "קנדי",
 שם משפחה: "מרטינס",
 גיל: 20,
};
const מטפל = {
 לקבל: פוּנקצִיָה(יעד, נכס){
לְנַחֵם.עֵץ("קבלת רכוש"${property}"`);
לַחֲזוֹר יעד[נכס];
 },
 מַעֲרֶכֶת: פוּנקצִיָה(יעד, נכס, ערך){
לְנַחֵם.עֵץ('הגדרת מאפיין'${property}" להעריך "${value}"`);
 target[property] = ערך;
 },
};
const proxy = חָדָשׁפרוקסי(userObject, מטפל);
לְנַחֵם.log (proxy.firstName); // השגת הנכס "firstName" קנדי
לְנַחֵם.log (proxy.lastName); // קבלת הנכס "שם משפחה" מרטינס
proxy.age = 23; // הגדרת מאפיין "גיל" להעריך "23"

בלוק קוד זה מוסיף פונקציונליות באמצעות מלכודות ה-proxy, לקבל ו מַעֲרֶכֶת. כעת, כאשר אתה מנסה לגשת או לשנות מאפיין של userObject, אובייקט ה-proxy ירשום תחילה את הפעולה שלך למסוף לפני גישה או שינוי של המאפיין.

אימות נתונים לפני הגדרתם על אובייקט

אתה יכול להשתמש באובייקטי proxy כדי לאמת נתונים ולהבטיח שהם עומדים בקריטריונים מסוימים לפני הגדרתם על אובייקט. אתה יכול לעשות זאת על ידי הגדרת לוגיקת האימות ב-a מַעֲרֶכֶת מלכודת ב מטפל לְהִתְנַגֵד.

לדוגמה:

const userObject = {
 שם פרטי: "קנדי",
 שם משפחה: "מרטינס",
 גיל: 20,
};
const מטפל = {
 לקבל: פוּנקצִיָה(יעד, נכס){
לְנַחֵם.עֵץ("קבלת רכוש"${property}"`);
לַחֲזוֹר יעד[נכס];
 },
 מַעֲרֶכֶת: פוּנקצִיָה(יעד, נכס, ערך){
 אם (
 תכונה "גיל" &&
סוג של ערך == "מספר" &&
 ערך > 0 &&
 ערך < 120
 ) {
לְנַחֵם.עֵץ('הגדרת מאפיין'${property}" להעריך "${value}"`);
 target[property] = ערך;
 } אַחֵר {
לזרוקחָדָשׁשְׁגִיאָה("פרמטר לא חוקי. אנא עיין ותקן.");
 }
 },
};
const proxy = חָדָשׁפרוקסי(userObject, מטפל);
proxy.age = 21;

בלוק קוד זה מוסיף כללי אימות ל- מַעֲרֶכֶת מַלכּוֹדֶת. אתה יכול להקצות כל ערך ל- גיל נכס על א userObject למשל. אבל, עם כללי האימות הנוספים, אתה יכול להקצות ערך חדש למאפיין הגיל רק אם הוא מספר, גדול מ-0 וקטן מ-120. כל ערך שאתה מנסה להגדיר ב- גיל מאפיין שאינו עומד בקריטריונים הנדרשים יפעיל שגיאה והדפס הודעת שגיאה.

שליטה בגישה למאפייני אובייקט

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

לדוגמה:

const userObject = {
 שם פרטי: "קנדי",
 שם משפחה: "מרטינס",
 גיל: 20,
 טלפון: 1234567890,
 אימייל: "[email protected]",
};
const מטפל = {
 לקבל: פוּנקצִיָה(יעד, נכס){
אם (תכונה "טלפון" || תכונה "אימייל") {
לזרוקחָדָשׁשְׁגִיאָה("הגישה למידע נדחתה");
 } אַחֵר {
לְנַחֵם.עֵץ("קבלת רכוש"${property}"`);
לַחֲזוֹר יעד[נכס];
 }
 },
 מַעֲרֶכֶת: פוּנקצִיָה(יעד, נכס, ערך){
לְנַחֵם.עֵץ('הגדרת מאפיין'${property}" להעריך "${value}"`);
 target[property] = ערך;
 },
};
const proxy = חָדָשׁפרוקסי(userObject, מטפל);
לְנַחֵם.log (proxy.firstName); // השגת הנכס "firstName" קנדי
לְנַחֵם.log (proxy.email); // זורק שגיאה

בלוק הקוד שלמעלה מוסיף הגבלות מסוימות ל- לקבל מַלכּוֹדֶת. בתחילה, תוכל לגשת לכל הנכסים הזמינים ב- userObject. הכללים שנוספו מונעים גישה למידע רגיש כמו האימייל או הטלפון של המשתמש. ניסיון לגשת לכל אחד מהמאפיינים הללו יפעיל שגיאה.

מלכודות פרוקסי אחרות

ה לקבל ו מַעֲרֶכֶת מלכודות הן הנפוצות והשימושיות ביותר, אך ישנן עוד 11 מלכודות פרוקסי של JavaScript. הם:

• להגיש מועמדות: ה להגיש מועמדות trap פועל כאשר אתה קורא לפונקציה באובייקט ה-proxy.
• לִבנוֹת: ה לִבנוֹת trap פועל כאשר אתה משתמש באופרטור החדש כדי ליצור אובייקט מאובייקט ה-proxy.
• deleteProperty: ה deleteProperty מלכודת פועלת כאשר אתה משתמש ב לִמְחוֹק אופרטור כדי להסיר מאפיין מאובייקט ה-proxy.
• יש ל - ה יש ל מלכודת פועלת כאשר אתה משתמש ב ב אופרטור כדי לבדוק אם קיים מאפיין באובייקט ה-proxy.
• ownKeys - ה ownKeys מלכודת פועלת כאשר אתה קורא לאחת Object.getOwnPropertyNames אוֹ Object.getOwnPropertySymbols פונקציה על אובייקט ה-proxy.
• getOwnPropertyDescriptor - ה getOwnPropertyDescriptor מלכודת פועלת כאשר אתה קורא ל Object.getOwnPropertyDescriptor פונקציה על אובייקט ה-proxy.
• defineProperty - ה defineProperty מלכודת פועלת כאשר אתה קורא ל Object.defineProperty פונקציה על אובייקט ה-proxy.
• למנוע הרחבות - ה למנוע הרחבות מלכודת פועלת כאשר אתה קורא ל Object.preventExtensions פונקציה על אובייקט ה-proxy.
• הוא ניתן להרחבה - ה הוא ניתן להרחבה מלכודת פועלת כאשר אתה קורא ל Object.isExtensible פונקציה על אובייקט ה-proxy.
• getPrototypeOf - ה getPrototypeOf מלכודת פועלת כאשר אתה קורא ל Object.getPrototypeOf פונקציה על אובייקט ה-proxy.
• setPrototypeOf - ה setPrototypeOf מלכודת פועלת כאשר אתה קורא ל Object.setPrototypeOf פונקציה על אובייקט ה-proxy.

כמו מַעֲרֶכֶת ו לקבל traps, אתה יכול להשתמש בפח הזה כדי להוסיף שכבות חדשות של פונקציונליות, אימות ושליטה לאובייקט שלך מבלי לשנות את המקור.

החסרונות של אובייקטי פרוקסי

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

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