מאת: ניקיטה קורטין מרצה לפיתוח אפליקציות ובניית אתרים ב- http://www.hackeru.co.il/ המרכז להכשרת והשמת עובדים למקצועות ההייטק.
הקיץ בישראל חם, והיום חם במיוחד ולא רק בגלל 35 מעלות חום בתל אביב, אלא במיוחד בגלל השדרוג המשמעותי שקורה ברגעים האלה בעולם הפיתוח Web.
למי שלא יודע על מה אני מדבר, קצת רקע:
– Javascript JS
היא שפת צד לקוח מספר 1 בעולם באופן מוחלט, לצורך העניין נכון להיום משתמשים בה לתכנות צד שרת 89.7% מסה"כ האתרים בעולם (נתון די מטורף בעצמו) ואם נעשה זום אין אל 1000 האתרים החזקים ביותר (Facebook, Google, YouTube, eBayוכו') , נגלה שהאחוז המגוחך הזה הופך לעוד יותר מגוחך ועולה לכמעט 97%!!!
סטנדרט של שפה זו הוא ECMAScript ובדיוק לאחרונה יצאה גירסה חדשה שלו, שהיא גירסה שישית שנקראת באופן רשמי 2015 ECMAScriptאו ECMAScript 6.
עם כל שדרוג גדול שהיה ל – JavaScript, התקבלו כלים חדשים שעוזרים לכתוב מערכות חישוב מורכבות, סליידרים קטנים, משחקונים ועוד.
אז למה זה כל כך חשוב ומשמעותי? ובכן אם העיסוק שלכם קשור לעולם ה- Web, כנראה שזה הולך להשפיע על עבודתכם בקרוב, לכן כדאי להמשיך להתעדכן נוסף לכך, אם ניקח בחשבון שממש לא מזמן מפתחי הדפדפן הפופולרי של Google Chromeהתחילו בתהליך של הפסקת תמיכה באופן רשמיבפלאגינים (מגירסא 42, היום
כבר גירסה 43)NPAPI-DEPRECATIONשיאפשרו פיתוח תוספים עם טכנולוגיות כגוןJava applet
לכן אני ממליץ בחום לכל מתכנת למצוא את הזמן ולעבור על הכלים הזמינים ב- Web, במיוחד אלה החדשים שהתקבלו עם הגירסא החדשה, אם לפני זה קראנו עליהם כטכנולוגיות ניסוי ומועמדים להפצה ולא ידענו בוודאות מה כן יופץ באופן רשמי ומה לא – אז מהיום אנו יודעים מה נכנס לריליז הרשמי ומה לא.
סקירה על חלק מהטכנולוגיות שהתווספו:
חשוב לציין – שימוש בחלק ניכר מסינטקס הבא זמין ב- Strict mode בלבד!
בתחום תכנות מונחה עצמים – מבנה מחלקות וירושה הרבה יותר מסודר וקריא Class definition ECMA 6
. הגדרת מחלקה חדשה:
class Animal{}
ירושה – מחלקה המרחיבה מחלקה אחרת:2
class Cat extends Animal{}
3. בנאי:
class Animal {
constructor(){
console.log(“Animal created”);
}
}
4. מתודות – מתודת מופע, מתודת מחלקה (סטטית):
class Animal {
makeNoise(){
console.log(“animal says);
}
static addAnimal(){
if(!Animal.count)Animal.count=0;//if class variable count isn’t exists – create & set to 0
Animal.count++;//total animals counter
}
}
5. בניית ארכיטקטורה:
class Animal{
constructor(){
this.name="incognito";
Animal.addOne();
}
//method declarations
makeNoise(){
console.log("animal says …");
}
static addOne(){
if(!Animal.count)Animal.count=0;
Animal.count++;
}
}
class Cat extends Animal{
constructor(){
super();//call super class’s constructor
this.name="Hatul";
}
//override super's method
makeNoise(){
super.makeNoise();//call super(Animal) method
console.log("Meawoo");
}
}
//testing:
var c=new Cat();
c.makeNoise();
console.debug(“Total animals counter: ”+Animal.count);
****קוד זה נבדק בדפדפן 43 Google Chrome ****
1. בתחום ניהול נתונים מילים: let & const
Let משמש להגדרת משתנה הניתן לקריאה וכתיבה בסקופ של הבלוק שבו מוגדר.
const משמש להגדרת קבוע (אוגר שערך שלו לא ניתן לשינוי אחרי איתחול).
דוגמא בקוד:
//let & const VS var
function containers(){
"use strict";
var a=0;
let b=888;
const c = 999;
for(;a<2;a++){
let d=1212;
const e=3232;
}
//read
console.log(a);//yes
console.log(b);//yes
console.log(c);//yes
console.log(d);//no
console.log(e);//no
//write
a=0;//yes
b=0;//yes
c=0;//no
d=0;//no
e=0;//no
} containers();
for of (loop) 2. לולאת:
לולאה מובנת לביצוע איטרציות שעוזרת לרוץ על אוסף כלשהו, להלן דוגמא בקוד:
var someArrr=[1,2,3,4];
for (var v1 of someArrr) console.log(v1);//prints to console’s log all values from array
SET.3
אובייקט זה הינו כלי אחסון ערכים ייחודיים, כלומר אינו מאחסן נתונים משוכפלים. לפי כך הוא מתאים ביותר לאחסון מפתחות, מצביעים וכו' להלן דוגמא בקוד:
var mySet = new Set();
mySet.add(3);
mySet.add(2);
mySet.add(5);
mySet.add(3);//repeated value
console.log(mySet);
for (var item of mySet){//iterate over set with for-of loop
console.log(item);
}
console.log("the size is: "+mySet.size); // prints 3
mySet.delete(5); // removes 5 from the set
if(mySet.has(3)){// .has() returns true
console.log("has value of 3");
}
4. Typed Array
אובייקט ליצירת מערכים מוגדרים לטיפוס ובגודל תחום מוגבל, להבדיל ממערך ב- JavaSript שגמיש בגודל ולא רגיש לטיפוסים במערך זה ניתן להגדיר את הגודל והטיפוס בעת יצירה
להלן דוגמא בקוד בשימוש Int32Array :
var myInts= new Int32Array(2);//instantiate Int32Array class & allocate memory for 2 cells
myInts[0] = 42;
console.log(myInts[0]); //prints 42
console.log(myInts.length); // prints 2
console.log(myInts);//[42,0] note that second value myInts[1] is 0 because default Int value is 0
myInts[1]=10;
myInts[1]="blabla";//ignored because array type fixed to int
myInts[1]=true;//converted to numeric 1
myInts[1]="33";//converted to numeric 33
myInts[2]=11;//ignored because array limited to 2 cells
console.log(myInts);//prints [42,33]
console.log(myInts.BYTES_PER_ELEMENT);// prints 4, because 32bit is 4 bytes
console.log(myInts.byteLength);//prints 8, because 2 cells * 4 bytes = 8 bytes in total
MAP .5
אובייקט מפה, הינו כלי אחסון מיוחד הממפה את המפתחות אל הערכים. כלומר הינו אוסף של נתונים הבנוים מזוגות של מפתח וערכו. המפה אינה יכולה להכיל מפתחות משוכפלים, ולכן כל מפתח מקושר לערך אחד בלבד.
var myMap = new Map();
myMap.set("Bubu", 95);//add value of 95 for key “Bubu”
myMap.set("Groot", 70);
console.log(myMap.get("Groot"));//reading value
console.log(myMap.size);//prints 2
if(myMap.has("Groot")){
console.log("myMap has data with key Groot ");
}
//iterate values
for(var v of myMap.values())console.log(v);
//iterate keys
for(var k of myMap.keys())console.log(k);
//each entry is array where first value is a key and second is value[key,value]
for (var entry of myMap) console.log(entry[0]+” has : ”+entry[1]);
myMap.delete(“Groot”);//delete by key
myMap.clear();//delete all in map
