JS中使用apply方法通过不同数量的参数调用函数的方法

前端之家收集整理的这篇文章主要介绍了JS中使用apply方法通过不同数量的参数调用函数的方法前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

方法定义

函数的apply()方法和call方法作用相同,区别在于接收的参数的方式不同。 apply()方法接收两个参数,一个是对象,一个是参数数组。

1、用于延长函数的作用域

示例:

这里通过apply()方法函数动态绑定到了对象o上了,这时this指向o对象,得到结果"blue"。

2、对象不需要与方法有任何耦合关系

下面举个耦合的例子,看如何通过apply来解决这种耦合。

这里先将函数放到了对象o中,这里对象和方法就紧耦合到一起了,方法调用必须通过对象o。

没有使用apply()和call()方法那样灵活。 重构上面代码,得到前例中的代码

这里对象并没有绑定任何方法,只是在需要使用的时候,利用函数的apply或call方法来动态绑定。

对象和方法之间没有耦合在一起。这里还可以通过ES5提供的bind()方法来完成

3、实现可变参数函数传参

下面一个计算任意数量数字平均值的函数

average函数是一个称为可变参数或可变元函数(函数的元数是指其期望的参数个数)的例子。

当然这个函数也可以写成一个接收数组的形式。

使用可变参数的函数更简洁、优雅。可变参数函数具有便捷的语法,至少让调用者预先明确地知道提供了多少个参数。

如果我有这样一个数组

scores=getAllscores();

函数计算平均值呢?

1.可变参数函数版本。

这时就可以和apply()方法配合使用,这里因为函数并没用引用this变量,因此第一个参数我们传入一个null。代码如下:

scores=getAllscores(); average.apply(null,scores);

2.直接参数为数组的形式

这里可以直接传入数组参数。

scores=getAllscores(); averageOfArray(scores);

以上两种形式,个人觉得都是可以,反而第二种更简单。多知道一种方法,对于遇到别人写的函数时,可以轻松应对,不需要重构代码。这个好处反而更多。

4、实现可变参数方法的传值

示例:buffer对象包含一个可变参数的append方法,该方法添加元素到函数内部的state数组中。

这时append方法可以接受任意多个参数。

形式如

借助apply方法的this参数,我们可以指定一个可计算的数组调用append方法

注意:这里的buffer很重要,如果传递不同的对象,则append方法将尝试修改错误对象的state属性

提示

•使用apply方法指定一个可计算的参数数组来调用可变参数的函数 •使用apply方法的第一个参数给可变参数的方法提供一个接收者

average函数

averageOfArray函数

ES5 bind()方法

这个方法创建一个函数的实例,其this值会被绑定到传给bind()函数的值。 例如

兼容低版本,参考使用下面的版本 :

原文链接:https://www.f2er.com/js/48274.html

猜你在找的JavaScript相关文章