שימוש באובייקטים המובנים ב- JavaScript

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

מודל האובייקט JavaScript הוא פשוט. עיקר האובייקטים הללו עוסק בתוכן חלונות - מסמכים, קישורים, טפסים וכו '. בנוסף לאובייקטים של תוכן חלון, JavaScript תומך בקומץ קטן של אובייקטים "מובנים". אובייקטים מובנים אלה זמינים ללא קשר לתוכן החלון ופועלים ללא תלות בכל העמוד שהדפדפן שלך נטען.

לימוד JavaScript

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

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

הבנת אובייקט המחרוזת

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

var myString = "This is a string";

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

var myString = new String(); myString = "This is a string";

ו

var myString = new String ("This is a string");

לאובייקטים מחרוזת יש מאפיין אחד: אורך. מאפיין האורך מחזיר את אורך המחרוזת ומשתמש בתחביר string.length,כאשר המחרוזת היא שם המשתנה המחרוזת. שתי התצוגות הבאות 16.

alert ("This is a string".length)

ו

var myString = "This is a string"; alert (myString.length);

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

עוד מ- JavaWorld

רוצה עוד חדשות ארגוניות של Java? קבל את עלון JavaWorld Enterprise Java שנשלח לתיבת הדואר הנכנס שלך.

שיטות ניהול מחרוזת כוללות substring, indexOf, lastIndexOf, ו toLowerCase. אלה משמשים להחזרת או שינוי תוכן המחרוזת בצורה כלשהי. למשל, שיטת המיתור מחזירה חלק מוגדר של מחרוזת. שיטת indexOf קובעת את המיקום של תו או קבוצת תווים במחרוזת. ושיטת toLowerCase ממירה את המחרוזת לאותיות קטנות. (כפי שאתה יכול לדמיין, יש גם toUpperCaseשיטה).

שיטות פורמט טקסט משמשות לעיצוב טקסט במסמך בצורה מיוחדת כלשהי, והן מסופקות כחלופות לשימוש בתגי HTML לאותה מטרה. שיטות אלה כוללות גדול, קטן, sup, תת, עוגן, קישור וממצמץ.

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

var tempVar = "this text is now upper case".toUpperCase();

אוֹ

var myString = "this text is now upper case"; var tempVar = myString.toUpperCase();

ב- Netscape 2.0 יש רק אובייקט מחרוזת אחד, וכל המחרוזות נוצרות ממנו. לעומת זאת, מיתרים הם אובייקטים מהשורה הראשונה באטלס, וכל מחרוזת חדשה מטופלת כאובייקט נפרד. ההתנהגות של אובייקט יחיד של מיתרים ב- Netscape 2.0 עלולה לגרום לתופעות לוואי מעודנות. קח את קטע התסריט הקצר שאחריו. נוצרים שני מיתרים: string1ו string2. מאפיין חדש (הנקרא extra) מוקצה למחרוזת 1. עם זאת, הודעת ההתראה מראה כי המאפיין שייך כעת גם למחרוזת 2.

 string1 = "this is string 1" string2 = "this is string 2" string1.extra = "new property" alert (string2.extra) 

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

