欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

JavaScript调用函数的3种方式

程序员文章站 2022-04-05 11:11:54
...
直接调用函数

直接调用函数是最常见、最普通的方式,这种方式直接以函数附加的对象作为调用者,在函数后括号内传入参数来调用函数 这种方式是前面最常见的调用方式 例如如下代码

//调用 window 对象的 alert 方法
window.alert("测试代码") ; 
//调用p对象的 walk 方法
p.walk()
以 call() 方法调用函数

直接调用函数的方式简单、易用,但这种调用方式不够灵活 有些时候调用函数时需要动态地传入一个函数引用,此时为了动态地调用函数,就需要使用 call 方法来调用函数了

<scrip type "text/javascript">
	//定义 each 函数
	var each= function(array, fn) 
	{
		for(var index in array) 
		{
			//以 window 为调用者来调用 fn 函数
			// index array[index] 是传给 fn 函数的参数
			fn.call(null, index, array[index]); 
		}
	}
	//调用 each 函数,第一个参数是数组,第二个参数是fn函数
	each([4 , 20, 3] , function(index , ele) 
	{
		documen.write( "第" + index + "个元素是:" ele + "<br />") ; 
	}) ; 
</script>

上面程序中粗体字代码示范了通过 call( )动态地调用函数,从调用语法来看,不难发现通过 call() 调用函数的语法格式为:

函数引用.call (调用者, 参数1, 参数 2. .)

由此可以得到直接调用函数与通过 call() 调用函数的关系如下:

调用者.函数(参数1 参数2 ...)=函数.call (调用者, 参数1, 参数 2...)
以 apply() 方法调用函数

apply() 方法与 call() 方法的功能基本相似,它们都可以动态地调用函数。apply() 与call()的区别如下

  • 通过 ca ll()调用函数时,必须在括号中详细地列出每个参数
  • 通过 apply()动态地调用函数时, 需要以数组形式一次性传入所有调用参数。

如下代码示范了 call( )与 apply()的 关系

<script type=" text/javascript"> 
	//定义一个函数
	var myfun = function(a, b)
	{ 
		alert("a的值是 :" + a 
			+ "\n b的值是:" + b);
	} 
	//以 call() 方法动态地调用函数
	myfun.call(window, 12 , 23); 
	//以 apply( )方法动态地调用函数
	myfun. apply (window , [12 , 23]);
	var example= function(numl, num2) 
	{ 
		//直接用 arguments 代表调用 example 函数时传入的所有参数
		myfun.apply(this, arguments); 
	}
	example (20,· 40); 
</script>
相关标签: javascript js