Lecture%208

Views:
 
Category: Entertainment
     
 

Presentation Description

No description available.

Comments

Presentation Transcript

Lecture 8String(Web Development Lecture 8) : 

Lecture 8String(Web Development Lecture 8)

การใช้งาน MATH : 

การใช้งาน MATH

ฟังก์ชันของ Math : 

ฟังก์ชันของ Math สำหรับฟังก์ชันทางคณิตศาสตร์ (Math Functions) สามารถแบ่งการทำงานของฟังก์ชันได้ดังนี้ random( ) sin( r ) cos( r ) tan( r ) asin( x ) acos( x ) atan( x ) atan2( x, y ) max( x, y ) max( x, y ) round( x ) floor( x ) ceil( x ) exp( x ) log( x ) abs( x ) sqrt( x ) pow( x, y )

Slide 4: 

Math.round() // 2.3 = 2 Math.floor() // 2.3 = 2 Math.ceil() // 2.3 = 3 Math.floor(Math.random() * (5)); 0.0 * 5 = 0 0.99 *5 = 4.95

String Manipulation : 

String Manipulation เพื่อเข้าใจชุดคำสังที่เกี่ยวข้องกับ String สามารถแก้ไขปัญหาที่เกี่ยวข้องกับ String ได้

ตัวอย่างการจัดการ String : 

ตัวอย่างการจัดการ String String เป็น object หนึ่งในภาษา javaScript var s = new String(); var test = new String(“Yes!”); var check = “true”; สร้างรูปแบบตัวอักษรหนา เอนตามรูปแบบที่ต้องการ แปลงอักษรให้เป็นตัวเล็กหรือตัวใหญ่ ตรวจสอบว่ามีตัวอักษรอยู่ใน String หรือไม่ หาความยาวของ String

String ในภาษา JavaScript : 

String ในภาษา JavaScript ใช้เครื่องหมาย +, == มีเมธอดในการจัดการข้อมูลชนิด String มีพรอบเพอร์ตี้ (length) ในการจัดการข้อมูลชนิด String

ตัวอย่างการใช้งาน String length : 

ตัวอย่างการใช้งาน String length name = “BHOLA” ; document.write( “The length of the string ‘name’ is ”+ name.length ) ; The length of the string ‘name’ is 5

<HTML> <HEAD> <TITLE>Send an eMail</TITLE> <SCRIPT> function checkForm( ) { … } </SCRIPT> </HEAD> <BODY bgcolor=“#FFFFCC”> <TABLE><FORM …>…</FORM></TABLE> </BODY></HTML> : 

<HTML> <HEAD> <TITLE>Send an eMail</TITLE> <SCRIPT> function checkForm( ) { … } </SCRIPT> </HEAD> <BODY bgcolor=“#FFFFCC”> <TABLE><FORM …>…</FORM></TABLE> </BODY></HTML>

Slide 11: 

<TABLE> <FORM name= “sendEmail”> <INPUT type=“text” name=“sender” > <INPUT type=“submit” name=“sendEmail” value=“Send eMail” onMouseOver=“checkForm( )” > … </FORM> </TABLE>

Slide 12: 

function checkForm( ) { if( document.sendEmail.sender.value.length < 1 ) { window.alert( “Empty From field! Please correct” ) ; } } This is a string

ทดสอการใช้งาน String : 

ทดสอการใช้งาน String หากต้องการกำหนด login และ password ให้กรอกข้อความได้ 4 - 8 characters ???

Slide 14: 

<script> function checkemail(){ if(test.test2.value.length < 4 || test.test2.value.length > 8) { return false; } } </script> <body> <form name="test" > <input type="text" size=20 name="test2"> <input type="submit" value="Submit" onclick ="return checkemail()"> </form>

String Methods : 

String Methods FORMAT string.methodName( ) EXAMPLE: name = “Bhola” ; document.write( name.bold( ) ) ; Bhola

ชนิดของ String Methods : 

ชนิดของ String Methods คำสั่งในการกำหนดให้ String มีรูปแบบ HTML ตามที่กำหนด (HTML Shortcuts) คำสั่งอื่น ๆ ที่ใช้ประมวลผล String (All Others)

String Methods: HTML Shortcuts : 

String Methods: HTML Shortcuts bold( ) italics( ) strike( ) sub( ) sup( ) big( ) small( ) fontsize( n ) fixed( ) fontcolor( color ) link( URL )

big( ), small( ), fontsize( n ) : 

