第６回 JavaScript ゼミ セクション３－６ 発表者 直江 宗紀

組み込み関数  JavaScript に予め用意された関数  特定のオブジェクトに依存していない  単に関数名で呼び出すことが可能

eval() 関数 eval() 関数とは  文字列で書かれた式を引数とし評価する  返り値はその式を計算した数値  書式： eval( string )string: 文字列の式 使用例 var result ; result = eval(“2 * 5 + 1”) ; document.write(“result = ”+result) ; >result = 11

eval() 関数の特徴 利用可能な事項  変数に代入した文字列として書いた式も引数 test=“5+2” ; result=eval(test) ;// result には７が代入される  文字列中に変数、メソッドが入れられる a=2 ; result=eval(“Math.cos(Math.PI)+a”) ; // result には１が代入される (-1+2 の計算 )  戻り値、内容が数字以外の物は利用不可

応用プログラム例 function disp(num){ document.calc.display.value += num ; } function calculate(){ document.calc.display.value=eval(document.calc.display.value) ; } 簡易電卓 - 中略 - ( プログラム全一覧は付録１に添付 )

応用プログラム結果

parseInt() 関数 parseInt() 関数とは  引数として文字列の数字を整数へ変換する  書式： parseInt( string, [ radix ] ) 引数： string - 数値に変換する文字列 radix - 基数  戻り値として整数値

parseInt() 関数（２） 他の進数も扱える  ２進数  ８進数  １６進数 途中変換できない文字があれば 無視される parseInt(“3AA”) → ２文字目以降無視 先頭文字が数値以外  NaN を返す parseInt(“aa”) → NaN を返す 式結果 parseInt(“2”)2 parseInt(“A”,16)10 parseInt(“1100”,2)12 parseInt(“0x11”)17 parseInt(“011”)9 表 parseInt() 関数の実行例

parseFloat() 関数 parseFloart() 関数とは  数値の文字列を浮動小数点数値に変換  指数表記の物も変換可 (1.4e3,1.4*10^3 など )  書式： parseFloat( string ) 引数： string – 数値に変換する文字列  戻り値として浮動小数点数値

parseFloat() 関数（２） 途中変換できない文字があれば 無視される parseFloat(“4.34AAA”) → 後ろの文字を無視 先頭文字が数値以外  NaN を返す parseFloat(“A1”) → NaN を返す 式結果 parseFloat(“3.14”)3.14 parseFloat(“4.34AAA”)4.34 parseFloat(“1.3e3”)1300 parseFloat(“1.2e-3”) parseFloat(“A1”)NaN 表 parseFloat() 関数の実行例

非数であるか調べる isNaN() 関数とは  引数に与えた値が NaN( 非数 ) か調べる NaN – Not a Number の略  書式： isNaN( testValue ) 引数： testValue – 調べる値 戻り値： true または false

エンコード、デコード Ｗｅｂでは  半角英数字のみしか扱えない場合が多い ASCII キャラクタと呼ばれる７ビット表現文字列  ＵＲＬなどにスペース、日本語の複数バイト文字 を 含めることは不可 最近対応できる技術が出てきてるが、それは例外とする  ＵＲＬで複数バイト文字を使う場合 → 使用可能な文字列へ変換 ( エンコード ) する必要

escape() 関数,unescape() 関数 エンコード、デコードを行う関数  escape() 関数 書式： escape( string ) 引数： string – エンコードする文字列 戻り値：エンコードされた文字列  unescape() 関数 書式： unescape( string ) 引数： string – デコードする文字列 戻り値：デコードされた文字列

エンコード、デコードプログラム 例 function decode(form){ var myString = unescape(form.encodeTxt.value) ; document.myform.decodeTxt.value = myString ; } function encode(form){ var myString = escape(form.decodeTxt.value) ; document.myForm.encodeTxt.value = myString ; } [ 元の文字列 ] [ エンコードされた文字列 ] （プログラム全一覧は付録２に添付）

プログラム結果

エンコード、デコード（２） escape(),unescape() の出力  Ｗｅｂブラウザのバージョンによって違う  古い → ＵＲＬエンコード形式出力  新しい → ユニコード表記出力の物も  しかし、ＵＲＬではＵＲＬエンコード形式のみ有 効 → バージョン問わずＵＲＬエンコード形式欲し い

エンコード、デコードの関数 ＵＲＬエンコード形式出力の関数  エンコード関数 encodeURI() encodeURIConponent()  デコード関数 decodeURI() decodeURIConponent()  引数はエンコード、デコードしたい文字列

関数の動作の違い エンコード、デコードそれぞれ２つの関数  “Conpoment” が付いてるついてないの違い 付いてない → 予約文字はエンコード ( デコード ) しない 付いてる → 予約文字もエンコード ( デコード ) する 予約文字とは  正規表現などで用いるメタキャラクタのこと  種類 「, 」 「 / 」 「 ? 」 「 : 」 「 ; 」 」 「 & 」 「 = 」 「 + 」 「 $ 」 等

実例プログラム プログラム全一覧は付録２～４に添付 次ページ結果図のウィンドウについて  左から順に escape(),unescape() 利用結果 encodeURI(),decodeURI() 利用結果 encodeURIComponent(), decodeURIComponent () 利用結果

エンコード、デコード実例

練習問題 1. プログラム例「簡易電卓」を元に、式中に 戻り値が数値のメソッドを利用しても計算 が行われることを確認せよ。また、三角関 数及び対数計算も簡単に行えるように改良 した、簡易関数電卓も作成せよ。 2. input タグまたは textarea タグにより入力さ れた文字列を検索サイトに送り検索せるプ ログラムを作成せよ。 （補足）「 」の後にエンコード文字列 を入れ、 window.open() 関数の引数に渡すと良い