JavaScript程序設(shè)計(jì)基礎(chǔ)教程第2章JavaScript基本語法課件

1、JavaScript程序設(shè)計(jì)第1頁，共35頁。第2章 JavaScript基本語法2.1 JavaScript在HTML中的使用2.2 JavaScript代碼調(diào)試方式2.3 語句2.4 變量JavaScript程序設(shè)計(jì)第2頁，共35頁。第2章 JavaScript基本語法2.5 數(shù)據(jù)類型2.6 表達(dá)式和運(yùn)算符2.7 關(guān)鍵字及保留字2.8 正則表達(dá)式JavaScript程序設(shè)計(jì)第3頁，共35頁。第2章 JavaScript基本語法2.9 注釋2.10 實(shí)戰(zhàn)：加減運(yùn)算JavaScript程序設(shè)計(jì)第4頁，共35頁。 兩種方式使用 （1）直接在頁面上嵌入JavaScript代碼； （2）引用獨(dú)立的j

2、s文件；2.1 JavaScript在HTML中的使用第2章 JavaScript基本語法JavaScript程序設(shè)計(jì)第5頁，共35頁。 三種代碼調(diào)試方式 （1）使用alert()彈出警告框； （2）使用document.write()方法將內(nèi)容寫到HTML文檔中； （3）使用console.log()寫入到瀏覽器控制臺；2.2 JavaScript代碼調(diào)試方式第2章 JavaScript基本語法JavaScript程序設(shè)計(jì)第6頁，共35頁。 三種代碼調(diào)試方式比較 （1）如果在文檔已完成加載后執(zhí)行document.write，整個HTML頁面將被覆蓋，對程序執(zhí)行造成不便； （2）alert()

3、函數(shù)會阻斷JavaScript程序的執(zhí)行，從而造成副作用，而且使用alert()方法需要點(diǎn)擊彈窗的確認(rèn)按鈕操作麻煩，最重要的是alert()只能輸出字符串； （3）console.log()僅在控制臺打印相關(guān)信息，不會對JavaScript程序執(zhí)行造成阻隔，此外，console.log()可以接受任何字符串、數(shù)字和JavaScript對象，可以看到清楚的對象屬性結(jié)構(gòu)，在ajax返回json數(shù)組對象時調(diào)試很方便；2.2 JavaScript代碼調(diào)試方式第2章 JavaScript基本語法JavaScript程序設(shè)計(jì)第7頁，共35頁。 語句 JavaScript語句是向?yàn)g覽器發(fā)出的命令；var a

4、 = 1+2;var a = 1+2; var b = abc;2.3 語句第2章 JavaScript基本語法JavaScript程序設(shè)計(jì)第8頁，共35頁。 變量概念及命名 （1）變量以字母開頭； （2）變量也能以$和_開頭（不過不推薦這么做）； （3）變量名不能包含空格或其他標(biāo)點(diǎn)符號； （4）變量名稱對大小寫敏感（a和A是不同的變量）；var a; / 聲明變量aa = 1; / 給變量a賦值為12.4 變量第2章 JavaScript基本語法JavaScript程序設(shè)計(jì)第9頁，共35頁。 變量作用域 （1）全局變量； （2）局部變量；2.4 變量第2章 JavaScript基本語法Jav

5、aScript程序設(shè)計(jì)第10頁，共35頁。 變量提升 JavaScript引擎工作方式是：先解析代碼，獲取所有被聲明的變量，然后再一行一行的運(yùn)行代碼。這樣所有變量聲明語句都會被提升到代碼頭部執(zhí)行。這就叫做變量提升。2.4 變量第2章 JavaScript基本語法JavaScript程序設(shè)計(jì)第11頁，共35頁。 基本數(shù)據(jù)類型 （1）String類型； （2）Number類型； （3）Boolean類型； （4）Undefined類型； （5）Null類型；2.5 數(shù)據(jù)類型第2章 JavaScript基本語法JavaScript程序設(shè)計(jì)第12頁，共35頁。 引用數(shù)據(jù)類型 （1）Object類型；

6、（2）Array類型； （3）Date類型； （4）RegExp類型； （5）Function類型；2.5 數(shù)據(jù)類型第2章 JavaScript基本語法JavaScript程序設(shè)計(jì)第13頁，共35頁。 基本數(shù)據(jù)類型和引用數(shù)據(jù)類型的區(qū)別 （1）聲明變量時不同的內(nèi)存分配； （2）不同的內(nèi)存分配機(jī)制也帶來了不同的訪問機(jī)制； （3）復(fù)制變量時的不同； （4）參數(shù)傳遞的不同；2.5 數(shù)據(jù)類型第2章 JavaScript基本語法JavaScript程序設(shè)計(jì)第14頁，共35頁。 數(shù)據(jù)類型轉(zhuǎn)換 （1）利用轉(zhuǎn)換函數(shù)； （2）強(qiáng)制類型轉(zhuǎn)換； （3）利用JavaScript變量弱類型轉(zhuǎn)換；2.5 數(shù)據(jù)類型第2章 J