big( ), small( ), fontsize( n ) person = "Bhola" ; document.write( person ) ; document.write( person.big( ) ) ; document.write( person.small( ) ) ; document.write( person.fontsize( 1 ) ) ; document.write( person.fontsize( 7 ) ) ; (// fontsize มีขนาด 1-7) BholaBholaBholaBholaBhola

Slide 19: 

มีรูปแบบโค้ดดังนี้ <font size=n>...</font> ซึ่ง n มีค่าตั้งแต่ 1 ถึง 7 ตัวอย่างโค้ด <html><body><font size=1>แสดงข้อความที่มีขนาด n=1</font><br><font size=2>แสดงข้อความที่มีขนาด n=2</font><br><font size=3>แสดงข้อความที่มีขนาด n=3</font><br><font size=4>แสดงข้อความที่มีขนาด n=4</font><br><font size=5>แสดงข้อความที่มีขนาด n=5</font><br><font size=6>แสดงข้อความที่มีขนาด n=6</font><br><font size=7>แสดงข้อความที่มีขนาด n=7</font><br></body></html>

sub( ), sup( ) : 

sub( ), sup( ) person = "Bhola" ; document.write( name ) ; document.write( name.sub( ) ) ; document.write( name ) ; document.write( name.sup( ) ) ; BholaBholaBholaBhola

bold( ), italics( ), strike( ) : 

bold( ), italics( ), strike( ) name = "Bhola" ; document.write( name ) ; document.write( name.bold( ) ) ; document.write( name.italics( ) ) ; document.write( name.strike( ) ) ;

fixed( ), fontcolor( color ) : 

fixed( ), fontcolor( color ) person = "Bhola" ; document.write( person ) ; document.write( person.fixed( ) ) ; document.write( person.fontcolor( “blue” ) ) ; document.write( person.fontcolor( “orange” ) ) ; BholaBholaBholaBhola

String + HTML : 

String + HTML String functions สามารถใช้งานร่วมกันได้ var x = “test”; document.write(x.bold().italics().strike()); var y = “test1”; document.write(y.small().sub() + “ Data ”); var z= “test2”; alert(z.big().sup() + “ Data”);

link( URL ) : 

link( URL ) hotel = "Bhola Continental" ; document.write( hotel ) ; document.write( hotel.link(“http://www.itsci.mju.ac.th.” ) ) ; Bhola ContinentalBhola Continental

String Methods: All Others : 

String Methods: All Others split( delimiter ) toLowerCase( ) toUpperCase( ) charAt( n ) substring( n, m ) indexOf( substring, n ) lastIndexOf( substring, n )

toLowerCase( ), toUpperCase( ) : 

toLowerCase( ), toUpperCase( ) String toLowerCase() เป็นการแปลงข้อความจากตัวใหญ่เป็นตัวเล็ก เช่น “Q”. toLowerCase() จะถูกเปลี่ยน เป็น q String toUpperCase() เป็นการแปลงข้อความจากตัวเล็กเป็นตัวใหญ่ เช่น “q”. toLowerCase() จะถูกเปลี่ยน เป็น Q person = "Bhola" ; document.write( person ) ; document.write( person.toLowerCase( ) ) ; document.write( person.toUpperCase( ) ) ; BholabholaBHOLA

charAt( n ) : 

charAt( n ) เมธอด charAt()ซึ่งดึงค่าตัวอักษร char ออกมา mister = "Bhola" ; document.write( mister ) ; document.write( mister.charAt( 0 ) ) ; document.write( mister.charAt( 8 ) ) ; document.write( mister.charAt( 2 ) ) ; Bo charCodeAt(); “JavaScript”.charCodeAt(1); // returns 97

replace : 

replace การแทนที่ตัวอักษร โดยใช้เมธอด replace() StringName.replace('ตัวอักษรเดิม','ตัวอักษรใหม่') <script type="text/javascript"> var visitorName = "Chuck"; var myOldString = "Hello username! I hope you enjoy your stay username."; var myNewString = myOldString.replace("username", visitorName); document.write("Old string = " + myOldString); document.write("<br />New string = " + myNewString); </script>

substring( n, m ) : 

substring( n, m ) การแบ่งข้อความเป็นส่วน ๆ โดยใช้เมธอด subString( ) s = "Bhola" ; document.write( s.substring( 1, 3 ) ) ; document.write( s.substring( 0, s.length ) ) ; hoBhola

Slide 32: 

substring(n) ใช้ในการตัดข้อความตัวอักษรโดยเริ่มต้นที่ n var x = “JavaScript”.substring(3) // x = “aScript” ต่างกับการทำงานแบบ substring( n, m ) var x = “JavaScript”.substring(1,3) // x = “av” (start 1 / before 3)

indexOf( substring, n ) : 

indexOf( substring, n ) หาตำแหน่งของตัวอักษรจากด้านซ้ายมือไปทางด้านขวามือ โดยใช้เมธอด indexOf() s = "Bhola" ; document.write( s.indexOf( “ola”, 1 ) ) ; document.write( s.indexOf( “z”, 3 ) ) ; 2-1 document.write( "ABnZZ".indexOf( "Z", 3 ) ) ; 3

lastIndexOf( substring, n ) : 

lastIndexOf( substring, n ) หาตำแหน่งของตัวอักษรจากด้านขวามือไปทางด้านซ้ายมือ โดยใช้เมธอด lastIndexOf() ซึ่งคืนค่าตำแหน่งเป็นตัวเลข s = "Bhola" ; document.write( s.lastIndexOf( “ola”, 4 ) ) ; document.write( s.lastIndexOf( “b”, 0 ) ) ; 2-1

indexOf( substring), lastIndexOf ( substring) : 

indexOf( substring), lastIndexOf ( substring) indexOf() – “JavaScript”.indexOf(“S”); // 4 “JavaScript”.indexOf(“Script”); // 4 lastIndexOf() – “JavaScript”.indexOf(‘a’); // 1 “JavaScript”.lastIndexOf(‘a’); // 3

Slide 36: 

<script type="text/javascript"> function checkemail(which){ if (which.indexOf("@")!=-1&&which.indexOf(".")!=-1) alert("Good!") else alert("enter a valid email address!") } </script> <form name="test" onSubmit="checkemail(this.test2.value);return false"> <input type="text" size=20 name="test2"> <input type="submit" value="Submit"> </form>

split( delimiter ) : 

split( delimiter ) แปลง string เป็นอาเรย์โดยต้องกําหนดตัวอักษรที่ใช้เป็นตัวแบ่ง var wordArray = “A/simple/example”.split(“/“); s = "Hello: I must be going!" ; a = new Array( 5 ) ; b = new Array( 5 ) ; a = s.split( " " ) ; b = s.split( "e" ) ; document.write( "<TABLE>" ) ; for( k = 0; k < 5; k = k + 1 ) document.write( "<TR><TD>", a[ k ], "</TD><TD>", b[ k ], "</TD></TR>" ) ; document.write( "</TABLE>" ) ; Hello: H I llo: I must b must going! be undefined going! undefined

Slide 38: 

<form name="wordcount"> <textarea rows="12" name="wordcount2" cols="38" wrap="virtual"></textarea><br> <input type="button" value="Calculate Words" onClick="countit()"> <input type="text" name="wordcount3" size="20"> </form> <script type="text/javascript"> function countit(){ var formcontent=document.wordcount.wordcount2.value formcontent=formcontent.split(" ") document.wordcount.wordcount3.value=formcontent.length } </script>

Slide 39: 

alert("java".indexOf("JAVA")); alert("java".toUpperCase().indexOf("JAVA"));

Automatic Conversion to Strings : 

Automatic Conversion to Strings ในการใช้ ‘+’ เมื่อนำข้อความใด ๆ มาเชื่อมต่อแม้จะเป็นตัวเลขค่าจะถูกแปลงเป็น String ให้โดยอัตโนมัติ ค่าที่ไม่ใช่ตัวอักษรจะถูกแปลงให้เป็นตัวอักษรโดยอัตโนมัติถ้าใช้กับฟังก์ชันแสดงข้อความ หรือเมธอดที่รับค่าเป็น String Example: document.write( พารามิเตอร์ String) เมื่อส่งค่าเป็นตัวเลขหรือ Boolean หลังจากที่การคำนวณค่าเสร็จสิ้นค่าจะถูกเปลี่ยนเป็น String โดยอัตโนมัติ

The ‘+’ Operator: Examples : 

The ‘+’ Operator: Examples document.write( 2 + Math.PI ) ; document.write( "2" + "3" ) ; document.write( "2" + Math.PI ) ; document.write( "Yes" + false ) ; 5.141592653589793 23 23.141592653589793 Yesfalse

Slide 42: 

+ มักใช้ในการเชื่อมต่อ String var newString = “JavaScript” + “ is “ + “ easy”; สามารถใช้ concat() เชื่อมต่อแทน + ได้ var s = “JavaScript”.concat(“ is “, “easy”);

การเปรียบเทียบเงื่อนไขใน String (String Compare) : 

การเปรียบเทียบเงื่อนไขใน String (String Compare) ใช้ if(“” == “”) var username = "someAgent"; if(username == "SomeAgent") document.write("Welcome special agent"); else document.write("Access Denied!"); Access Denied!Let's try it with toLowerCaseWelcome special agent

Case Insensitive String Compare : 

Case Insensitive String Compare var username = "someAgent"; if(username.toLowerCase() == "SomeAgent".toLowerCase()) document.write("Welcome special agent"); else document.write("Access Denied!"); </script> Access Denied!Let's try it with toLowerCaseWelcome special agent

ทดสอบการปัดเศษ 100.553478 เป็น 100.55 : 

ทดสอบการปัดเศษ 100.553478 เป็น 100.55

‘toString’ Method เป็นการแปลงค่า object อื่นเป็นชนิด String : 

‘toString’ Method เป็นการแปลงค่า object อื่นเป็นชนิด String EXAMPLE: Convert 100.553478 into a currency format a = 100.553478 ; b = a.toString( ) ; decimalPos = b.indexOf( "." ) ; c = b.substring( 0, decimalPos + 3 ) ; document.write( c ) ; 100.55

authorStream Live Help