האם פעם שאלתם את עצמכם, איך לעזאזל אני עולה עוד רמה ב js ומשתמש ב oop, איך בכלל כותבים oop ואיך זה אמור להיראות? במדריך זה אנו נלמד כיצד לכתוב js ב oop ומה זה json
לפני שנתחיל,
בואו נראה, איך אנו יוצרים אובייקט?
עד עכשיו וודאי עשיתם זאת כך:
var x = new Object();
אך לא עוד, מהיום נעשה כך:var x = {};
יותר קל, נכון?מה עם מערכים?
עד היום, וודאי עשיתם מערך כך:
var x = new Array();
אך גם את זה לא נעשה בצורה הזאת, אלא כך:var x = [];
אוקיי,אז עכשיו אנחנו יודעים איך ליצור אובייקט ומערך בצורה קצרה יותר, נו ו..?
אז זהו, שבקודים גדולים זה יעזור לכם מאוד.
קיימות שלוש דרכים מקובלות להשתמש באובייקטים:
הראשונה, היא באמצעות פונקציה, ולאחר מכן הגדרתה כאובייקט:
function man() {
this.legs = 2;
this.hands = 2;
this.name = "Idan";
}
מה עשינו פה?this.legs = 2;
this.hands = 2;
this.name = "Idan";
}
הגדרנו פונקציה בשם man, עם שלושה מאפיינים: legs, hands ו name.
אך זה לא אובייקט, עדיין לא.
עכשיו נהפוך אותו לאובייקט:
var OurMan = new man();
עכשיו OurMan היא האובייקט man.עכשיו נוכל להשיג את המאפיינים של האובייקט:
var OurMan = new man();
alert(OurMan.name);
יכתוב לנו Idan.alert(OurMan.name);
אפשר לעשות את אותו הדבר עם hands וגם עם legs.
הדרך השניה,
גם היא באמצעות פונקציה, אך הגדרת המשתנה שיכיל אותה מתבצעת באופן מיידי,
דוגמא:
var OurMan = new function () {
this.legs = 2;
this.hands = 2;
this.name = "Idan";
}
שימו לב, פה הגדרנו את המשתנה OurMan כאובייקט (new או אובייקט חדש), אחר כך הכנסנו מאפינים באותה השיטה שהשתמשנו בה מקודם.this.legs = 2;
this.hands = 2;
this.name = "Idan";
}
שליפת המאפיינים זהה, רק שהפעם אין צורך להכניס את OurMan למשתנה ולהגדיר כאובייקט כמו מקודם,
כי הוא כבר אובייקט.
פשוט נשלוף את המאפיינים:
alert(OurMan.name);
פשוט וקל, יכתוב Idan.השיטה השלישית, החכמה, המקצועית והמועדפת עליי ביותר, היא בעזרת JSON.
אין מה להבהל, זה פשוט וידידותי מאוד!
var OurMan = {
legs : 2,
hands : 2,
name : "Idan"
};
כמו שאמרתי, מאוד פשוט.legs : 2,
hands : 2,
name : "Idan"
};
יצרנו את המשתנה OutMan, ואז, כמו שאמרתי בתחילת המדריך, יצרנו אובייקט בעזרת הסוגריים המסולסלות.
את המאפיינים אנו יוצרים בדרך מאוד קלה, שם המאפיין, נקודותיים וערכו.
מפרידים בין המאפיינים באמצעות פסיק.
שליפת המאפיינים, שוב, פשוטה:
alert(OurMan.name);
יכתוב Idan.שילוב של מערכים באובייקט שלנו
זוכרים שהראנו איך יוצרים מערך בדרך פשוטה ונכונה?
זה לא היה לשווא.
אם לאדם שלנו יש שתי שמות? שם פרטי וכינוי, מה עושים?
אפשר להוסיף מאפיין נוסף, אבל אפשר גם להשתמש במערך:
var OurMan = {
legs : 2,
hands : 2,
name : [
"Idan", "Dani"
]
};
עכשיו, לאובייקט שלנו יש שני שמות.legs : 2,
hands : 2,
name : [
"Idan", "Dani"
]
};
אם נרצה לשלוף אחד מהם, ניגש צעד אחר צעד אל המערך ונשלוף את מספר המפתח ([0], [1] וכו') שנרצה להציג.
alert(OurMan.name[1]);
יכתוב Dani.מה שעשינו, זה הגענו למאפיין name באובייקט OurMan כפי שלמדנו, ובחור במספר המפתח שרצינו להציג.
אובייקט בתוך מאפיין, אפשרי?
אם תקחו את הנושא לעומק ותשתמשו בו, אתם תראו שאתם תגיעו למצב שתצטרכו להשתמש גם במאפיינים כאובייקטים.
זה מאוד פשוט.
נגיד שאנחנו רוצים ליצור אובייקט בשם OurMan, בתוכו שני מאפיינים, name ו-hobby.
בתוך name אנחנו רוצים עוד שני מאפיינים, firstname ו-lastname.
בתוך firstname, נרצה מערך שיכיל את השם הפרטי ואת הכינוי.
הביטו בזה:
var OurMan = {
name : {
firstname : [
"Idan", "Dani"
],
lastname : "Yadgar"
},
hobby : [
"football", "friends"
]
}
נראה מסובך? לא ממש, נכון?name : {
firstname : [
"Idan", "Dani"
],
lastname : "Yadgar"
},
hobby : [
"football", "friends"
]
}
בואו ננסה לשלוף את Dani.
נצטרך להכנס ל OurMan, משם ל name, משם ל firstname ולבחור במפתח מספר 1:
alert(OurMan.name.firstname[1]);
יציג Dani.מקווה שלמדתם משהו,
בהצלחה בהמשך, ואל תשכחו javascript היא הכי אחי! ;)
בברכה רבה,
עידן ידגר.
תגובות לכתבה:
עדיף לעבוד בשיטה שתכמיס את המשתנים של האובייקט ותאפשר לך ליצור אובייקטים מבלי
לחזור על קוד . לדוגמא:
function Man(name){
//private variable
var manName = name;
//private method
var somePrivateMethod = function(){
return 'the man name is '+ manName;
}
//this is the api your want the user will use
return {
getName: function(){
return somePrivateMethod();
},
setName: function(newName){
manName = newName;
}
};
}
var man1 = Man("alex"); //first object
var man2 = Man("david"); //another object
console.log(man1.getName()); //the man name is alex
man1.setName("mosh");
console.log(man1.getName()); //the man name is mosh
man1.manName ;//error.private variable
יש פה בלאגן עם כימוס והורשה...
לדעתי לא יעיל בכלל לפרויקטים גדולים יצור בלאגן..
אם להרחיב בנושא ירושה וכל מה שסביב ,אני ישמח. תודה!