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
判斷得出第一個數字大於第二個數字。