|
JavaScript函数四种调用模式详解
如遇问题可联系武汉校区 更多学习资源等着你哦~
函数总共有四种调用模式，分别为 函数调用模式、方法调用模式、构造器调用模式、上下文调用模式。这里主要给大家介绍一下四种模式的语法以及其中比较难理解的this指向问题。
函数模式调用语法:函数名(参数)
特例:任何自调用函数(立即执行函数)都是函数模式 // 自调用函数 (function () { console.log(this); })();
方法模式调用概念: 方法本身就是函数,但是方法不是单独独立的调用,而是通过一个对象引导调用 语法: 对象.方法名(参数) var o = {}; o.fn = function () { console.log(this); }; o.fn(); 方法模式调用下的this:方法模式调用下的this就是引导调用该方法的对象。 注意：方法调用一定要有宿主对象。方法一定是某个对象的方法,此对象可以是任何对象。 构造器模式调用语法: 使用new关键字引导 function Person() {
this.name = 'zs';
this.age = 18;
this.gender = '男'
}; // 构造器模式调用 var p = new Person(); 返回值: 1、如果不写return语句,那么 构造函数 默认返回this 2、如果构造函数中写上return,并紧跟基本类型,则忽略基本类型数据,返回this 上下文模式上下文调用模式分为两种:call调用 和apply调用 以及bind 绑定式调用 apply形式语法:函数名.apply(参数) function foo() {
console.log(this);
}
var o = { name: 'zs' }; // 如果需要让函数以函数模式调用, 可以使用 foo.apply(null) 或 foo.apply()
// 如果希望方法模式调用, 需要提供一个宿主对象 foo.apply(o); 使用 apply 进行调用,如果函数是带有参数的. apply 的第一个参数要么是null 要么是对象 如果是 null 就是函数调用, 如果是 对象就是 方法调用, 该对象就是宿主对象. 后面紧跟一个数组参数, 将函数的参数依次放在数组中. function foo(num1, num2) { console.log(this); return num1 + num2; } // 函数调用模式 // var res1 = foo( 123, 567 ); // 方法调用 var o = { name: 'jim' }; // o.func = foo; // var res2 = o.func( 123, 567 ); // 改写成 apply 形式 var res1 = foo.apply(null, [123, 567]); // 函数调用 var res2 = foo.apply(o, [123, 567]); // 方法调用 call形式使用 call 进行调用,如果函数是带有参数的. call 的第一个参数要么是 null要么是对象 如果是 null 就是函数调用, 如果是 对象就是 方法调用, 该对象就是宿主对象. 后面紧跟一个函数的所有参数,使用逗号分隔(和apply功能一模一样,唯一区别就是传参形式不同) function foo(num1, num2) { console.log(this); return num1 + num2; } var o = { name: 'jim' }; // 改写成 call 形式 var res1 = foo.call(null, 123, 567); // 函数调用 var res2 = foo.apply(o, 123, 567); // 方法调用 bind绑定对象实现方法调用function fn() {
console.log(this);
};
var o = {
name: 'zs',
}; var f = fn.bind(o); // 给函数fn绑定了对象 f(); // 虽然是函数调用模式,但是打印的this是绑定的对象,实现了函数的方法调用模式 四种模式this指向
对于函数的上下文调用模式在JavaScript核心代码中使用的非常频繁，这里面比较难理解的就是各种调用的情况下this的指向。只要使用了call和apply调用函数 ，那么函数内部的this 就指向 这两个方法的第一个参数，如果第一个参数没传或者传的是null，那么this指向window。对于bind ，就是绑定一个对象到函数执行上下文环境中，所以使用过bind的函数 ，那么this永远指向 绑定的这个对象，即使是再次使用call和apply也无法改变this的指向了。
另外，对于其他的三种函数调用模式，this指向也是有规律可循，函数调用模式下 this 指向的是window，方法调用模式下 this 指向 调用该方法的对象，而构造器模式调用（即使用new关键字）this默认指向new出来的对象。 | 
收藏
淘帖
踩
