天天看點

web開發 -3- JavaScript

簡介:

  • 基于對象和事件驅動 并具有安全性能的腳本語言
  • 使用它的目的是與HTML超文本标記語言、Java腳本語言一起實作在一個網頁中連結多個對象 與網絡客戶互動作用 進而可開發客服端的應用程式
  • 它是通過嵌入式或調入在标準的HTML語言中實作的

特點:

  • 動态的 可以直接對使用者或客服端做出響應 無須經過web服務程式
  • 是一種腳本語言 本身提供了豐富的内部對象供設計人員使用
  • 是一種可以嵌入web網頁中的解釋性程式設計語言 其源代碼在發往用戶端執行之前不需進行編譯 而是将文本格式的字元代碼發送給客戶 有浏覽器解釋執行
  • 變量聲明 采用其弱類型 即變量在使用前不需作聲明 而由解釋器在運作時檢查其資料類型
  • JavaScript的代碼是一種文本字元格式 可以直接嵌入HTML文檔中 并且可以動态裝在
  • 使用< script >…< /script >來辨別

JS的資料類型和變量

六種

主要:
	number :  數值資料類型 支援整數和浮點數 整數可以使正數、0、負數;
			   浮點數可以包含小數點 也可以包含一“e” 
			  (大小寫均可 在科學計數法中表示為“10的幂”)
			   或同時包含這兩項
	string:   字元串類型 字元串是用單引号或雙引号說明的
			  (使用單引号來輸入包含引号的字元串)
	object:   對象
	Boolean:  可能的Boolean值有true和false 這是兩個特殊值 不能用作1和0
其他:
	null:     沒有任何值 什麼也不表示
	undefined:一個為underfined的值就是指在變量被建立後 
			   但未給該變量指派以前所具有的值
           
  • 在JavaScript中變量用來存放腳本中的值 在需要用這個值的地方就可以用變量來代表 一個變量可以是一個數字 文本或其他一些東西
  • JavaScript是一種對資料類型變量要求不太嚴格的語言 所有不必聲明每一個變量的類型 變量聲明盡管不是必須的 但在使用變量之前先進行聲明是一種好的習慣
可以使用var語句來進行變量聲明 例如:
var men = true;       //men中存儲的值為Boolean類型
           

變量命名:

JavaScript是一種區分大小寫的語言 是以将一個變量命名為computer和将其命名為Computer 是不一樣的

另外 變量名稱的長度是任意的 但必須遵守以下規則:

  • 第一個字元必須是一個字母 (大小寫均可) 或一個下劃線_ 或一個美元符$
  • 後續的字元可以使字母 數字 下劃線 或美元符
  • 變量名稱不能是保留字
JS的語句及文法

JavaScript所提供的語句共分為6個大類 分别是:變量聲明指派語句;函數定義語句;條件和分支語句;循環語句;對象操作語句;注釋語句。

變量聲明,指派語句

變量:沒有固定值 可以改變的數

在JavaScript中使用var關鍵字聲明變量

var 變量名稱 [= 初始值]
Var a;
Var a,b,c;
var a = 32          //定義一個變量 且有初始值為32
           

條件和分支語句

if…else條件語句 :分支功能 如果其中的條件成立 則程式執行緊接着條件的語句或語句塊 否則程式執行else中的語句或語句塊

if(result == true)
	{
	reponse = "you are right!"
	}else
	reponse = "you are wrong!"
	}
           

switch分支語句:選擇語句 根據一個變量的不同取值選擇不同的處理方法

Switch(score){
Case 50:
	Result = " 悲哀呀,你挂科了";
	Break;
Case 60:
	Result = "很幸運,你勉強通過";
	Break;
Case 70:
	Result = "不錯,還需要加油呀";
	Break;
Case 80:
	Result = "還能更進一步嗎?"
	Break;
Case 90:
	Result ="高手呀,佩服佩服";
	Break;
	}
           

Break關鍵字用來跳出分支語句 直接跳出switch語句 不再進行下面的判斷

當分支條件比較少時 if…else與switch都可以使用 在分支條件較多時使用switch最為有效

循環語句

實作重複計算或操作的語句 循環語句也是進階語言中常用語句之一

常用循環語句有 :for, for…in, while, do while.

for語句用于在執行次數一定的情況下 文法如下:

for(變量=開始值;變量<=結束值;變量=變量+步進值)
	{
	需要反複執行的語句;
}
           

