JavaScript程序設計基礎教程第2章JavaScript基本語法課件

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

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

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

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

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

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

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

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

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

10、計第20頁，共35頁。 關鍵字 （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 關鍵字及保留字第2章 JavaScript基本語法JavaScript程序設計第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 關鍵字及保留字第2章 JavaScript基本語法JavaScript程序設計第22頁，共35頁。 正則表達式定義及特性 正則表達式是對字符串操

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

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

14、程序設計字符描述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 正則表達式第2章 JavaScript基本語法

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

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

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

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