JavaScriptゼミ第2回 2-2 変数とリテラル 発表者 直江宗紀
変数 変数 変数への代入 値を格納、記憶する物 Java,Cなどのような型宣言が不要 宣言なしで変数への値代入が可能 書式 「変数名 = 値 ;」 例:myVal = 5 ;
変数の宣言(1) 宣言方法 記述例 書式 「var 変数名 ;」 (var:「変数(variable)」から来ている) var myVal ; myVal = 5 ;
変数の宣言(2) 宣言のバリエーション 宣言のみの変数 複数の変数を宣言可 例:var father,mother,sister ; 値を代入してない宣言された変数 →undefined(未定義)という特殊値が入る
型の種類(1) 代表的な変数の型 数値型 文字列型 ブーリアン型 オブジェクト型 数値を表す変数(浮動小数点形式:整数との区別が無い) 任意の文字列を格納する変数(StringObject:3章で詳しく) ブーリアン型 真(true)もしくは偽(false)のどちらかの値をとるデータ型 オブジェクト型 オブジェクトのインスタンスを格納するためのデータ型
型の種類(2) プリミティブ型(PrimitiveType:基本型) リファレンス型(ReferenceType:参照型) 数値を扱う変数が分類される (整数型、ブーリアン型など) 変数には値そのものが代入される リファレンス型(ReferenceType:参照型) オブジェクトや配列など「参照する物」を対象としている変数が分類される (オブジェクト型、配列変数など) 変数にはオブジェクトの場所を示す値が代入される (ポインタ的な役割)
変数の型 JavaScriptの変数の型の特徴 変数の型にあまり厳しくない 文字列型は特殊な型 数値を入れていた変数に文字列を代入することも可 (バグの混入の危険性があるため避ける方が良い) 文字列型は特殊な型 状況によりプリミティブ型、またはリファレンス型のように 振舞うことができる 「Stringオブジェクト」の変数のためオブジェクト型としても 見れるためである
変数名の付け方 変数名の規則 予約語 予約語を使用することはできない アルファベットあるいはアンダースコア「_」から始める 2文字目以降から数字またはアルファベットの任意の文字を使用可 予約語 JavaScriptの予約語一覧 break,else,new,var,case,finally,return,void,catch,for, switch,while,continue,function,this,with,default,if, throw,delete,in,try,do,instanceof,typeof
リテラル リテラル(literal)とは スクリプト内に記述した数字、文字列などの「定数」 記述方法によってデータ型が定まる リテラルの種類 整数リテラル 浮動小数点リテラル ブーリアンリテラル 文字列リテラル a = 2 ; 右辺の「2」がリテラル
リテラルの種類(1) 整数リテラル 10進、8進、16進数の形式で記述 先頭が0から始まるー8進数 先頭が0xから始まるー16進数 数字例 013 :8進数(10進数で11) 0xff :16進数(10進数で255) 13 :10進数
リテラルの種類(2) 浮動小数点リテラル ブーリアンリテラル 小数点または指数表現により浮動小数点数を表す 例:3.14 , 1.3e3 , .3 (0.3の意味) , 1.666e-9 ブーリアンリテラル 論理値を表す 例: true (真) , false (偽)
リテラルの種類(3) 文字列リテラル null 0以上の文字列をダブルクォーテーションまたは シングルクォーテーションで囲ったもの 例: ”” (空の文字列) , “test” , ’Strings Data’ 囲う際クォーテーションは同じでないといけない ‘no data” ←エラー 改行などの特殊文字はエスケープシーケンスを使う null 何も無い状態を表す特殊値
エスケープシーケンスの種類 エスケープシーケンス 内容 \n 改行 \t タブ \b バックスペース \r キャリッジリターン \f フォームフィード(紙送り) \\ 文字「\」 \’ シングルクォーテーション \” ダブルクォーテーション \XXX 8進数で指定したASCII文字コード \xXX 16進数で指定したASCII文字コード \uXXXX Unicodeで指定した文字コード
変数を利用したスクリプト例 フォントサイズを変数で指定するスクリプト <html><head> <meta http-equiv="Content-Script-Type" content="text/javascript"> </head> <body bgcolor="#ffffff"> <script language="JavaScript" type="text/javascript"> var a=4 ; var b=6 ; document.write("<font size="+a+">") ; document.write("このフォントサイズは"+a+"ptです<br>") ; document.write("</font>") ; document.write("<br>") ; document.write("<font size=",b,">") ; document.write("このフォントサイズは",b,"ptです<br>") ; </script> </body></html>
サンプルスクリプト実行結果
練習問題 JavaScript2-2-6のサンプルプログラムを元に、横幅、縦幅を任意の数字に置き換えても横に画像4、縦に2、全部で8枚入るように改良せよ。 ただし、画像1、2の位置関係は問わない。 補足 本問題で用いるHTMLタグ<img>について 書式:<img src=“ファイル名” height=高さ width=幅> height,widthどちらも指定する数値の単位はドット
付録(1) 今回用いたHTMLタグについて Headタグ Fontタグ 書式:<head></head> ファイルの概要について記述するためのスペース Headerから来ている Fontタグ 書式:<font size=フォントのサイズ ></font> <font>~</font>の間でのみsizeで指定した文字の大きさ にする
付録(2) 今回用いたHTMLタグについて(続き) Metaタグ Brタグ 書式:<meta> スクリプト情報以外にロボット検索の可否、検索キーワードなどの情報も付与することが可能 Brタグ 書式:<br> ブラウザで表示する際に改行させるためのタグ 通常このタグがなければブラウザ上で改行がされない