javascript快速入門2--變量,小學生數學與簡單的交互 · 李炎恢 HTML CSS JavaScript PHP Bootstrap 教程

# javascript快速入門2--變量,小學生數學與簡單的交互 ## 變量對于變量的理解：變量是數據的代號。如同人的名字一樣。 ``` var num;//在JavaScript中使用關鍵字var聲明一個變量 ``` 在JavaScript中,使用上面的語法,就可以聲明一個變量,以便在之后給其指定值. ``` var num; num=128;//這樣，就將num做為值128的一個名字，有了名字，就可以在之后引用！ document.write(num);//輸出128 ``` 貌似下面的代碼和上面的具有一樣的輸出 ``` document.write(128);//這樣當然也輸出了128 ``` 不過再試試下面的代碼 ``` document.write(3.14159265358979);//我們要多次輸出這個值 document.write(3.14159265358979); document.write(3.14159265358978); document.write(3.14159265358979); document.write(3.14159265358979); ``` 于是可以用變量的概念來偷懶 ``` var num; num=3.14159265358979; document.write(num); document.write(num); document.write(num); document.write(num); document.write(num); ``` 雖然看上去沒節約多少筆墨，但有一個概念即是：我們使用document.write多次輸出的是同一個值！而前面一塊則不同，它在每次輸出時產生了一個新的值，顯而易見，使用變量可以清楚的表達我們想要做的，而且簡短的變量名引用可以使代碼更清晰且不容易出錯！當然，名字不是亂取的，變量的命名有一些限制：只能包含字母，數字，和下劃線，還有個特殊的$字符，并且變量名只能以字母，下劃線，還有$開頭;另外，還不能使用JavaScript關鍵字和保留字;所以說，下面的變量聲明全是錯誤的 ``` var 34bad;//不能以數字開頭 var per人;//不能包含中文 var bad-var;//非法的- var var;//var就是一個關鍵字，所以很明顯不能用來做變量名 ``` **另外要注意的一點是,變量的名稱是區分大小寫的!** ## 值，類型 ``` var dog; dog="小虎子";//字符串，它們總被包含在雙引號(或單號)中 var num; num=1;//數字，它們裸露的出現了 var strNum; strNum="1";//但是現在strNum所引用的是一個字符串,因為它被包含在引號中了 var badNum; badNum=3.345;//一個小數，因為它帶有一個小數點 badNum=.2;//仍然是一個小數，這句代碼與badNum=0.2是一樣的! badNum = 0.4.5;//當然，這句代碼是錯的，一個非法數字 ``` 上面那樣的寫法（為了演示），我已經不想再忍受了，完全可以這樣聲明變量 ``` var dog,num,strNum,badNum;//可以一次聲明多個變量，它們用逗號分隔,然后再賦值 dog="小虎子"; num=1; .......................... ``` 當然還有另一種聲明變量的方法,事實上這種風格才是最常見的 ``` var dog="小虎子"; var num=1; var str="some string",strNum="123"; ...... ``` 數字（只能有整數或小數），字符串可能最常用的了，還有另一種類型：布爾值(Boolean).不像數字或字符串，有無限種可能的值，Boolean值只有兩種可能：真，假 ``` var bool=true;//用true表示真值 bool=false;//用false表示假值 ``` JavaScript是動態類型語言，在聲明變量時無需指明其類型，在運行時刻變量的值可以有不同的類型。 ``` var s="Hello,World!!!";//無需指明為字符串類型 s=1.61803;//在運行時將變量值指定為另一個類型 ``` JavaScript的變量類型不止字符串，數字，布爾值這三種，然而這三種確是最常用的了。其它數據類型（參考）：復合（引用）數據類型是： * 對象 * 數組特殊數據類型是： * Undefined ``` //事實上,我們接觸的第一個數據類型是Undefined,它的含義是"未定義值" var a;//聲明一個變量,但沒有對其賦值 alert(a);//但它仍然有值的,它的值為undefined alert(b);//但注意,輸出一個未定義的變量將出現錯誤,而不是輸出undefined ``` ## 字符串字符串相連 ``` var s1="Hello,"; s1=s1+"World!"; alert(s1); s1+="!!!!"; alert(s1); ``` ## 數學運算與比較首先是小學生都會的加減乘除:+,-,*,/ ``` //加法 + //減法 - //乘法 * //除法 / //自增 ++ //自減 -- var a = 12; var b = 30; var c = a+b; alert(c);//輸出42 c=b-a; alert(c);//輸出18 c=c*2; alert(c);//輸出36 c=c/2; alert(c);//輸出18 c = 12; c++;//這與c=c+1;效果是一樣的 alert(c);//輸出13 c--;//這與c=c-1;效果是一樣的 alert(c);//輸出11 //自增與自減運算符出現的地方也有講究 c=20; alert(c++);//輸出20,因為++寫在變量后面,這表示變量c完成運算之后,再將其值增1 alert(c);//現在將輸出21,自減運算符也與些相似 //如果只是類似這樣的計算 c = c+12; //可以這樣寫 c+= 12;//這與寫c= c+12;效果是一樣的 //類似其它的運算也有簡便的方法 c-=3;//c=c-3 c*=4;//c=c*3; c/=2;//c=c/2; ``` 要注意的是，在JavaScritp中，連接字符串時也使用“＋”號。當字符串與數字相遇時？——JavaScript是弱類型語言 ``` var num=23+45; alert("23+45等于"+num);//表達式從左往右計算，字符串之后的數字都會當成字符串然連接 alert("23+45="+(23+45));//使用括號分隔 ``` 比較操作符:<,>,<=,>=,==,!=,!;比較操作符返回布爾值 ``` //小于 < //大于 > //小于或等于 <= //大于或等于 >= //相等 == //不相等 != alert(2<4);//返回true alert(2>4);//返回false alert(2<=4);//返回true alert(2>=2);//返回true alert(2==2);//返回true alert(2!=2);//返回true ``` 表達式的組合 ``` alert( (2<4)==(5>3)==(3<=3)==(2>=2)==(2!=2)==(2==2)==true ); ``` ## 邏輯運算符邏輯運算符用于對布爾值進行比較 ``` // &&邏輯與,當兩邊的值都為true時返回true,否則返回false // || 邏輯或,當兩邊值都為false時返回false,否則返回true // ! 邏輯非 alert(true && false);//輸出false alert(true && true);//輸出true alert(true || false);//輸出true alert(false || false);//輸出false alert(!true);//輸出false ``` ## 類型轉換入門由于JavaScript是弱類型語言,所以我們完全可以將字符串和數字(兩個不同類型的變量)進行相加,這個我們在前面已經演示過了.當然,不僅僅可以將字符串和數字相加,還可以將字符串與數字相乘而不會出現腳本錯誤! ``` var str ="some string here!"; var num = 123; alert(str*num);//將輸出NaN,因為乘法運算符只能針對數字,所以進行運算時計算機會將字段串轉換成數字 //而這里的字符串轉換成數字將會是NaN //NaN是一個特殊的值,含義是"Not A Number"-不是一個數字,當將其它值轉換成數字失敗時會得到這個值 str ="2"; alert(str*num);//將輸出246,因為str可以解析成數字2 ``` 其它類型轉換 ``` var bool = true; alert(bool*1);//輸出1 ,布爾值true轉換成數字為1,事實上將其它值轉換在數字最簡單的方法就是將其乘以1 bool = false; alert(bool*1);//輸出0 alert(bool+"");//輸出"flase",將其它類型轉換成字符串的最簡單的方法就是將其寫一個空字符串相連 alert(123+"");//數字總能轉換成字符串 var str = "some string"; alert(!!str);//true,因為非運算符是針對布爾值進行運算的,所以將其它類型轉換成布爾值只須將其連續非兩次 str =""; alert(!!str);//輸出false,只有空字符串轉換成布爾值時會是false,非空字符串轉換成布爾值都會返回true var num =0; alert(!!num);//false num=-123.345; alert(!!num);//true,除0以外的任何數字轉換成布爾值都會是true //還有一個非常重要的是,空字符串轉換成數字將會是0 alert(""*1);//輸出0 ``` 獲取變量類型 typeof 運算符 ``` var bool = true; alert(typeof bool);//輸出boolean var num =123; alert(typeof num);//輸出number var str = "some string here"; alert(typeof str);//輸出string var strNum = "123"; alert(typeof strNum);//輸出string strNum *= 1; alert(typeof strNum);//輸出number ``` ## 根據用戶的輸入進行計算使用window.prompt可以彈出包含輸入框的窗口，用戶輸入的內容將是此函數的返回值 ``` var msg = window.prompt("請輸入一個數字","默認值");//prompt方法包含一個必須參數和一個可選參數。 //第一個參數是必須的，將在窗口中顯示的文字，第二個參數是可選的，為文本框的預設值 alert(msg);//將輸出我們輸入進去的東西 ``` 請用戶輸入年齡，我們計算出他活了多少秒（貌似無聊的很啊） ``` var age=window.prompt("請輸入您的年齡！","18"); var liveSeconds=age*365*24*3600; alert("您已經度過了"＋liveSeconds＋"秒!"); ```