第3章：基本概念----語法 / 數據類型 / 語句

本章內容：

1. 語法
2. 數據類型
3. 流控制語句
4. 理解函數
    

3.1 語法

借鑑C語言；

3.1.1區分大小寫
ECMAScript中的一切（變量，函數名和操做符）都區分大小寫。

3.1.2 標識符
標識符，就是指變量，函數，屬性的名字，或者函數的參數。組合規則以下：
第一個字符必須是字母，下劃線_或者美圓符號$
其餘字符能夠是字母，下劃線_或者美圓符號$或數字。

3.1.3 註釋

// 單行註釋

/*
   多行註釋
*/

3.1.4 嚴格模式
"use strict"

3.1.5 語句

分號：

var sum = a+b;   //記得加分號，不是必須，可是可能會致使壓縮出錯。

 

3.2 關鍵字和保留字

3.3 變量

局部變量

function test(){
	var message = "chai";  //局部變量
}
test();
alert(message); //錯誤！

全局變量

function test(){
	message = "chai";  //全局變量  聲明時省略 var 操做符
}
test();
alert(message); //chai

一條語句定義多個變量

var message ="chai",
    found = false,
    age = 29;

 

3.4 數據類型

五種基本數據類型（Number,String,Boolean,Null,Undefined）,和一種混合數據類型（Object）。

3.4.1 typeof 操做符

做用：檢測給定變量的數據類型，返回值和對應解釋以下：

Undefined	Boolean	String	Number	Object	function
未定義	布爾值	字符串	數值	對象或者Null	函數

3.4.2 Undefined類型

Undefined類型只有一個值，即特殊的Undefined。

在聲明一個變量但未對其初始化時，這個變量的值：Undefined

eg：

var message;
alert(message==undefined); //返回true

特別注意：alert下面2個的區別 ↓

未聲明的變量	聲明變量未定義值
報錯	Undefined

3.4.3 Null類型

Null只有一個值，即Null。Null對象代表一個空對象指針，因此用typeof 檢測時，返回：Object。

適合什麼狀況下用此類型？

對於之後要保存對象的變量，可是目前還沒真正保存對象，就應該明確將該變量保存爲Null值。

3.4.4 Boolean類型

布爾Boolean類型表示邏輯實體，它只有兩個值，保留字true和false，分別表明真和假這兩個狀態。

應用場景

===條件和循環語句===

if(a > 1){
//條件爲true時，執行此處
}else{
//條件爲false時，執行此處
}

===邏輯運算符===

console.log(!!1);//true

console.log(!!0);//false

===關係運算符===

console.log( 1 > 2);//false

3.4.5 Number類型

NaN,非數值。

非數值類型檢測：isNaN（）函數。eg以下；

alert(isNaN(10))  //返回false

數值轉換

3個函數 ，非數值--》數值。
Number(),
若是是Boolean值，true和false將分別轉換爲1和0。
若是是null，返回0；
若是是underfined，返回NaN。

...詳見書

var num1 = Number(「Hello world!」);   //返回NaN  很差漢任何有意義的數字值
var num2 = Number(「000011」);   //返回11
var num3 = Number(true);        //返回1

pareInt(),
轉爲整數格式，

parseFloat()

...詳見書

 

3.4.5 String類型（字符串類型）

1,字符串字面量

...

//計算長度：
var text =「hello world！」
alert（text.lenght）

2,轉化爲字符串

toString() 方法

....見書

 

3.5.3 布爾操做符

3個操做符：非（NOT），與（AND），或（OR）

1，邏輯非
邏輯非由一個歎號 ！ 表示，能夠應用於任何值。邏輯非操做符首先會把它的操做數轉換爲一個布爾值，而後對其求反。

2，邏輯與
邏輯與由兩個 && 表示，能夠應用於任何值。

3，邏輯或
邏輯或由兩個 || 表示，

 

3.4.6 Object類型

數據和功能的集合，並添加屬性和方法。

....見書

 

3.6 語句

3.6.1 if 語句

if(i>25){
	alert("大於25");
}else if(i<0){
	alert("小於0");
}else{
	alert("介於0~25之間")
}