for…in 語句與for語句有一點不同 它循環的範圍是一個對象所有的屬性或是一個數組的所有元素

for (變量 in 對象或數組)
{
要執行的語句...
}
           

while語句所控制的循環不斷地測試條件 如果條件始終成立 則一直循環 直到條件不再成立

while(變量 <= 結束值)
{
要執行的語句...
}
           

do…while語句與while語句很相似 在判斷之前先執行一次語句 然後判斷是否符合指定條件 當條件符合時候接着在執行語句

var i = 0
do
{
document.write("已運作次數: " + i)
document.write("<br/>")
i = i+1
}
while(i<0)
           
do…while語句至少執行一次 而while語句則不然 當指定條件不成立時候 語句不被執行

函數定義語句

使用關鍵字function

function 函數名稱 (函數所帶的參數)
{
函數執行部分
}
           

return語句将結束函數并傳回後面表達式的值 return語句的文法為:“return 表達式”

函數結束時可以沒有return語句 但是隻要遇到return語句函數就結束

對象操作語句

JavaScript是一種基于對象的程式設計語言 它為我們提供了豐富的對象 這就需要我們懂得如何去操作這些對象 這就是對象操作語句

常用的對象操作語句有:with, new, this

with:如果你想使用某個對象的許多屬性或方法時 隻要在with語句的() 中寫出這個對象的名稱 然後在下面的執行語句中直接寫這個對象的屬性名或方法名就可以了

with(對象名稱)
{
執行語句
}
           

new語句是一種對象構造器 可以用new語句來定義一個新對象

新對象名稱 = new 真正的對象名
例如:我們可以這樣定義一個新的日期對象 : var cuur = new Date()
           

this運算符總是指向目前的對象

注釋語句

單行注釋: //

多行注釋:

JS的對象及其屬性和方法

JavaScript為我們提供了一些非常有用的常用内部對象和方法 使用者不需要用腳本來實作這些功能 這正是基于對象程式設計的真正目的

字元串對象String

  • 擷取字元串長度length屬性
  • 截取字元串substring方法
  • 字元串替換replace方法
  • 大小寫轉換toLowerCase 和 toUpperCase

數組對象 Array

數組同字元串對象一樣 是一種資料類型 通過數組可以把若幹變量有序地組織起來 也是最常用的資料類型之一

有兩種建立方式 其一通過數組直接建立 其二通過Array關鍵詞進行建立

var a = [123,44, '3',22];     //直接建立數組
var b = new Array(6);      //6個元素數組
           

數組常用的屬性方法有擷取數組的長度、添加數組中的元素

同字元串一樣 數組也是通過length函數擷取長度的

Var a=['1','2','3','4','5']
Var b = a.length               // b=5
           

向數組中添加資料使用 unshift關鍵字操作

Var a=['1','2','3','4','5']
a.unshift(0);                //a = [0,1,2,3,4,5]
           
在JavaScript語言中 數值中值的資料類型可以不一緻 這一點與其他語言有差別

日期和時間對象Date

var now = new Date();         //傳回的是一個表示目前時間的對象
其他常用屬性和方法:
getFullYear() :  傳回對象中的年份部分 用四位數表示
getMonth() : 傳回對象中的月份部分(從0開始計算)
getDate() : 放回對象所代表的一月中的第幾天
getHours : 傳回對象中的小時部分
getMinutes() : 傳回對象中的分鐘部分
getSeconds() :傳回對象中的秒部分
getMilliseconds() : 傳回對象中的毫秒部分
getTime() : 傳回對象的内部毫秒表示
例:
var now = new Date();
var curryear = now.getFullYear()  //傳回目前月份curryear=‘2019’
           

對象隻是一種特殊的資料

JS的事件處理

事件是浏覽器響應使用者互動操作的一種機制 JavaScript的事件處理機制可以改變浏覽器響應使用者操作的一種方式 這樣就開發出具有互動性并易于使用的網頁

必須使用的事件有三類:

  • 引起頁面這件跳轉的事件 主要是超連結事件
  • 事件浏覽器自己引起的事件
  • 事件在表單内部同界面對象的互動

界面事件包括Click(單擊)、MouseOut(滑鼠移出)、MouseOver(滑鼠移過)、MouseDown(滑鼠按下)等

單擊事件 : οnclick= 函數或是處理語句

處理下拉清單: onchange = 函數或是處理語句

繼續閱讀