《JavaScript 語法基礎》由會員分享,可在線閱讀,更多相關《JavaScript 語法基礎(34頁珍藏版)》請在裝配圖網上搜索。
1、JavaScript 語法基礎 什么是JavaScript qJavaScript 是一種腳本是一種腳本語言語言q提供用戶交互提供用戶交互 q動態(tài)更改內容動態(tài)更改內容 q數(shù)據(jù)驗證數(shù)據(jù)驗證 2將JavaScript嵌入網頁 q可以將可以將 JavaScript 語句插入語句插入 HTML 文檔,方式文檔,方式 如下:如下:q使用使用 標簽將語句嵌入文檔標簽將語句嵌入文檔q將將 JavaScript 源文件鏈接到源文件鏈接到 HTML 文檔中文檔中3使用 Script 標簽JavaScript 代碼document.write(歡迎來到 JavaScript 世界);盡情享受學習的快樂!腳本代碼設
2、置語言4使用外部 JS 文件 q外部外部 JavaScript 文件可以鏈接到文件可以鏈接到 HTML 文檔中文檔中qSCRIPT 標簽的標簽的 SRC(源文件)屬性可用于包括(源文件)屬性可用于包括此外部文件此外部文件 5使用外部 JS 文件 JavaScript 代碼代碼(test.htm)使用外部文件以上文本是通過訪問外部 JavaScript 文件顯示的 document.write(喂!你好嗎喂!你好嗎?)JavaScript 代碼代碼(test.js)6變量 q變量名必須以字母或下劃線(變量名必須以字母或下劃線(_)開頭)開頭q變量可以包含數(shù)字、從變量可以包含數(shù)字、從 A 至至 Z
3、 的大小寫字母的大小寫字母qJavaScript 區(qū)分大小寫,即變量區(qū)分大小寫,即變量 myVar、myVAR 和和 myvar 是不同的變量是不同的變量7聲明變量 var a;“var”用于聲明變量的關鍵字用于聲明變量的關鍵字“a”變量名變量名同時聲明和初始化變量同時聲明和初始化變量v var a=10;ar a=10;a=10;聲明變量聲明變量聲明多個變量聲明多個變量v var x,y,z=10;ar x,y,z=10;賦值賦值8聲明變量 使用變量var x;x=prompt(淘寶網竟拍,請出一口價,1);document.write(拍賣價格+x+)/+用來連接多個字符串document
4、.write(恭喜您,您以最高價拍賣成功!);alert(歡迎下次光臨!);定義變量賦 值輸 出prompt(“提示信息”,”默認值”)將彈出提示對話框,接受用戶的輸入。點擊確定返回輸入的字符串,點擊取消反饋空字符串。9變量 a、b 和 c 只能在其各自的函數(shù)中被訪問 變量的作用域腳本腳本函數(shù)function1局部變量a函數(shù)function2局部變量b函數(shù)function3局部變量c可由函數(shù) 1、函數(shù) 2 和函數(shù) 3 訪問全局變量 gg全局變量不需要以 var 關鍵字進行聲明,但局部變量則必須以此關鍵字來聲明10常量整型整型浮點型浮點型字符串型字符串型字字 符符說 明明示示 例例b退格符ale
5、rt(“這是第一句 b 這是第二句”)f換頁符alert(“這是第一局 f 這是第二句”)n換行符alert(“這是第一局 n 這是第二句”)r回車符alert(“這是第一局 r 這是第二句”)t制表符 alert(“這是第一局 t 這是第二句”)和C語言一樣,js也有轉義字符,常用的就是:“n”11數(shù)據(jù)類型數(shù)據(jù)數(shù)據(jù)類型型說 明明示示 例例數(shù)字型整數(shù)或實數(shù)487,25.95邏輯型或布爾型執(zhí)行邏輯運算tru或 false 字符串型一組字符“Hello”空特殊關鍵字,表示不存在的值。null12 var x=100;var y;var z;document.write(競拍SONY數(shù)碼相機 600
6、萬像素+x+$起價);y=prompt(加多少銀子?,1);z=x+y;alert(您最終的出價n+z+$);/”n”用于換行顯示 Prompt函數(shù)返回輸入的字符串“+”號的用法-1 10020?bug+字符串相連:100+”200”20013 var x=100;var y;var z;document.write(競拍SONY數(shù)碼相機 600萬像素+x+$起價);y=prompt(加多少銀子?,1);z=x+parseFloat(y);alert(您最終的出價n+z+$);/”n”用于換行顯示 parseFloat()函數(shù)將字符串轉換為float數(shù)據(jù) parseInt()函數(shù)將字符串轉換為
7、int數(shù)據(jù)如果轉換失敗,返回NaN值(not a number)“+”號的用法-214運算符 q根據(jù)所執(zhí)行的運算,運算符可分為以下類別:根據(jù)所執(zhí)行的運算,運算符可分為以下類別:q算術運算符算術運算符q比較運算符比較運算符q邏輯運算符邏輯運算符15function calcu()var numb1=document.calc.num1.value;var numb2=document.calc.num2.value;var total=parseFloat(numb1)*parseFloat(numb2);document.calc.result.value=total;計算總價并顯示添加單擊事
8、件,單擊按鈕時調用“calcu()”函數(shù)算術運算符-2獲取表單中輸入的數(shù)據(jù):document.表單名.表單元素名.value定義calcu()計算函數(shù),實現(xiàn)兩個數(shù)相乘的功能.定義函數(shù)的語法:function 函數(shù)名(參數(shù)列表)/JavaScript語句;16比較運算符比較運算符 2-1 運算符運算符說 明明示示 例例=等于。如果兩個操作數(shù)相等,則返回真。a=b!=不等于。如果兩個操作數(shù)不相等,則返回真。Var2!=5大于。如果左邊的操作數(shù)大于右邊的操作數(shù),則返回真。Var1 var2小于。如果左邊的操作數(shù)小于右邊的操作數(shù),則返回真。Var2 var1=小于等于。如果左邊的操作數(shù)小于或等于右邊的
9、操作數(shù),則返回真。Var2=4Var2=大于等于。如果左邊的操作數(shù)大于或等于右邊的操作數(shù),則返回真。Var1=5Var1=var217function calcu()var numb1=document.calc.num1.value;var numb2=document.calc.num2.value;var total=parseFloat(numb1)*parseFloat(numb2);document.calc.result.value=total;if(total500)alert(購買總價超過500n支付時將贈送超級Q幣2枚!);.其他代碼略,同上例比較運算符購買總價超過500,
10、贈送超級Q幣2枚!18運算符邏輯運算符運算符運算符值說 明明與(&)expr1&expr2只有當 expr1 和 expr2 同為真時,才返回真。否則,返回假?;?|)expr1|expr2如果其中一個表達式為真,或兩個表達式同為真,則返回真。否則,返回假。非(!)!expr如果表達式為真,則返回假。如果為假,則返回真。19if(條件1)if(條件2)/JavaScript代碼;語法:語法:嵌套 if 語句 2-120function calcu()var numb1=document.calc.num1.value;var numb2=document.calc.num2.value;if(
11、numb1!=)&(numb2!=)if(parseFloat(numb1)0)alert(競拍價格不能小于零!n請重填);return;/函數(shù)返回,不再執(zhí)行后面的代碼 if(parseFloat(numb2)0)alert(購買數(shù)量不能小于零!n請重填);return;var total=parseFloat(numb1)*parseFloat(numb2);document.calc.result.value=total;.嵌套If語句 2-2購買數(shù)量無意中輸入負數(shù),出現(xiàn) bug 怎么辦?21switch 語句 2-1switch(表達式)case 常量1:JavaScript語句;bre
12、ak;case 常量2:JavaScript語句;break;.default:JavaScript語句;語法:語法:22switch語句 2-2.var f=document.calc.pay.value;/支付方式代號 var grade;/折扣率 var total=parseFloat(numb1)*parseFloat(numb2);switch(parseInt(f)case 1:grade=0.6;/打6折優(yōu)惠 break;case 2:.同理其他方式打7折、八折 case 4:grade=0.9;/打9折優(yōu)惠 break;default:alert(請重新選擇支付方式!);re
13、turn;var money=total*grade;/根據(jù)折扣率,計算實際總價 document.calc.result.value=money;alert(您享受了+grade*10+折優(yōu)惠!);.銀行轉帳 打6折電話支付 打7折郵政匯款 打8折Q幣支付 打9折下拉列表框pay的選項和值23數(shù)組 4-1q聲明數(shù)組 var 數(shù)組名數(shù)組名 =new Array(數(shù)組大小數(shù)組大小););例:例:var emp=new Array(3)q添加元素 emp0=“AA;emp1=“BB;emp2=“CC;AABBCCemp 也可以聲明數(shù)組并賦初值:例:例:var emp=new Array(“AA”,
14、“BB”,“CC”);24使用數(shù)組var emp=new Array(3);emp0=Ryan Dias;emp1=Graham Browne;emp2=David Greene;document.write(數(shù)組emp中的數(shù)據(jù)為:);document.write(emp0+);document.write(emp1+);document.write(emp2+);數(shù)組 4-2 25數(shù)組 4-3 q常用屬性常用屬性 length :返回數(shù)組中元素的個數(shù):返回數(shù)組中元素的個數(shù)q常用方法常用方法方方 法法說 明明join將數(shù)組中的元素組合成字符串reverse顛倒數(shù)組元素的順序,使第一個元素成為最
15、后一個,而最后一個元素成為第一個sort對數(shù)組元素進行排序26var emp=new Array(3);emp0=Ryan Dias;emp1=Graham Browne;emp2=David Greene;emp.sort();document.write(“排序結果是:);document.write(emp0+);document.write(emp1+);document.write(emp2+);數(shù)組排序 4-2 27循環(huán) qfor循環(huán)qdo-whileqwhile 28JavaScript 函數(shù)內置函數(shù)內置函數(shù) qeval 函數(shù):用于計算字符串表達式的值 qisNaN 函數(shù):用于驗
16、證參數(shù)是否為 NaN(非數(shù)字)JavaScript 代碼var str1=prompt(“輸入一個表達式,我給您計算,1+1);var result=eval(str1);document.write(str1+=+result);var x=prompt(輸入一些數(shù)據(jù),0);if(isNaN(x)alert(x+不是一個數(shù)字);else alert(x+是一個數(shù)字);29自定義函數(shù)q定義函數(shù)定義函數(shù):function 函數(shù)名函數(shù)名(參數(shù)參數(shù)1,1,參數(shù)參數(shù)2 2,)語句語句;q調用函數(shù):調用函數(shù):函數(shù)調用一般和表單元素的事件一起使用,調用格式為:函數(shù)調用一般和表單元素的事件一起使用,調用格式
17、為:事件名事件名“函數(shù)名函數(shù)名”;”;function sum(one,two)var result=one+two;return result;表示單擊此按鈕時,調用函數(shù)sum()執(zhí)行30函數(shù)的應用 num1num2result31定義函數(shù) JavaScript 代碼 function compute(op)var num1,num2;num1=parseFloat(document.myform.num1.value);num2=parseFloat(document.myform.num2.value);if(op=+)document.myform.result.value=num1+num2 ;if(op=-)document.myform.result.value=num1-num2 ;if(op=*)document.myform.result.value=num1*num2 ;if(op=/&num2!=0)document.myform.result.value=num1/num2 ;定義函數(shù)compute(),完成計算的功能。op參數(shù)代表運算符號 32調用函數(shù) 第一個數(shù) 第二個數(shù) 計算結果 33 結束語結束語若有不當之處,請指正,謝謝!若有不當之處,請指正,謝謝!