3.6.2 do-while 語句

後測試循環語句，至少會被執行一次。（先幹了再說！）

var i=0;
do {i +=2;} 
while ( i < 10 );

alert(i)

3.6.3 while 語句
前置測試循環語句，在循環體代碼被以前前，都會判斷條件。條件不符，可能永遠不會被執行。

var i=0;
while (i<10){
	i+=2;
}

3.6.4 for 語句

var count = 10;
for(var i = 0; i < count; i++){
  alert(i);
}

3.6.5 for-in 語句
for-in 是一種精準的迭代語句，能夠用來枚舉對象的屬性。

eg：遍歷數組

var x
var mycars=["VW","Volvo","BMW"]
for (x in mycars)
{
	document.write(mycars[x] + "<br />")
}

eg：遍歷對象（取 鍵 / 值）（重點！）

/*------------二維對象取鍵和值---------------*/
var obj ={
				right_001:{ name:"高高",tel:"13687871111"},
				right_002:{ name:"大柴",tel:"13687872222"},
				right_003:{ name:"小柴",tel:"13866001234"}
			}
 
 //遍歷出--》鍵
for (var key in obj) {      //特別注意 ：遍歷的是鍵
	alert(key)  //返回 right_001;  right_002;  right_003
}

//遍歷出--》值
for (var key in obj) {    
	alert(obj[key])            // 返回 object object object 
	console.log(obj[key])     //逐一打印出來：
}

 下面這個demo是用for in 遍歷對象--用2個數組分別存儲鍵/值 （重點！）

var obj={"name":"wjy","age":26,"sex":"female"};//定義一個object對象    
var keys=[];//數組key    
var values=[];//數組value    
  for(var key in obj){    
    keys.push(key);       //鍵塞到數組  
    values.push(obj[key]);//值塞到數組  
    }    
alert("keys鍵 ："+keys+" 值values："+values);

 

3.6.9 switch 語句
能夠在switch語句中，case的值能夠是常量，變量或表達式。

eg：經典案例（根據月份信息，頁面滑動到自定的tr行。）

$(function(){

	var date=new Date;
	var month=date.getMonth()+1;
	 
	 //定義函數
	function go_this( current_month ){
		current_month.css("background","#fcd54f");
	 	var current_nonth_len = current_month.length;
	 	if(current_nonth_len<=0)
	 	{
	 		alert("本月無續費項目")
	 	}
	 	else{
	 		alert("本月是"+month+"月，一共有"+current_nonth_len+"個客戶須要續費")
	 		$("html,body").animate({scrollTop:current_month.eq(0).offset().top},500)
	 	}
	 	
	}
	//條件判斷
	switch (month){
	 	
	 	case 1:
	 		go_this($(".month-1"))();
	 	break;
	 	
	 	case 2:
	 		go_this($(".month-2"))();
	 	break;
	 	
	 	case 3:
	 		go_this($(".month-3"))();
	 	break;
	 	
	 	case 4:
	 		go_this($(".month-4"))();
	 	break;
	 	
	 	case 5:
	 		go_this($(".month-5"))();
	 	break;
	 	
	 	case 6:
	 		go_this($(".month-6"))();
	 	break;
	 	
	 	case 7:
	 		go_this($(".month-7"))();
	 	break;
	 	
	 	case 8:
	 		go_this($(".month-8"))();
	 	break;
	 	
	 	case 9:
			go_this($(".month-9"))();
	 	break;
	 	
	 	case 10:
	 	  	go_this($(".month-10"))();
	 	break;
	 	
	 	case 11:
	 		go_this($(".month-11"))();
	 	break;
	 	
	 	case 12:
	 		go_this($(".month-12"))();
	 	break;
	 	
	}

})

<tr class="month-1">
   ...
</tr>

 

3.7 函數

$(function(){
	//函數定義
	function window_title(user_name,user_age){
		alert("你是"+user_name+",今年"+user_age) //字符串與參數的拼接
	}
	
	//函數調用
	$("#btn").click(function(){
		window_title('大柴','35')  //方法名，參數;
	})
})