WEB开发网
开发学院网页设计JavaScript js function函数用法 阅读

js function函数用法

 2012-11-18 15:20:35 来源:WEB开发网   
核心提示: javascript 函数不同于其他的语言,每个函数都是作为一个对象被维护和运行的,js function函数用法,通过函数对象的性质,可以很方便的将一个函数赋值给一个变量或者将函数作为参数传递, 函数的apply方法,如同该对象拥有此方法,此时this指向该对象,在继续讲述之前,先看一下函数的使用语法:以下是引用片

 javascript 函数不同于其他的语言,每个函数都是作为一个对象被维护和运行的。通过函数对象的性质,可以很方便的将一个函数赋值给一个变量或者将函数作为参数传递。在继续讲述之前,先看一下函数的使用语法:

以下是引用片段:
function func1(…){…}
var func2=function(…){…};
var func3=function func4(…){…};
var func5=new Function();

<script type="text/javascript">

	// 1, 方法调用模式
	// 当一个函数被保存为对象的一个属性时,我们称之它为该对象的一个方法,那么this被绑定到该对象上
	var myObject={ 
		name : "myObject" , 
		value : 0 , 
		increment : function(num){ 
			this.value += typeof(num) === 'number' ? num : 0; 
			return this;
		} , 
		toString : function(){ 
			return '[Object:' + this.name + ' {value:' + this.value + '}]'; 
		} 
	} 
	alert(myObject.increment(10).increment(20).toString());		// [Object:myObject {value:30}]


	// 2, 函数调用模式
	// 当一个函数并非一个对象的函数时,那么它被当作一个函数来调用,this被绑定到全局对象上。这是语言设计的一个错误。倘若语言设计正确,当内部函数调用时,this应该仍然绑定到外部函数的this变量上
	var myObject={ 
		name : "myObject" , 
		value : 0 , 
		increment : function(num){ 
			this.value += typeof(num) === 'number' ? num : 0; 
			return this;
		} , 
		toString : function(){ 
			return '[Object:' + this.name + ' {value:' + this.value + '}]'; 
		}, 
		getInfo: function(){ 
			var self=this; 
			return (function(){ 
				//return this.toString(); 	// 内部匿名函数中this指向了全局对象window, 输出 [object Window] 
				return self.toString();		// 定义一个变量selft并给它赋值为this,那么内部函数通过该变量访问到指向该对象的this
			})(); 
		} 
	} 
	alert(myObject.increment(10).increment(20).toString());		// [Object:myObject {value:30}]


	// 3, 构造器调用模式 
	// JavaScript是一门基于原型继承的语言, 这意味着对象可以直接从其他对象继承属性, 该语言是无类别的。 
	// 如果一个函数前面带上new来调用,那么将创建一个隐藏连接到该函数的prototype成员的新对象,同时this将会被绑定到构造函数的实例上。 
	function MyObject(name){ 
		this.name = name || 'MyObject'; 
		this.value=0; 
		this.increment = function(num){ 
			this.value += typeof(num) === 'number' ? num : 0; 
		}; 
		this.toString = function(){ 
			return '[Object:' + this.name + ' {value:' + this.value + '}]'; 
		} 
		this.target = this; 
	} 
	
	MyObject.prototype.getInfo = function(){ 
		return this.toString(); 
	} 

	// 同时创建一个MyObject.prototype对象,myObject继承了MyObject.prototype的所有的属性, this绑定到了MyObject的实例上 

	var myObject = new MyObject(); 
	myObject.increment(10); 
	alert(myObject.value);	//10 
	
	var otherObject = new MyObject(); 
	otherObject.increment(20); 
	alert(otherObject.value);	//20 
	
	alert(myObject.target===myObject); 	//	ture 
	alert(myObject.target.getInfo());	// [Object:MyObject {value:10}]

	
	// 4, Apply 调用模式 
	// JavaScript是一门函数式的面向对象编程语言,所以函数可以拥有方法。 函数的apply方法,如同该对象拥有此方法,此时this指向该对象。 
	// apply接收两个参数,第一个是要绑定的对象(this指向的对象),第二个是参数数组. 
	function MyObject(name){ 
		this.name = name || 'MyObject'; 
		this.value = 0; 
		this.increment = function(num){ 
			this.value += typeof(num) === 'number' ? num : 0; 
		}; 
		this.toString=function(){ 
			return '[Object:'+this.name+' {value:'+this.value+'}]'; 
		} 
		this.target=this; 
	} 
	function getInfo(){ 
		return this.toString(); 
	} 
	var myObj = new MyObject(); 
	alert(getInfo.apply(myObj));	//[Object:MyObject {value:0}],   this指向myObj 
	alert(getInfo.apply(window));	//[object Window],  this指向window 


	// for and while
	function func(a,b){  
  		alert(a);  // 1
  		alert(b);  // 2
  		
  		for(var i=0;i<arguments.length;i++){  
  			alert(arguments[i]);  	// 1, 2, 1, 2, 3
 	 	}  
  		
  		var i=0;
  		while(i<arguments.length){
  			alert(arguments[i]); 	// 1, 2, 1, 2, 3
  			i=i+1;
  		}
	}  
	func(1,2,3);   
	
	var i=0
	for (i=0;i<=10;i++) {
		document.write("The number is " + i + "<br/>")
	}
	
</script>

Tags:js function 函数

编辑录入:爽爽 [复制链接] [打 印]
赞助商链接