上節(jié)課主要講解的是JavaScript代碼的規(guī)范和格式。
這節(jié)課來具體講解關(guān)于變量、數(shù)據(jù)類型和運算符的基礎(chǔ)知識，然后利用這些知識在網(wǎng)頁上顯示一個九九乘法口訣表。
變量
變量是用來存儲一個數(shù)據(jù)的容器。
JavaScript變量的定義規(guī)范是這樣的：
var x=1;
var y;
var name="Michael";
在變量名前面用關(guān)鍵字var來進行定義。
定義變量名的同時可以對變量用賦值=進行設(shè)置初始值。
變量必須以字母開頭；
變量能以$和_符號開頭；
變量名稱對大小寫敏感（例如 x 和 X 是不同的變量）。
一個好的編程習(xí)慣，是在程序開始之處對需要用到的變量統(tǒng)一定義。
來做一個加法計算器，定義2個變量，然后將2個變量相加，結(jié)果賦值給一個新的變量，然后輸出到控制臺。
修改testjs.js文件如下：
var a=3;
var b=5;
var c=a+b;
console.log(a,"+",b,"=",c);
將新增的函數(shù)addValue替換到click按鈕的onclick事件上。
修改testjs.html文件如下：
刷新網(wǎng)頁，點擊click按鈕，然后打開網(wǎng)頁調(diào)試工具，在console窗口可以看到輸出結(jié)果。
這里的console.log的作用就是可以向瀏覽器調(diào)試工具輸出log信息，這個方法對于調(diào)試JavaScript非常有用。
輸出的結(jié)果不會顯示到網(wǎng)頁內(nèi)容中，只會出現(xiàn)在瀏覽器的調(diào)試工具的console窗口中。
數(shù)據(jù)類型：數(shù)字、字符串、布爾和數(shù)組
變量可以存儲不同的數(shù)據(jù)類型的值。
常見的數(shù)據(jù)類型有數(shù)字、字符串、布爾和數(shù)組。
JavaScript只有一種數(shù)字類型，可以帶小數(shù)點也可以不帶。
例如：
var a=35.00;
var a=35;
字符串是用來存儲字符的變量類型。
例如：
var name="michael";
var name='jack';
可以使用單引號或者雙引號，注意的是前后如果用單引號，則當中的內(nèi)容里面不要有單引號。
布爾類型只有2個值：true和false。
例如：
var isnum=true;
var notme=false;
布爾類型用于條件判斷語句中。
數(shù)組可以存儲一組變量，并可以通過下標序號訪問數(shù)組的元素。
例如：
var names=new Array();
names[0]="michael";
names[1]="jack";
names[2]="tom";
或者 var names=new Array("michael","jack","tom");
或者var names=["michael","jack","tom"];
數(shù)組的第一個元素的下標序號是從0開始的。
運算符
前面用到的+就是一個運算符，是一個算術(shù)運算符。
常用的運算符有3大類：算術(shù)運算符，賦值運算符，邏輯運算符，比較運算符。
常用的算術(shù)運算符有：
- 加法運算符
- 減法運算符
- 乘法運算符
/ 除法運算符
% 求余數(shù)運算符
算術(shù)運算法可以將2個變量進行算術(shù)計算得到一個新的值。
例如：
var x=9;
var y=6;
var z=x-y;
z的值就等于3。
例如：
var name1="michael";
var name2=" hello";
var name=name1+name2;
name的值就是"michael hello"。
數(shù)字和數(shù)字相加等于數(shù)字，字符串和字符串相加等于字符串。如果是數(shù)字和字符串相加則等于字符串。
常用的賦值運算符：
= 賦值運算符
符值運算符可以將數(shù)據(jù)賦予給一個變量。
邏輯運算法：
NOT 邏輯非運算符，使用!來運算
AND 邏輯與運算符，使用&&來運算
OR 邏輯或運算符，使用||來運算
邏輯運算符只能對布爾變量進行運算。
邏輯非運算符可以將布爾變量進行反向符值。
例如，var a=true; var b=!a; 則b的值是false。
邏輯與運算符，按照如下規(guī)則計算：
true && true 的結(jié)果是true
true && false 的結(jié)果是false
false && true 的結(jié)果是false
false && false 的結(jié)果是false
規(guī)則是只有2個都為真結(jié)果才為真。
邏輯或運算符，按照如下規(guī)則計算：
true || true 的結(jié)果是true
true || false 的結(jié)果是true
false || true 的結(jié)果是true
false || false 的結(jié)果是false
規(guī)則是只要1個為真則結(jié)果為真。
比較運算符用于比較，返回的結(jié)果是一個布爾數(shù)據(jù)類型的值。
常見的有以下：
== 等于
大于
< 小于
= 大于等于
<= 小于等于
例如：
3==3 的值為 true
3==5 的值為 false
3>5 的值為false
5<9 的值為true
3>=3 的值為true
一般關(guān)系運算符用于條件判斷語句中。
for循環(huán)
為了實現(xiàn)九九乘法口訣表，肯定要用到循環(huán)，否則一個一個去寫的話要累死。
JavaScript里面的循環(huán)，同樣有while循環(huán)和for循環(huán)，這里先來使用for循環(huán)。
for循環(huán)的語法是這樣的：
for (語句1;語句2;語句3) {
循環(huán)執(zhí)行代碼
}
語句1會在循環(huán)開始前執(zhí)行一次，一般用于設(shè)置初始條件。
語句2定義運行循環(huán)的條件，一般是一個比較運算的結(jié)果。
語句3在每次循環(huán)執(zhí)行代碼完成之后運行一次，一般用于改變循環(huán)條件的變量。
例如：
for (var i=0;i<3;i++) {
console.log(i);
}
它的運行次序是這樣的：
首先定義變量i的值為0，然后進入循環(huán)體內(nèi)部執(zhí)行，在console輸出0，然后運行i++，這樣i的值變?yōu)?，然后判斷是否i<6，發(fā)現(xiàn)1<3=true，滿足條件，則再次進入循環(huán)體內(nèi)部執(zhí)行，在console輸出1，然后運行i++，這樣i的值變?yōu)?，然后判斷是佛i<6，發(fā)現(xiàn)2<3=true，滿足條件，則再次進入循環(huán)體內(nèi)部執(zhí)行，在console輸出2，然后運行i++，這樣i的值變?yōu)?，然后判斷是佛i<6，發(fā)現(xiàn)3<3=true，不滿足條件結(jié)束循環(huán)。
這樣console就輸出3次，輸出結(jié)果從0到2。
console里輸出乘法口訣表
假如要實現(xiàn)一個九九乘法口訣表，就需要第1排輸出11=1，第2排輸出12=2和2*2=4，這樣統(tǒng)計下來，需要輸出9行9列。
因此，可以先用2層for循環(huán)來實現(xiàn)在console里面輸出乘法口訣表。
修改testjs.js代碼如下：
刷新頁面，點擊click按鈕。
可以看到console里面輸出了乘法口訣表。
網(wǎng)頁中顯示九九乘法口訣表
要讓乘法口訣表顯示在網(wǎng)頁中，需要利用到document.write語句了。
document.write語句可以用于在網(wǎng)頁中輸出新的網(wǎng)頁元素內(nèi)容。
先來增加一個div的樣式吧，在head部分增加CSS樣式：
修改testjs.html代碼如下：
這個樣式定義了div為一個圓角的長方形，底色為淺灰色，邊框為單實現(xiàn)深灰色，文字字體為紫色，字體為20px和其它樣式。
然后來在document里面用JavaScript代碼輸出一個div元素。
修改testjs.html代碼如下：
刷新網(wǎng)頁：
可以看到，網(wǎng)頁中在document.write執(zhí)行的地方出現(xiàn)了一個div元素了，它的樣式是前面定義好的樣式。
document.write方法可以向網(wǎng)頁文檔中輸出指定的網(wǎng)頁元素內(nèi)容。
如果要顯示多行的div，那么可以利用
來進行換行。
修改testjs.html代碼如下：
可以看到第2行出現(xiàn)了，第2行顯示了2個元素。
修改代碼，利用2層for循環(huán)，輸出九九乘法口訣表。
修改testjs.html代碼如下：
刷新網(wǎng)頁：
可以看到網(wǎng)頁顯示出了乘法口訣表。
學(xué)習(xí)方法不同了
可以感覺到，學(xué)哥現(xiàn)在對知識的講法有所不同，由于有了前面2章的基礎(chǔ)，尤其是學(xué)會了python語言的基礎(chǔ)語法之后，再來學(xué)JavaScript，很多概念都是類似的，例如變量，數(shù)據(jù)類型，邏輯判斷等等，所以學(xué)哥就會先把概念羅列出來，然后用更多的例子來進行練習(xí)，可以利用之前的基礎(chǔ)，加快學(xué)習(xí)的速度。
