1. 程式人生 > 其它 >JavaScript基礎之註釋,型別,輸出,運算子

JavaScript基礎之註釋,型別,輸出,運算子

JavaScript是一種依託於網頁為宿主的指令碼語言,JavaScript是一門非常強大的語言,尤其對於web端,用途廣泛,好用,偏向於操作網頁,可以操作網頁中的任何一個元素,JavaScript的缺點是是不能操作資料庫,所以製作動態網頁時需要結合其他語言來完成。

初學者可能會誤以為JavaScript和Java語言之間有關係,雖然他們名字很像,他們確實是沒有關係的。Java是sun公司的,該公司在2010年10月24日被oracle收購,oracle不僅是資料庫的名字,oracle也就是大名鼎鼎的甲骨文公司。JavaScript是Netspace公司的,該公司1998年11月被AOL美國線上收購了。而JScript則是微軟的,三者並沒有太多關係。

JS可以嵌在網頁的任何一個位置,也可以在外部。用<script>標籤。

JS的註釋語法分有單行註釋和多行註釋兩種:

單行註釋://後一行的內容會被註釋

多行註釋:/* 中間的內容會被註釋 */

HTML:<!-- 中間的內容被註釋 -->

css:/* 中間的內容被註釋 */

JS的輸出語法:

alert();輸出其中的內容

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標題文件</title>
</head>

<body>
</body>
</html>
<script>
    var i=10;
    alert("hello world"+"    "+i);
</script>

如圖,<script>嵌在了網頁的最下方:

用var定義了一個變數i,然後用alert輸出可以看出,

1.“”中的內容會被直接輸出

2.定義好的變數會輸出變數的值而不是變數本身。

3.+號會把它們連起來輸出

confirm();輸出可選擇的內容

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標題文件</title>
</head>

<body>
</body>
</html>
<script>
    var i=confirm("確認嗎");
    alert(i);
</script>

執行該程式碼後,會出現如下提示框:

如果點選確定:

如果點選取消:

由此可見,confirm不僅輸出,還可以和使用者簡單的交流,如果使用者點選確定,會返回true,如果使用者點選取消,會返回false,confirm有且僅有這兩個返回值。

prompt("");使用者輸入

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標題文件</title>
</head>

<body>
</body>
</html>
<script>
    var i=prompt("請輸入");
    alert(i);
</script>

執行後:

會出現一個輸入的對話方塊,我們嘗試輸入一段文字:

點選確定後:

會返回使用者輸入的內容。

這裡需要注意的是,使用者輸入的內容返回都是字串形式。輸入數字1,返回就是字串‘1’。

資料型別:

計算機儲存資料的時候並不是所有的資料都一樣的,嚴格按照資料型別來儲存。程式語言都繞不開資料型別,常見的資料型別有:

int  整數

float  單精度小數

double  雙精度小數

decimal  小數

money  貨幣型別

char  字元

string  字串

bool  布林型,只有true和false

datetime  日期時間型別

強型別語言和弱型別語言:

說到型別,又分為強型別語言和弱型別語言,簡單來說,強型別語言定義變數需要指定型別,比如C#,Java,假設你在c#程式碼中,你定義了一個整型變數後,就不能賦一個字元型資料給這個變數,除非你用強制型別轉換,弱型別語言定義變數不需要指定型別,比如JavaScript,var 可以接受任何型別。

先記住慢慢理解:

強類語言使得物件處理的資料更容易被理解,而不需要與ADO.NET和XML程式設計模型打交道。這在大型系統裡是很有用的,特別是當設計者定義了由自定義類所組成的資料訪問層,並把設計向組織內的其他程式設計師釋出的時候。當然,現在自定義類的使用有下降的趨勢:它們需要編更多的程式碼,因為你必須建立.NET Framework所缺少的物件關係對映層。

強/弱型別是指型別檢查的嚴格程度的。語言有無型別,弱型別和強型別三種。無型別的不檢查,甚至不區分指令和資料。弱型別的檢查很弱,僅能嚴格的區分指令和資料。強型別的則嚴格的在編譯期進行檢查。

型別轉換:

雖然JavaScript是弱型別語言,但還是要用到型別轉換。

parseInt()轉換成整數

parseFloat()轉換成小數

在前面已經可以看到,字串與數字相加,得出的是在字串的相加

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標題文件</title>
</head>

<body>
</body>
</html>
<script>
    var i='999';
    var l=1.5;
    alert(i+l);
    i=parseInt(i);
    alert(i+l);
</script>

可見在JavaScript中字串和數字型別相加,得出的結果是字串的組合,點確定

這是轉換成變數i成數字之後,數字和數字之間相加,得出的結果是數字的和。

JavaScript中的運算子表示式

數學運算子:

+

數字求和,或字串的組合

-

求差

*

乘積

/

除號需要注意的是,如果除一個不能整除得數,在JavaScript中會得出準確的小數,但是在其他強型別語言中,不能夠整除的整數得出的還是整數,因為強型別語言中整數除以整數得出的還是整數。多餘的小數就去掉了。

%

取餘數

補充:有些小數運算會出問題,如下

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標題文件</title>
</head>

<body>
</body>
</html>
<script>
    var i=1.1;
    var l=56;
    alert(i*l);
</script>

得出的結果明顯有問題,與浮點數有關,可以嘗試在小數運算中擴大10000倍在除以10000來解決問題。

邏輯運算子:

&&

與,並,兩者都要是真true

||

或,二者有一個是真true就可以

非,否

比運算子:

==

等於,===是恆等於,=是賦值

!=,<>

不等於

>

大於

<

小於

>=

大於等於

<=

小於等於

三元運算子:

a==b?"A等於B":"A不等於B";

舉例:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標題文件</title>
</head>

<body>
</body>
</html>
<script>
    var i=1;
    var l=10;
    var c=i>=l?"ok":"no";
    alert(c);
</script>

以上是判斷變數i是否大於等於變數l,若果是,返回OK,如果不是,返回no,c是判斷的返回值。

再來一個輸入的判斷:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標題文件</title>
</head>

<body>
</body>
</html>
<script>
    var i=prompt("請輸入第一個數字");
    var l=prompt("請輸入第二個數字");
    var c=i>=l?"第一個數大於等於第二個數":"第一個數不大於第二個數";
    alert(c);
</script>

輸入第一個數字12

輸入第二個數字10

判斷得出第一個數字大於第二個數字。