JavaScriptの組み込みオブジェクトの使用

JavaScriptは、言語の柔軟性を拡張する多数の組み込みオブジェクトを備えています。これらのオブジェクトは、Date、Math、String、Array、およびObjectです。これらのオブジェクトのいくつかはJava言語仕様から「借用」されていますが、JavaScriptによるそれらの実装は異なります。Javaに精通している場合は、混乱を避けるために、JavaScriptの組み込みオブジェクトタイプを注意深く調べることをお勧めします。

JavaScriptオブジェクトモデルは単純なものです。これらのオブジェクトの大部分は、ウィンドウコンテンツ(ドキュメント、リンク、フォームなど)を処理します。JavaScriptは、ウィンドウコンテンツオブジェクトに加えて、少数の「組み込み」オブジェクトをサポートしています。これらの組み込みオブジェクトは、ウィンドウのコンテンツに関係なく使用でき、ブラウザがロードしたページとは関係なく動作します。

JavaScriptを学ぶ

この記事は、JavaWorldテクニカルコンテンツアーカイブの一部です。JavaScriptシリーズの記事を読むことで、JavaScriptプログラミングについて多くを学ぶことができますが、一部の情報は古くなっている可能性があることに注意してください。JavaScriptを使用したプログラミングの詳細については、「JavaScriptとフォームの使用」および「JavaScriptプログラムのデバッグ」を参照してください。

組み込みオブジェクトは、Date、Math、String、Array、およびObjectです。それぞれが独自の、一貫性のない方法で使用されます。さらに、新しいバージョンのJavaScript(現在ベータ版のNetscape "Atlas"にあります)は、Netscape2.0とは異なる方法でこれらのオブジェクトのいくつかを実装します。このコラムでは、これらの組み込みオブジェクトとその使用方法について説明します。また、これらのオブジェクトをJavaScriptページに適用するときに発生する癖をメモしておきます。

文字列オブジェクトを理解する

すべてのJavaScriptのオブジェクトの中で、Stringオブジェクトが最も一般的に使用されます。Netscape 2.0 JavaScriptの実装では、変数の割り当てを使用して新しい文字列オブジェクトが暗黙的に作成されます。例えば、

var myString = "This is a string";

呼ばれる指定したテキストと、文字列を作成し、myString.ネットスケープ2.0では、そこに文字列と呼ばれる実際のオブジェクトはなく、文字列(または列)として、誤って新しい文の結果を使用して、新しいStringオブジェクトをインスタンス化しようとすると、定義されたキーワードではありません。ただし、NetscapeのAtlasバージョンでは、Stringは真正なオブジェクトであり、Stringキーワードを使用して新しい文字列を作成できます。次の2つのアプローチは、Atlasでは許可されていますが、Netscape2.0では許可されていません。

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

そして

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

文字列オブジェクトには、長さという1つのプロパティがあります。lengthプロパティは文字列の長さを返し、string.length,stringが文字列変数の名前である構文を使用します。次の両方が表示されます16。

alert ("This is a string".length)

そして

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

文字列プロパティは1つしかない場合もありますが、JavaScriptは文字列で使用できる多数のメソッドをサポートしています。これらの方法は、文字列管理とテキスト形式の2つの大きなキャンプに大別できます。

JavaWorldのその他のアイテム

もっとJavaエンタープライズニュースが欲しいですか?JavaWorld EnterpriseJavaニュースレターを受信トレイに配信します。

文字列の管理方法としてはsubstringindexOflastIndexOf、とtoLowerCase。これらは、何らかの方法で文字列の内容を返したり変更したりするために使用されます。たとえば、部分文字列メソッドは、文字列の指定された部分を返します。indexOfメソッドは、文字列内の文字または文字のグループの場所を決定します。そして、toLowerCaseメソッドは文字列を小文字に変換します。(ご想像のとおり、toUpperCase方法もあります。)

テキストフォーマットメソッドは、ドキュメント内のテキストを特別な方法でフォーマットするために使用され、同じ目的でHTMLタグを使用する代わりに提供されます。これらのメソッドには、big、small、sup、sub、anchor、link、blinkが含まれます。

文字列メソッドは、文字列に対して直接使用することも、文字列を含む変数に対して使用することもできます。メソッドがパラメーターを使用しない場合でも、メソッドは常に開き括弧と閉じ括弧を使用します。たとえば、テキストを大文字に変換するには、次のいずれかを使用します。

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

または

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

Netscape 2.0では、Stringオブジェクトは1つだけであり、すべての文字列はそこから作成されます。逆に、文字列はAtlasのファーストクラスのオブジェクトであり、新しい文字列はそれぞれ個別のオブジェクトとして扱われます。 Netscape 2.0での文字列の単一オブジェクトの動作は、いくつかの微妙な副作用を引き起こす可能性があります。次の短いスクリプトセグメントを見てください。 2つの文字列が作成されます:string1string2。新しいプロパティ(extraと呼ばれる)がstring1に割り当てられます。ただし、アラートメッセージは、プロパティもstring2に属していることを示しています。

 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 指定された位置にある文字を返します
修繕 固定ピッチフォントでテキストを設定します
fontcolor フォントの色を設定します
フォントサイズ フォントサイズを設定します
の指標 位置yから始まる文字xの最初の出現を返します
イタリック テキストを斜体に設定します
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オブジェクトの日時を設定することもできますが、これらはめったに使用されません。)

新しいDateオブジェクトの作成には、いくつかの形式があります。現在の日付と時刻を含むオブジェクトを返すには、パラメーターなしでDateオブジェクトを使用します。以下date_objは、コンピュータのシステムクロックによって設定された、現在の日付と時刻の値を含む新しいオブジェクトです。

var date_obj = new Date();

または、日付コンストラクターの一部として特定の日付と時刻を指定することもできます。これらのメソッドのいずれかが許可されます。どちらも、新しい日付オブジェクトを現地時間の深夜0時に1997年1月1日に設定します。

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

そして

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

Dateメソッドを使用するには、以前に作成した日付オブジェクトにメソッドを追加します。たとえば、現在の年を返すには、次を使用します。

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

参考までに、JavaScriptのDateオブジェクトでサポートされているメソッドを次に示します。