7、avaScript基本語法JavaScript程序設(shè)計(jì)第15頁，共35頁。 表達(dá)式和運(yùn)算符概念 （1）表達(dá)式是各種數(shù)值、變量、運(yùn)算符的綜合體，最簡單的表達(dá)式可以是常量或者變量名稱； （2）運(yùn)算符是變量中用來處理運(yùn)算數(shù)的各種符號； 常量表達(dá)式：hello；變量表達(dá)式：example；賦值表達(dá)式：string=”hello world”。2.6 表達(dá)式和運(yùn)算符第2章 JavaScript基本語法JavaScript程序設(shè)計(jì)第16頁，共35頁。 運(yùn)算符類型 （1）一元運(yùn)算符； （2）算術(shù)運(yùn)算符； （3）關(guān)系運(yùn)算符； （4）邏輯運(yùn)算符； （5）位運(yùn)算符； （6）賦值運(yùn)算符； （7）其他運(yùn)算符；2.6

8、表達(dá)式和運(yùn)算符第2章 JavaScript基本語法JavaScript程序設(shè)計(jì)第17頁，共35頁。 運(yùn)算符優(yōu)先級 （1）+ - - + ! delete typeof void （一元運(yùn)算符、返回?cái)?shù)據(jù)類型、對象創(chuàng)建、未定義值）； （2）* / % （乘法、除法、取余）； （3）+ - （加法、減法、字符串連接）； （4） （移位）； （5） = instanceof in （小于、小于等于、大于、大于等于、instanceof ）； （6） = != = != （等于、不等于、嚴(yán)格相等、非嚴(yán)格相等）； （7）& （按位與）；2.6 表達(dá)式和運(yùn)算符第2章 JavaScript基本語法JavaSc

9、ript程序設(shè)計(jì)第18頁，共35頁。 運(yùn)算符優(yōu)先級 （8） （按位異或）； （9）| （按位或）； （10）& （邏輯與）； （11）| （邏輯或）； （12）? （條件）； （13） = *= /= %= += -= &= = |= = = （賦值、運(yùn)算賦值）； （14）,（多重求值） ；2.6 表達(dá)式和運(yùn)算符第2章 JavaScript基本語法JavaScript程序設(shè)計(jì)第19頁，共35頁。 運(yùn)算符優(yōu)先級 運(yùn)算符優(yōu)先級等級： 一元運(yùn)算符 算術(shù)運(yùn)算符 比較運(yùn)算符 邏輯運(yùn)算符 三元運(yùn)算符 賦值運(yùn)算符 逗號運(yùn)算符2.6 表達(dá)式和運(yùn)算符第2章 JavaScript基本語法JavaScript程序設(shè)

10、計(jì)第20頁，共35頁。 關(guān)鍵字 （1）break do instanceof typeof； （2）case else new var； （3）catch finally return void； （4）continue for switch while； （5）debugger*； （6） function this with； （7）default if throw； （8） delete in try；2.7 關(guān)鍵字及保留字第2章 JavaScript基本語法JavaScript程序設(shè)計(jì)第21頁，共35頁。 保留字 （1）abstract enum int short； （2）boole

11、an export interface static； （3）byte extends long super； （4）char final native synchronized； （5）class float package throws； （6） const goto private transient； （7）debugger implements protected volatile； （8） double import public；2.7 關(guān)鍵字及保留字第2章 JavaScript基本語法JavaScript程序設(shè)計(jì)第22頁，共35頁。 正則表達(dá)式定義及特性 正則表達(dá)式是對字符串操

12、作的一種邏輯公式，就是用事先定義好的一些特定字符、及這些特定字符的組合，組成一個“規(guī)則字符串”，這個“規(guī)則字符串”用來表達(dá)對字符串的一種過濾邏輯var reg=/abcd/ ; /這個叫對象直接量方式var reg=new RegExp(abcd); /這個叫構(gòu)造函數(shù)方式var reg=/abcd/g;var reg=new RegExp(abcd, g);reg = new RegExp(w+); /這里的要轉(zhuǎn)義reg = /w+/ ; /這樣就不需要2.8 正則表達(dá)式第2章 JavaScript基本語法JavaScript程序設(shè)計(jì)第23頁，共35頁。 正則表達(dá)式語法 正則表達(dá)式是由普通字符

13、（例如字符 a 到 z）以及特殊字符（稱為元字符）組成的文字模式。模式描述在搜索文本時要匹配一個或多個字符串。正則表達(dá)式作為一個模板，將某個字符模式與所搜索的字符串進(jìn)行匹配。2.8 正則表達(dá)式第2章 JavaScript基本語法JavaScript程序設(shè)計(jì)第24頁，共35頁。 普通字符 普通字符包括沒有顯式指定為元字符的所有可打印和不可打印字符。這包括所有大寫和小寫字母、所有數(shù)字、所有標(biāo)點(diǎn)符號和一些其他符號；2.8 正則表達(dá)式第2章 JavaScript基本語法JavaScript程序設(shè)計(jì)第25頁，共35頁。 非打印字符2.8 正則表達(dá)式第2章 JavaScript基本語法JavaScript

