JavaScript函数调用模式

在JavaScript中共有4种函数调用模式:函数调用模式、方法调用模式、构造器调用模式、apply/call调用模式

1.函数调用模式:作为函数被直接调用,最简单易懂的方式。
这是最常见的模式,只需在函数名后面加上()即可。

function myFunc(){};
myFunc();

2. 方法调用模式:作为方法被对象调用,即面向对象编程。
在这种模式中,函数是对象的属性,调用函数即为调用该对象的方法。

var obj = {};
obj.func = function(){};
obj.func();

除了由对象调用外,该模式与函数调用模式最大的不同在于this的指向不同。
函数调用模式的this指向window,因为它是直接使用的,函数的上下文是全局的上下文。
方法调用模式的this即为方法所属的对象。

3.构造器调用模式:作为构造器,在构造的过程中,创建新的对象。
构造器调用模式具有以下特点:(1)创造一个新的对象;(2)将这个对象传递给构造器作为this参数。
使用构造器时,我们需要new关键字。

function MyFunc(){this.func = function(){return this;}};

var constructor1 = new MyFunc();
var constructor2 = new MyFunc();
constructor1.func();//返回constructor1;
constructor2.func();//返回constructor2;

可以看出,我们定义了一个函数,但调用了两次构造函数而产生两个不同的实例,这是方法调用模式所不及的地方。并且,在方法调用模式中,this为方法所属的对象,但在构造器调用模式中,this为创建的对象。

4. apply/call调用模式:由函数apply()或call()调用。
在方法调用模式和构造器调用模式中,this虽指向不同但却是固定的,如果我想让this指向任意我所需要的对象,就要用到第四种调用模式了。
apply和call的使用方法类似,在调用一个函数时需传入两个参数:(1)用于作为函数上下文的对象;(2)参数数组或参数列表。

function myFunc(){
	var result = 0;
	for(var i=0;i<arguments.length;i++){
		result += arguments[i];
	}
	this.result = result;
}

var obj1 = {};
var obj2 = {};
myFunc.apply(obj1,[1,2,3]);//obj1.result=6;
myFunc.call(obj2,1,2,3,4);//obj2.result=10;

所有函数在被调用的时候都会隐性的传入两个参数:this和arguments。所谓隐性,即无需我们定义和赋值,由系统自动完成。在使用apply/call时传入的第一个参数即为this对象,如上例apply()中this为obj1,call()中this为obj2。第二个参数为调用myFunc时传给myFunc的参数,虽然在myFunc的“()”内我们没有定义要传入的参数,但我们通过arguments仍可以获取到传入的参数。
在这种模式中,我们既完成了函数的调用,又改变了this对象,而apply和call的不同在于,apply后面的参数是一个数组,call则无需数组,直接用“,”分割。

  • 1
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值