JavaScript的函数调用
函数调用有三种方式:1.直接调用2.call调用3.apply调用一、直接调用直接调用函数是最常见、最普通的方式。这种方式直接以函数附加的对象作为调用者,在函数后括号内传入参数来调用函数。例如下代码:<script>function person(name, age) {this.name = name;this.age = age;...
函数调用有三种方式:
1.直接调用
2.call调用
3.apply调用
一、直接调用
直接调用函数是最常见、最普通的方式。这种方式直接以函数附加的对象作为调用者,在函数后括号内传入参数来调用函数。例如下代码:
<script>
function person(name, age) {
this.name = name;
this.age = age;
this.walk = function() {
document.write("你调用了walk")
}
}
var p = new person("lll", 23)
p.walk();
</script>
调用结果如下图:
像alert()弹框也是一种调用方式,它是调用window对象的alert方法,只不过window可以省略。
二、call调用
函数引用.call(调用者,参数1,参数2)
由此可以得出直接调用函数与通过call()调用函数关系如下:
调用者.函数(参数1,参数2....)=函数.cal(调用者,参数1,参数2...)
例如下代码:
<script>
function person(name, age) {
this.name = name;
this.age = age;
}
var p = new person()
person.call(p, "jjj", 20);
document.writeln(p.age);
document.writeln(p.name);
</script>
call调用函数会把函数和调用者分的很清楚,当函数是一个变量时,依然会把函数作为一个函数引用(变量),而不会把函数作为一个真正的函数
看如下代码:
function each(array, fn) {
for (var index in array) {
//call调用 此时的fn是参数变量,不会当做一个真正的函数
fn.call(window, index, array[index]); //等同于window.fn(index, array[index]) 但是这
//种调用方式会把fn当成一个函数,window里并没有定义fn这个函数所以这种调用方式是不可行的。
}
}
each([23, 45, 67, 89], function(index, elem) {
document.writeln(index + "->" + elem + "<br>");
});
运行结果如下:
三、apply调用
函数引用.cal(调用者,参数1,参数2...) =函数引用.apply(调用者,[参数1,参数2...])
apply调用和call类似,优势是可以结合arguments,arguments是一个封装好的数组
看如下关于arguments代码:
function test() {
console.log(arguments);
var res = "";
for (var item of arguments) {
res += item+",";
}
console.log(res);
}
test("gs", 29, 78, 23, 3);
也就是在test方法里写的数据都会封装在arguments数组里。
看如下如何使用apply的代码:
<script>
var myfun = function(a, b) {
document.writeln("a的值是" + a + "\nb的值是" + b)
}
myfun.call(window, 12, 23); //用call方式调用
myfun.apply(window, [12, 23]); //用apply方式调用
var example = function(c, d) {
myfun.apply(this, arguments); //this代表调用者是example,arguments是把example里的参数封装成了数组
}
example(23, 33); //调用example函数
</script>
结果如图:
在js冒充继承里也用到了call和apply调用,它并不是真正的继承但是有和继承同样的作用。
更多推荐
所有评论(0)