第二章 JavaScript核心語法
第一章 avaScript核心語法
一.變量的聲明和賦值
JavaScript是一種弱類型語言,沒有明確的數據類型,也就是在聲明變量時不需要指定數據類型,變量的類型由賦給變量的值決定。
在JavaScript中,變量是使用關鍵字var聲明的,語法:
var 合法的變量名;
JavaScript的變量命名規則和Java命名規則相同。
JavaScript區分大小寫,所以大小寫不同的變量名表示不同的變量。
另外,由於JavaScript是一種弱類型語言,因此允許不聲明變量而直接使用,系統將會自動聲明該變量。例如:x=88;//沒有聲明x直接使用。
二.數據類型
1. undefined(未定義類型)
undefined類型只有一個值,即undefined。當聲明的變量未初始化時,該變量的默認值是undefined,例如:var widtd;
2. null(空類型)
null類型只有一個值,即null。表示“什麽都沒有”,用來檢測某個變量是否被賦值。
值undefined實際是值null派生出來的,因此javaScript把它們定義為相等的。例如:
Alert(null==undefined); //返回者為true
盡管這兩個值相等,但是它們的含義不同;
Undefined表示聲明了變量但未賦值;
Null則表示給該變量賦了一個空值;
3. number(數值類型)
javaScript中定義的最特殊的類型是number類型,這種類型即表示32位的整數,又可以表示64位的浮點數.
整數也可以表示為八進制或十六進制,八進制首數字必須是0,其後是(0~8);十六進制的手數字也必須是0,其後是(0~9)(A~F)。
另外一個特殊值NaN(Not a Number)表示非數字,它是number類型,例如:
Typeof(NaN); //返回者位number
4. String(字符串類型)
在javascript中,字符是一組被引號(單引號或雙引號)括起來的文本。
與java不同,javaScript不對“字符”或“字符串”加以區別,因此var a=”a”也是字符串類型。
和Java相同,javaScript中String也是一種對象,它有一個length屬性,表示字符串的長度(包括空格等)。
String 對象常用的方法 |
|
方法 |
描述 |
indexOf(str,index) |
查找某個指定的字符串str在字符串中首次出現的位置 |
charAt(index) |
返回指定位置index的字符 |
toLowerCase() |
把字符串轉為小寫 |
toUpperCase() |
把字符串轉換為大寫 |
Substring(index1,index2) |
返回位於索引index1和index2之間的字符串,並且包括索引index1對應的字符,不包括index2對應的字符 |
Split(str) |
將字符串以str為分割單位分割成字符串數組,str=””則分割成單個字符 |
5. boolean(布爾類型)
boolean類型數據稱為布爾型數據或邏輯型數據,boolean類型是ECMAScript中常用的類型之一,它只有兩個值:true和false
6. typeof
ECMAScript提供了typeof運算符來判斷一個值或變量究竟屬於哪種數據類型。
語法:typeof(變量或值);
其返回的值如下:
1) undefined
2) number
3) String
4) Boolean
5) Object:如果變量是null類型,或者變量是一種引用類型,如對象,數組,函數,則返回object
三.數組
和java一樣,javaScript中的數組也需要先創建,賦值,再訪問數組元素,並通過數組的一些方法或屬性對數組元素進行處理。
- 創建數組
語法:var 數組名稱=new Array(size);
例如:var fruit=new Array(5);表示創建了一個名稱為fruit,有5個元素的數組。
- 為數組元素賦值
1) var fruit=new Array(“apple”,”pear”,”orange”,”peach”);
2) var fruit=new Array(4);
fruit[0]=”apple”;
fruit[1]=”pear”;
fruit[2]=”orange”;
fruit[3]=”peach”;
3)var fruit=[“apple”,”pear”,”orange”,”peach”];
- 訪問數組
可以通過數組的名稱+下標直接訪問數組的元素,訪問數組的表示形式:數組名[下標]。例如fruit[0]標識訪問數組中的第一個元素,fruit數數組名,0表示下標。
- 數組中常用的屬性和方法
類別 |
名稱 |
描述 |
屬性 |
Length |
設置或返回數組中元素的數目,為整形 |
方法 |
Join() |
把數組的所有元素放入一個字符串,通過一個分割符進行分隔 |
sort() |
對象數組排序 |
|
Push() |
向數組末位添加一個或多個元素,並返回新的長度 |
1) Length
如果在創建數組時就指定了數組的size值,那麽無論數組中是否存儲了實際數據,該數組的length值都是這個指定的長度值size。例如,var fruit=new Array(4);那麽fruit.length=4。
2) join(分隔符)
例:
var fruit=”apple,orange,peach,banana”;//創建一個字符串
var arrlist=fruit.split(“,”);//定義一個數組接收 字符串fruit以”,”分割的元素
var str=arrlist.join(“-”);//用”-”符號把數組中元素連接在一個字符串中
結果:apple – orange – peach -banana
四.運算符號
類別 |
運算符號 |
算數運算符 |
+、-、*、/、%、++、-- |
比較運算符 |
>、<、>=、<=、==、!=、===、!== |
邏輯運算符 |
&&、||、! |
賦值運算符 |
=、+=、-= |
===表示恒等,要求數值類型和值都要相等,==要求值相等
!===表示不恒等,取反===
五.邏輯控制語句
在javaScript中,邏輯控制語句用於控制程序的執行順序,同java一樣,也分為兩類:
- 條件結構
1)if結構
2)switch結構
- 循環結構
1) for循環
2) while循環
3) do-while循環
4) for-in循環
語法:
for(變量 in 對象){
}
例:var fruit=[“apple”,”orange”,”peach”,”bannaa”];
for(var i in fruit){
document.write(fruit[i]+”<br/>”);
}
5) 中斷循環
break;可以立即退出整個程序
continue;只退出當前的循環,根據條件判斷下一次循環
六.註釋
當行註釋: //
多行註釋:/*註釋內容*/
七.關鍵字和保留字
關鍵字(首字母全部小寫) |
||||
Break |
Case |
Catch |
Continue |
Default |
Delete |
Do |
Else |
Finally |
For |
Function |
If |
In |
Instanceof |
New |
Return |
Switch |
This |
Throw |
Try |
Typeof |
Var |
Void |
While |
With |
保留字(首字母全部小寫) |
|||||
Abstract |
Boolean |
Byte |
Char |
class |
Const |
Debugger |
Double |
Enum |
Export |
Extents |
Final |
Float |
Goto |
Implements |
Import |
Int |
Interface |
Long |
Native |
Package |
Private |
Protected |
Public |
Short |
Static |
Super |
Synchronized |
Throws |
Transient |
volatile |
|
|
|
|
|
八.常用的輸入/輸出
- alert( )警告
語法: alert(“提示信息”);
創建一個特殊的對話框,對話框帶有一個字符串和“確定”按鈕
- prompt( )提示
語法:prompt(“提示信息”,”輸入框的默認信息或空的輸入框”);
Prompt()方法第一個參數值顯示在對話框上,通常是一些提示信息,第二個輸入框出現在用戶輸入的文本框中,有“確定”和“取消”兩個按鈕,“取消”則返回為null,“確定”則返回一個字符串型數據。
九.語法約定
- 大小寫的區分
1) javascript的關鍵字;如for和if,永遠都是小寫的
2) 內置對象,如Math和Date以大寫字母開頭
3) 對象的名稱通常小寫,遵循駱駝命名法。
- 變量、對象和函數的名稱
與java命名規範相同,“字下美…”
- 分號
Javascript允許開發者自行決定是否以分號結束一行代碼,如果沒有分號,javascript就將行代碼的末尾看作該語句的結尾。
為了代碼的規範,不推薦不使用分號結尾。
十.調試
打開chrome瀏覽器,按F12進入調試:
>1:Elements:用於查看和編輯當前頁面中的HTML和CSS元素.
>2:Console:用於顯示腳本中所輸出的調試信息,或運行測試腳本等.
>3:Sources:用於查看和調試當前頁面所加載的腳本的源文件.
>4:Network:用於查看HTTP請求的詳細信息,如請求,響應及返回內容等。
>5:Timeline:用於查看腳本的執行時間,頁面元素渲染時間等信息.
>6:Profiles:用於查看CPU執行時間與內存占用等信息.
>7:Resource:用於查看當前頁面所請求的資源文件,如HTML,CSS樣式等。
>8:Audits:用於優化前端頁面,加速網頁加載速度等.
其次,通過alert()方法輸出變量值也可以進行調試.
十一.常用的系統函數
- parseInt()
parseInt()函數可以解析一個字符串,並返回一個整數。如果第一個字符不是數值類型,則返回NaN,表示不是數組類型,如中間遇到非數值字符,則會省略後面的字符,返回前面的數值。
- parseFloat()
parseFloat()函數可以解析一個字符串,並返回一個浮點數。方法與parseInt()相似。如果第一個字符不是數值類型,則返回NaN,表示不是數組類型,如中間遇到非數值字符,則會省略後面的字符,返回前面的數值。
例: var a=parseFloat(36s22.0);//返回值36.0
- isNaN()
isNaN()函數用於檢查其參數是否非數字,如果不是數字則返回true,如果是數字返回flase。
例:var flag=isNaN(“12.5s”); //返回為true,區別與parseInt()和parsrFloat()函數的轉換,isNaN()函數不會省略後面的字母。
十二.自定義函數
1.定義函數
在javascript中,自定義函數是由關鍵字function、函數名、一組參數及置於括號中的待執行的javascript語句組成的,語法:
Function 函數名(參數一,參數二…){
//javascript語句;
[return 返回值]
}
Function是定義函數的關鍵字,必須有.
2.調用函數
要執行一個函數,必須調用這個函數,當調用函數時,必須指定函數名及其後面的參數(有參函數)。函數的調用一般和元素的事件結合使用。
語法:
時間名=”函數名([參數])”;
十三.變量的作用域
與java中的變量一樣,在javascript中,根據變量作用範圍不同,可分為全局變量和局部變量。
全局變量是在所有函數之外的腳本中聲明的變量。
局部變量是在函數內聲明的變量。
十四.事件
名稱 |
說明 |
onload |
一個頁面或一副圖像完成加載 |
onlick |
鼠標單擊某個對象 |
onmouseover |
鼠標移動到某個元素上 |
onkeydown |
某個鍵盤按鍵被按下 |
onchange |
域的內容被改變 |
例:
<!DOCTYPE HTML>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title> 加載事件 </title>
<script type="text/javascript">
function message(){
alert("加載中,請稍等…"); }
</script>
</head>
<body onLoad="message()">
歡迎學習JavaScript。
</body>
</html>
註:
onload 事件會在頁面或圖像加載完成後立即發生。
語法
onload="SomeJavaScriptCode"參數 描述
SomeJavaScriptCode 必需。規定該事件發生時執行的 JavaScript。
支持該事件的 HTML 標簽:
<body>, <frame>, <frameset>,
<iframe>, <img>, <link>, <script>
支持該事件的 JavaScript 對象:
image, layer, window
第二章 JavaScript核心語法