JavaScript Functions & Objects

JavaScript Functions & Objects

JavaScript Global Functions

encodeURI(), decodeURI() http://www.google.com.tw/search?q=暨南大學http://www.google.com.tw/search?q=%E6%9A%A8%E5%8D%97%E5%A4%A7%E5%AD%B8http://www.google.com.tw/search?q=暨南大學 var uUri = "http://www.google.com.tw/search?q=暨南大學"; var eUri = encodeURI(uUri); document.write(uUri + "<br />"); document.write(eUri + "<br />"); document.write(decodeURI(eUri) + "<br />");

isNaN() <head> <script type="text/javascript"> window.onload = function() { document.getElementById(ageBtn).onclick=chkAge; }; function chkAge() { var age = document.getElementById(age).value; if (isNaN(age)) { alert("年齡輸入錯誤!"); // ... } } </script> </head> <body> <form …> Age: <input type="text" id="age" /> <input type="button" id="ageBtn" value="Check"/> <br/> </form> </body> http://ycchen.im.ncnu.edu.tw/www2011/lab/isNaN.html

JavaScript Objects Boolean Number String Array Math Date RegExp

Boolean Object • Create Boolean objects with an initial value of false: var myBoolean=new Boolean(); var myBoolean=new Boolean(0); var myBoolean=new Boolean(null); var myBoolean=new Boolean(""); var myBoolean=new Boolean(false); var myBoolean=new Boolean(NaN); • Create Boolean objects with an initial value of true: var myBoolean=new Boolean(1); var myBoolean=new Boolean(true); var myBoolean=new Boolean("true"); var myBoolean=new Boolean("false");  var myBoolean=new Boolean("Richard");

Number Object var num = 5000; var n2E = num.toExponential(2); //5.00e+3var numObj = 6000;var o2E= numObj.toExponential(1);//6.0e+3var num2 = 3.456;var n2F = num2.toFixed(1); //3.5var n2P = num2.toPrecision(3); //3.46 varmyNum=new Number(86); • Properties: • MAX_VALUE, MIN_VALUE, NaN, NEGATIVE_INFINITY, POSITIVE_INFINITY • Methods: • toExponential(num) • toFixed(num) • toPrecision(num) • toString( )

String Object var myStr=new String("Hello World!"); • Properties: length • Methods: charAt(index), charCodeAt(index), concat(stringX, stringX,..., stringX) fromCharCode(numX, numX,..., numX) indexOf(searchvalue, fromindex), lastIndexOf(searchvalue, fromindex) match(searchvalue), search(searchvalue) replace(findstring, newstring) toLowerCase( ), toUpperCase( ) slice(start, end), substr(start, length), substring(start, stop) split(separator, howmany)

indexOf() var email ="ycchen@ncnu.edu.tw"; posAt = email.indexOf("@"); if (posAt == -1) alert("Wrong E-mail!"); else { user = email.substring(0, posAt); serv = email.substring(posAt+1, email.length); alert("User name: "+user+"\nMail Server: "+serv); } http://ycchen.im.ncnu.edu.tw/www2011/lab/indexOf.html

slice( ) vs. substring( ) index  (length-index)  str = "Hello happy world!" 012345678901234567 876543210987654321str.slice(6,13)  "happy w"str.substring(6,13)  "happy w"str.slice(6)  "happy world!"str.substring(6)  "happy world!"str.slice(13, 6)  ""str.substring(13,6) "happy w"str.slice(-16, 8)  "llo ha"str.substring(-16,8)  "Hello ha"

split(separator, howmany) var str1 = "JavaScript, CSS, XML, Dynamic HTML"; var arr1 = str1.split(", "); arr1[0] arr1[1] arr1[2] arr1[3] JavaScript CSS XML Dynamic HTML var str2 = 'Content-type: multipart/mixed; boundary="----xxyy"'; var arr2 = str2.split(": ", 2); arr2[0] arr2[1] Content-typemultipart/mixed; boundary="----xxyy"

Array Object splice() pop() shift() push() unshift() var arr1 = new Array(); var arr2 = new Array(4); var arr3 = new Array(2009, "April", true); • Properties: length • Methods: concat(arrayX, arrayX, ..., arrayX) pop(), push(element1, element2, ..., elementX) shift( ), unshift(element1, element2, ..., elementX) slice(start,end), splice(index, howmany, element1, ..., elementX) reverse( ), sort(sortbyfunc) join(separator)

length var arr1=new Array(); var sum=0; arr1[0]= 32; arr1[1]=75; // … for (var i=0; i<arr1.length; i++) { sum += arr1[i]; // … }

splice(index, howmany, element1, ..., elementX) // 0,1,a1,a2,a3,2,3,4,5,6 // 0,1,2,3,4,5,6 // 0,1,2,a1,a2,a3,4,5,6 var arr = [0,1,2,3,4,5,6]; arr.splice(2, 0, "a1", "a2", "a3"); document.write(arr+"<br />"); arr.splice(2, 3); document.write(arr+"<br />"); arr.splice(3, 1, "a1", "a2", "a3"); document.write(arr+"<br />");

sort(sortbyfunc) var arr = new Array(6); arr[0] = 10; arr[1] = 5; arr[2] = 40; arr[3] = 25; arr[4] = 1000; arr[5] = 1; document.write(arr + "<br />"); // 10,5,40,25,1000,1 document.write(arr.sort()+ "<br />"); // 1,10,1000,25,40,5 document.write(arr.sort(sortByNum)+ "<br />"); // 1,5,10,25,40,1000 function sortByNum(a, b) { return a-b; }

join(separator) JavaScript,CSS,XML,Dynamic HTMLJavaScript, CSS, XML, Dynamic HTML var arr1 = ["JavaScript", "CSS", "XML", "Dynamic HTML"]; var str1 = arr1.join(); var str2 = arr1.join(", "); document.write(str1+"<br />"); document.write(str2+"<br />");

Math Object • Math is a static object. var area = 2*2* Math.PI; • Properties:

Math's Methods

Math.random() // a random number in [a, b) // an random integer in [a, b] var rand1 = Math.random(); // [0,1) var rand2 = myRandom(1, 10); // [1, 10) var rand3 = myIntRandom(1, 49); // integer in [1, 49] function myRandom(a, b) { return a+Math.random()*(b-a); } function myIntRandom(a, b) { return Math.floor(a+Math.random()*(b-a+1)); }

Date Object • Constructors new Date( ) var today = New Date(); // Current date and time new Date (year,month,date,hours,minutes,seconds,ms) var birthDay = new Date(1978, 0, 31); //Jan 31 00:00:00 1978 new Date (value) var day1970 = new Date(0); // Jan 1 00:00:00 1970 new Date(datestring) var someday = new Date("Mar 29 13:01 2009");

Date's Methods (1/3) getUTCFullYear(), getUTCMonth(), getUTCDate(), getUTCDay(), getUTCHours(), getUTCMinutes(), getUTCSeconds(), getUTCMilliseconds()

Date's Methods (2/3) setUTCFullYear(), setUTCMonth(), setUTCDate(), setUTCHours(), setUTCMinutes(), setUTCSeconds(), setUTCMilliseconds()

Date's Methods (3/3)

Date Examples Date methods http://ycchen.im.ncnu.edu.tw/www2011/lab/date.html 日期時間計算 http://ycchen.im.ncnu.edu.tw/www2011/lab/date1.html

JavaScript Functions & Objects