14、程序設(shè)計(jì)字符描述cx匹配由x指明的控制字符。例如， cM 匹配一個 Control-M 或回車符。x 的值必須為 A-Z 或 a-z 之一。否則，將 c 視為一個原義的 c 字符。f匹配一個換頁符。等價于 x0c 和 cL。n匹配一個換行符。等價于 x0a 和 cJ。r匹配一個回車符。等價于 x0d 和 cM。s匹配任何空白字符，包括空格、制表符、換頁符等等。等價于 fnrtv。S匹配任何非空白字符。等價于 fnrtv。t匹配一個制表符。等價于 x09 和 cI。v匹配一個垂直制表符。等價于 x0b 和 cK。第26頁，共35頁。 特殊字符2.8 正則表達(dá)式第2章 JavaScript基本語法

15、JavaScript程序設(shè)計(jì)特殊字符描述$匹配輸入字符串的結(jié)尾位置。如果設(shè)置了 RegExp 對象的 Multiline 屬性，則 $ 也匹配 n 或 r。要匹配 $ 字符本身，請使用 $。( )標(biāo)記一個子表達(dá)式的開始和結(jié)束位置。子表達(dá)式可以獲取供以后使用。要匹配這些字符，請使用 ( 和 )。*匹配前面的子表達(dá)式零次或多次。要匹配 * 字符，請使用 *。+匹配前面的子表達(dá)式一次或多次。要匹配 + 字符，請使用 +。.匹配除換行符 n 之外的任何單字符。要匹配 . ，請使用 . 。標(biāo)記一個中括號表達(dá)式的開始。要匹配 ，請使用 。?匹配前面的子表達(dá)式零次或一次，或指明一個非貪婪限定符。要匹配 ?

16、字符，請使用 ?。將下一個字符標(biāo)記為或特殊字符、或原義字符、或向后引用、或八進(jìn)制轉(zhuǎn)義符。例如， n 匹配字符 n。n 匹配換行符。序列 匹配 ，而 ( 則匹配 (。匹配輸入字符串的開始位置，除非在方括號表達(dá)式中使用，此時它表示不接受該字符集合。要匹配 字符本身，請使用 。標(biāo)記限定符表達(dá)式的開始。要匹配 ，請使用 。|指明兩項(xiàng)之間的一個選擇。要匹配 |，請使用 |。第27頁，共35頁。 限定符2.8 正則表達(dá)式第2章 JavaScript基本語法JavaScript程序設(shè)計(jì)字符描述*匹配前面的子表達(dá)式零次或多次。例如，zo* 能匹配 z 以及 zoo。* 等價于0,。+匹配前面的子表達(dá)式一次或多

17、次。例如，zo+ 能匹配 zo 以及 zoo，但不能匹配 z。+ 等價于 1,。？匹配前面的子表達(dá)式零次或一次。例如，do(es)? 可以匹配 do 或 does 中的do 。? 等價于 0,1。nn 是一個非負(fù)整數(shù)。匹配確定的 n 次。例如，o2 不能匹配 Bob 中的 o，但是能匹配 food 中的兩個 o。n,n 是一個非負(fù)整數(shù)。至少匹配n 次。例如，o2, 不能匹配 Bob 中的 o，但能匹配 foooood 中的所有 o。o1, 等價于 o+。o0, 則等價于 o*。n,mm 和 n 均為非負(fù)整數(shù)，其中n = m。最少匹配 n 次且最多匹配 m 次。例如，o1,3 將匹配 foooo

18、ood 中的前三個 o。o0,1 等價于 o?。請注意在逗號和兩個數(shù)之間不能有空格。第28頁，共35頁。 定位符2.8 正則表達(dá)式第2章 JavaScript基本語法JavaScript程序設(shè)計(jì)字符描述匹配輸入字符串的開始位置。如果設(shè)置了RegExp對象的Multiline屬性，還會與n和r之后的位置匹配。$匹配輸入字符串的結(jié)尾位置。如果設(shè)置了RegExp對象的Multiline屬性，還會與n和r之前的位置匹配。b匹配一個字邊界，即字與空格間的位置。B非字 邊 界 匹 配。第29頁，共35頁。 選擇、反向引用、元字符2.8 正則表達(dá)式第2章 JavaScript基本語法JavaScript程序設(shè)計(jì)第30頁，共35頁。 正則表達(dá)式應(yīng)用 （1）在JavaScript應(yīng)用； （2）常見實(shí)例應(yīng)用；2.8 正則表達(dá)式第2章 JavaScript基本語法JavaScript程序設(shè)計(jì)第31頁，共35頁。 兩種方式 JavaScript注釋分為單行注釋和