דוגמה קלאסית לבעיה זו ניתן לראות ב"גלילי ההודעות "של JavaScript, שם הודעה גוללת בשורת המצב או בתיבת טקסט. עבור כל מעבר, הגלילה מגדירה מחדש את משתנה המחרוזת המוצג. בסופו של דבר הזיכרון מתרוקן מכיוון ש- JavaScript יוצר מופעים חדשים של המחרוזת עם כל מעבר. לדוגמה, הסקריפט הבא יגרום בסופו של דבר (מוקדם יותר בפלטפורמות מסוימות, כגון Windows 3.1) לשגיאת "זיכרון":

 var count = 0; var text = "This is a test of a JavaScript scroller. "; scroll(); function scroll () { var myString = text.substring (count, text.length) + text.substring (0, count) window.status = myString if (count < text.length) count ++; else count = 0; setTimeout ("scroll()", 333); // 333ms is the minimum delay for Netscape 2.0 } 

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

window.status = text.substring (count, text.length) + text.substring (0, Count)

(בעוד שהגישה לעיל נמנעת מבעיית שכפול אובייקטים של מחרוזת-אובייקט של JavaScript, דליפות זיכרון עדיין מתרחשות בגלל השימוש ב- setTimeout method. לאורך איטרציות רבות - בדרך כלל כמה אלפי ומעלה - setTimeout יגזול את כל הזיכרון הזמין, ובסופו של דבר JavaScript יציג " הודעת הזיכרון ").

לעיונך, להלן השיטות והמאפיינים המשמשים עם אובייקט המחרוזת של JavaScript:

מאפייני מחרוזת

אורך אורכו של חוט

שיטות מיתרים

לְעַגֵן יוצר עוגן בשם (יעד היפרטקסט)
גָדוֹל מגדיר טקסט כגדול
לְמַצְמֵץ מגדיר טקסט למצמץ
נוֹעָז מגדיר טקסט מודגש
charAt מחזירה את התו במיקום מוגדר
תוקן מגדיר טקסט בגופן המגרש הקבוע
צבע גופן מגדיר את צבע הגופן
גודל גופן מגדיר את גודל הגופן
אינדקס של מחזירה את המופע הראשון של תו x החל ממצב y
אוֹתִיוֹת מוּטוֹת מגדיר טקסט נטוי
lastIndexOf Returns the last occurrence of character x starting from position y
link Creates a hyperlink
small Sets text to small
strike Sets text to strikeout
sub Sets text to subscript
substring Returns a portion of a string
sup Sets text to superscript
toLowerString Converts a string to lowercase
toUpperString Converts a string to uppercase

Using JavaScript as a scientific calculator

JavaScript's Math object provides advanced arithmetic and trigonometric functions, expanding on JavaScript's basic arithmetic operators (plus, minus, multiply, divide). The Math object in JavaScript is borrowed from Java. In fact, the implementation of the Math object in JavaScript closely parallels the Math class in Java, except that the JavaScript Math object offers fewer methods.

JavaScript's Math object properties are treated as constants. In fact, the property names are in all upper-case, following the usual convention of capitalizing variable constants. These properties return often-used values, including pi and the square root of 2. The Math methods are used in mathematical and trigonometric calculations. Handy Math-object methods include ceil, floor, pow, exp (exponent), max, min, round, and random. (Random is only available when using the X Window platform, however.)

The Math object is static, so you don't need to create a new Math object in order to use it. To access the properties and method of the Math object, you merely specify the Math object, along with the method or property you wish. For example, to return the value of pi, you use:

var pi = Math.PI;

Similarly, to use a math method you provide the name of the method, along with the parameters you wish to use. For example, to round the value of pi, you'd use:

var pi = Math.PI; var pieAreRound = Math.round(pi); // displays 3

Note that you must specify the Math object by name for each Math method/property you wish to use. JavaScript does not recognize the keywords PI and round all by themselves. Exception: you may use the with statement to associate the names of methods and properties with the Math object. This technique is a handy space-saver when you must use several Math properties and methods. The previous example can be written as

with (Math) { var pi = PI; var pieAreRound = round(pi); alert (pieAreRound) }

For your reference, here are the properties and methods supported by JavaScript's Math object.

Math Properties

E Euler's constant
LN2 The natural logarithm of 2
LN10 The natural logarithm of 10
LOG2E The base 2 logarithm of e
LOG10E The base 10 logarithm of e
PI The numeric equivalent of PI: 3.14 etc.
SQRT1_2 The square root of one-half
SQRT2 The square root of 2

Math Methods

abs Returns the absolute value of a number
acos Returns the arc cosine of a number
asin Returns the arc sine of a number
atan Returns the arc tangent of a number
ceil Returns the least integer greater than or equal to a number
cos Returns the cosine of a number
exp Returns e (Euler's constant) to the power of a number
floor Returns the greatest integer less than or equal to its argument
log Returns the natural logarithm (base e) of a number
max Returns the greater of two values
min Returns the lesser of two values
pow Returns the value of a number times a specified power
random Returns a random number (X-platforms only)
round Returns a number rounded to the nearest whole value
sin Returns the sine of a number
sqrt Returns the square root of a number
tan Returns the tangent of a number

Asking JavaScript for a date

Also borrowed by Java is the Date object, which can be used in JavaScript to determine the current time and date. A popular JavaScript application of the Date object is displaying a digital clock in a text box. The script uses the Date object to update the clock once every second. You also use the Date object to perform date math. For example, your script might determine the number of days between now and a certain future date. You can use this to display a "countdown," such as the number of days left of your company's big sale.

JavaScript treats the Date object like a constructor class. To use Date you must create a new Date object; you can then apply the various Date methods to get and set dates. (The Date object has no properties.) If you're familiar with the Date class in Java, you'll find the properties of the JavaScript Date object largely the same. The most commonly used methods are the get methods, which obtain the time and date of the value in the Date object. These methods are:

  • getHours() - Returns the hour
  • getMinutes() - Returns the minutes
  • getSeconds() - Returns the seconds
  • getYear() - Returns the year ("96" is 1996)
  • getMonth() - Returns the month ("0" is January)
  • getDate() - Returns the day of the month
  • getDay() - Returns the day of the week ("0" is Sunday)

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

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

var date_obj = new Date();

לחלופין, תוכל לציין תאריך ושעה נתון כחלק מבנאי התאריכים. אחת משיטות אלה מותרת - שתיהן קובעות את אובייקט התאריך החדש ל -1 בינואר 1997, בחצות שעון מקומי.

var date_obj = new Date ("January 1 1997 00:00:00")

ו

var date_obj = new Date (97, 0, 1, 12, 0, 0)

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

var now = new Date(); var yearNow = now.getYear();

לעיונך, להלן השיטות הנתמכות על ידי אובייקט התאריך של JavaScript.