JavaScript（一）基礎數據、基本語法

本章主要內容

1、JavaScript介紹；

1. 簡介
2. 組成

2、基礎數據；

1. 註釋
2. 基本常識
3. 命名
4. 變量
5. 基礎數據類型
6. 運算符
7. 賦值符
8. 比較符
9. 三元操做符
10. 邏輯符
11. 經常使用的幾個小命令 alert、prompt、console.log、typeof

3、基本語法；

1. if條件語句
2. switch語句
3. for語句
4. 嵌套規則
5. while循環語句
6. do-while循環語句
7. for與whille的用途區別
8. break與continue

 

1、JavaScript介紹；

　　簡介：

　　　　JavaScript一種直譯式腳本語言，是一種動態類型、弱類型、基於原型的語言，內置支持類型。它的解釋器被稱爲JavaScript引擎，爲瀏覽器的一部分，普遍用於客戶端的腳本語言，最先是在HTML（標準通用標記語言下的一個應用）網頁上使用，用來給HTML網頁增長動態功能

　　組成：

1. ECMAScript，描述了該語言的語法和基本對象。
2. 文檔對象模型（DOM），描述處理網頁內容的方法和接口
3. 瀏覽器對象模型（BOM），描述與瀏覽器進行交互的方法和接口。

 

2、基礎數據

一、註釋

1.一、單行註釋：‘//’

   <script>
	   //你好我是單行註釋
   </script>   

1.二、多行註釋：‘/**/’

    <script>
    /*
	   你好我是多行註釋
	   你好我是多行註釋
	   你好我是多行註釋
	*/
    </script>

 

二、常識

2.一、結束符：‘;’  當一行代碼結束時，須要用‘;’來表示結束，固然不寫瀏覽器也是能夠解析的，爲了代碼的美觀和閱讀方便，建議寫上；

2.二、Bjavascript 是區分 大小寫的；

 

三、命名規範

3.一、有字母數字下劃線(-)或者美圓符（$）號組成;

3.二、不能以數字開頭；

3.三、不能呢個使用javascript中的關鍵字命名；

 

四、變量

4.一、ECMAscript的變量是鬆散型，因此能夠用來保存任何數據；

4.二、變量僅僅是用來保存值的佔位符；

4.3.一、變量名的聲明：

　　單個聲明： var name；

　　多個聲明：var name1,name2,name3;   (用逗號分割)；

4.3.二、變量賦值：

　　單個賦值：var name=1;

　　多個賦值：var name=1,name2=2,name;

4.四、當咱們要存儲數據的時候須要聲明一個變量用來村值；

 

五、基礎數據類型

5.1 、undefind   指沒有定義的變量 該處缺乏一個值；

5.2 、null  表示"沒有對象"，即該處不該該有值；

5.1-2  undefind 與 null很是類似 且 undefind == null 布爾值爲true；

5.三、Number 整數型；

5.3.1 、NAN 特殊的Number； 

a、當字符串與數值進行運算時，返回的結果就是NaN；

b、任何與NaN進行運算的結果都會返回NaN；

c、NaN不與任何值相等包括自身；

d、isNaN()  ......；

    <script>
	   	var a=isNaN('456')    //false 
	   	var b=isNaN('456ab')  //true 
	   	var c=isNaN('ab456')  //true
	   	console.log(a,b,c)
	</script>

5.3.二、字符串 轉 數字

a、Nuber()    只能轉換所有是數字型的字符串；

    <script>
	   	var a=Number('456')    //456
	   	var b=Number('456ab')  //NaN
	   	var c=Number('ab456')  //NaN
	   	console.log(a,b,c)
    </script>

b、parseInt()   不只能轉換 數字類型的字符串，並且還能轉換以數字開頭的字符串，只取整數位；

    <script>
	   	var a=parseInt('456')    //456
	   	var b=parseInt('456ab')  //456
	   	var c=parseInt('ab456')  //NaN
	   	console.log(a,b,c)
    </script>

c、parseFloat()  和 parseInt區別，去小數點後面數字且只認第一個小數點，後面有也忽略；

5.4 String 字符串型

5.4.1 只要是用（' '）或者（" "）包裹起來的都是string型；

5.4.2 轉成字符串型

a、String()能夠把值轉換成字符串

    <script>
    	var x;  
	   	var a=String(1456)   //1456
	   	var b=String('1456aa')  //1453aa
	   	var c=String(null)  //null
   		var e=String(x)  //undefind
	   	console.log(a,b,c,e)
	</script>

b、toString()  用於把結果轉化成字符串，和String惟一的區別是不能用在結果爲null和undefind上會報錯；

    <script>
    	var x=123;
    	var y=null;
    	var z;
	   	var a=x.toString()   // 1456
	   	var b=y.toString()   // 報錯
	   	var c=z.toString()  // 報錯
	   	console.log(a,b,c)
	</script>

5.5 Boolean 布爾型

5.5.一、在布爾的世界中只有對（true）和錯（false）；

5.5.二、在布爾的世界中爲false的有：數字只有 0 、字符串只有空、其餘有null和undefind；

