javascript函數

javascript的函數比較豐富、和javascript的對象一樣,需要一定的積累纔可以深入理解,通過函數可以體現javascript的面向過程編程思想,通過對象類型可以更好的體現面向對

象的設計思想,本節主要大概講述一下javascript的函數


1 函數的定義方式

javascript的函數定義分爲三種:function語句形式、函數直接量形式、構造函數的形式

// function 語句定義函數  function+函數名+參數列表+函數體
 function fun1(x,y){
    return x+y;
 } 

 //執行一個函數是 fun1(3,4) 其中3,4是兩個實際參數
 console.info(fun1(3,4))
 //在javascript的函數比較靈活,只會根據函數名進行匹配,和實際參數個數無關,同樣返回7 
 console.info(fun1(3,4,5,6))
 
 //函數直接量 這種方式用的較多 定義一個變量,直接賦值一個函數
 var func2=function(x,y,z){
 	return x+y+z
 }

 //執行一個函數
 console.info(func2('a','b',4))
 
 //第三種形式 構造函數的形式 如果有返回值,必須放在最後一個參數,而且最好加上分號,對於形式參數需要使用引號
 //構造函數沒有函數體,是頂級作用域,與前兩種方式不同
 var func3=new Function('x','y','return x+y')
 //執行函數 
 console.info(func3(3,5))


2 arguments參數

主要兩個作用,1、獲取實際參數、2、可以遞歸調用自己

//對於通過function定義函數、函數直接量定義的函數,都有一個特定的隱藏對象arguiments
 //需要注意的是通過頂級作用域的構造函數Function 定義的函數是沒有arguments對象
 //1 arguments作用一,接受函數的實際參數,可以獲取實際參數的長度,具體的實際參數
 //對於arguments的使用需要在函數體中
 var fun4=function(){
 	Ext.Msg.alert('實際參數長度',arguments.length)
 	Ext.Msg.alert('第一個參數值',arguments[0])
 	return 1;
 }
 console.info(fun4(1,2,3,4))
})

//2 arguments作用二,用於函數的遞歸操作
// 求一個數的階乘
 function fun5(x){
 	if(x==1){
 		return 1;
 	}else{
 		// 一般可以這樣寫,但是不夠嚴謹
 		return x*fun5(x-1)
 		//最標準的寫法
 		return x*arguments.callee(x-1) 
 	}
 
 }

3 閉包

主要需要理解的概念執行環境、作用域鏈、js垃圾回收

主要的作用是避免使用全局變量

//函數碰到return直接返回、沒有renturn 返回結果undefined
//在javascript語言裏: 更不提倡使用全局變量 (1:不安全、2:做變量搜索查找的時候效率比較低)
//通過閉包可以保留具備變量的值
//避免使用全局變量 點擊按鈕 統計點擊的次數
var inp=function(){
	var i=0;
	return {
	  getCount:function(){
	  	alert(++i);
	  }
	}
}()

<input type="button" onclick="inp.getCount()" value="按鈕"/>

4 區別

//函數定義的區別
 // 通過function語句定義的,會在執行javascript代碼前優先加載 function定義的函數
 // 通過函數直接量、構造函數定義的則會從上到下依次執行
 // 1 演示在代碼中先執行函數,後定義函數
 //執行函數代碼
 //這段代碼不會報錯,因爲function定義的函數優先加載
 console.info(fun6(4,5));
 function fun6(x,y){
 	return x*y
 }
 // 使用函數直接量,則報錯undefined
/* console.info(fun7(4,5));
 var fun7=function (x,y){
 	return x*y
 }*/
 
 //使用構造函數,同樣報錯undefined 
/* console.info(fun8(6,7));
 var fun8=new Function('x','y','return x+y;')*/
 
//作用域區別
// 通過構造函數創建,具有頂級作用域,只能取window對象定義的變量,全局變量
  var b=1
  function test(){
   var b=2
   // 這種方式優選局部變量,然後纔是全局變量 
   var f=function(){return b};
   alert(f())
   // 只能與全局變量
   var s=new Function("return b;")
   alert(s())
  }
 console.info(test())

5 apply call函數

call apply 主要作用是綁定作用域

this 關鍵字,在javascript中,總是指向調用者,誰調用函數,this就指向誰

apply第一個參數是對象,第二個參數是數組表示實際參數

call 第一個參數是對象,後面是實際參數

 // call apply 主要作用是綁定作用域
 // this 關鍵字,在javascript中,總是指向調用者,誰調用函數,this就指向誰
 
 //這個變量是屬於window的,全局變量
 var color='red' 
 // 定義一個obj,對象,有一個color屬性
 var obj={'color':'blue'}
 
 var fun12=function(x,y,z){
 	//指向調用者的color屬性
    alert(this.color)
    return x+y+z
 }
 // window 調用,返回red
 fun12();
 //obj對象調用,返回blue
 //call 第一個參數是對象,後面是實際參數
console.info(fun12.call(obj,1,2,3))
// apply第一個參數是對象,第二個參數是數組表示實際參數
console.info(fun12.apply(obj,[1,2,4]))



發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章