5.5.3 布爾轉換：

a、Boolean()

    <script>
	   	var a=Boolean('')   // false
	   	var b=Boolean(0)   // false
	   	var c=Boolean(null)  // false
	   	console.log(a,b,c)
	</script>

 

六、運算符號

6.一、經常使用的（加、減、乘、除、取餘數）：+、-、*、/、%；

6.二、遞增與遞減

a、a++ 和 ++a    前者 先返回值再加1  後者 加完1以後再返回值；

    <script>
	    var a=3;
	    var b=3;
	    var c=5; 
	    var x=(a++)+c  //8
	    var y=(++b)+c  //9
	    console.log(x,y)
    </script>

c、a-- 和 --a 與遞增同理　　；

 

七、賦值 符號

7.一、簡單賦值： a=123；

7.二、複合賦值： +=、-=、*=、%=；

 

八、比較 符號

• <  小於；
• >  大於；
• >=  小於等於；
• <=  大於等於；
• ==  等於  ；
• === 全等於；
• !=  不等於；
• !==  全不等於；

　　* ‘==’  值相等即爲true；‘===’  不只值相等並且類型也要相等；

<script>
    	var a=5,b='5';
    	var c=a==b;  //true
    	var d=a===b;  //false
	console.log(c,d)
</script>

 

九、三元運算

適用於簡單的邏輯判斷   一個判斷跟兩個選擇；

    <script>
	    var score=85;
	    var result=(score>=60)?'及格':'不及格'    //及格
	    console.log(result)  
    </script>

 

十、邏輯符

10.一、且  ‘&&’    ：

a、都爲真時取最後一個真值；

b、都爲假時，取第一個假值；

b、真假都有時，取第一個假值；

10.二、或 ‘||’：

a、都爲真時取最第一個真值；

b、都爲假時，取最後一個假值；

b、真假都有時，取第一個真值；

10.1-二、&& 與 || 的區別 一個找假   一個是找真；

10.3 非 ‘！’ :不管是什麼數據類型，用上非其結果一定是布爾值，且返回的布爾值與自身相反；

10.4 非非 ‘！！’ : 返回結果是布爾，布爾值與自身一致；

十一、幾個經常使用的命令

11.一、alert() ：瀏覽器彈框；

11.二、prompt() ：瀏覽器輸入框彈框；

11.三、typeof() 或 typeof 變量：檢測類型的；

 

3、基本語法

一、if條件語句

1.一、語法格式：

<script>
    var a=50;

    if (a>60) {
    	alert('及格')
    }else{
    	alert('不及格')
    }

</script>

　　

1.二、單條件型：如1.1；

1.三、多條件型  ：能夠 屢次使用 「else if」；

    <script>
   	    var a=50;

	    if (a>60) {
	    	alert('及格')
	    }else if (a>70) {
	    	alert('良好')
	    }else if (a>80){
	    	alert('優秀')
	    }else{
	    	alert('不及格')
	    }
    </script>

1.四、JavaScript 不支持  6<a<10這種格式的條件；

 

二、switch條件語句

2.一、語法格式：

var day=new Date().getDay();
switch (day)
{
case 0:
  x="Today it's Sunday";
  break;
case 1:
  x="Today it's Monday";
  break;
case 2:
  x="Today it's Tuesday";
  break;
case 3:
  x="Today it's Wednesday";
  break;
case 4:
  x="Today it's Thursday";
  break;
case 5:
  x="Today it's Friday";
  break;
case 6:
  x="Today it's Saturday";
  break;
}

2.二、注意這裏面的比較是全等（===）的比較，不是（==）比較；

2.三、經典例題  當輸入1時 結果會是什麼，你是想不到的；

 

三、for循環

3.一、語法格式    條件  起始值  終止值  代碼塊  自增

　　運行思路： 起始位置 --  符合條件 --- 運行 代碼塊 ---  自增  

　　　　　　　　　　　　  符合條件 --- 運行 代碼塊 ---  自增  

　　　　　　　　　　　　  符合條件 --- 運行 代碼塊 ---  自增 

　　　　　　　　　　　　................

　　　　　　　　　　　　不符合條件 ----  終止循環；

    <script>
	    for (var i=1;i<=9;i++){
	    	document.write(i)
	    }

    </script>

 

四、嵌套

4.一、嵌套規則：

• 外層爲假時，內層不執行；
• 當進入內層後，遵循先內後外的原則；

 

五、whille循環

5.一、語法規則：

    <script>
	    var i=1;
	    while(i<=10){
	    	document.write(i);
	    	i++;
	    }

    </script>

 

六、do-while循環

6.一、語法規則：

    <script>
	    var i=18;
	    do{
	    	document.write(i);
	    	i++;
	    }while(i<=10)

    </script>

6.二、while和do-while的區別：do-while無論條件符合不符合，都會先執行一次代碼塊的內容；

 

七、for和while的用途區別

a、for用於已知的循環次數；

b、while用於未知的循環次數；

 

八、break與continue

8.一、break 爲 終止循環；

8.二、continue 爲 跳出本次循環；