JavaScript函数四种调用方式深度解析

完全一样的，只是调用方式不同。在方法调用模式中，`this` 关键字不再指向全局对象（在浏览器环境中即 `window`），而是指向调用该方法的对象，也就是 `o`。所以在这个例子中，`this` 指向的是 `{fn: func}` 这个对象。 三、构造器调用形式 构造器调用是通过 `new` 关键字来创建一个新的对象实例，并执行函数体。在这种模式下，函数通常作为类的构造函数来使用，用于初始化新创建的对象。例如： ```javascript function Person(name) { this.name = name; console.log(this); } var person = new Person("Alice"); ``` 在这里，`Person` 函数被用作构造器，`new` 关键字创建了一个新的 `Person` 实例，`this` 关键字在函数内部指向这个新创建的对象。因此，`this.name = name;` 会把参数 `name` 赋值给新对象的 `name` 属性。 四、apply/call/bind 调用形式 这三种调用形式都允许我们改变函数中 `this` 的指向。`apply` 和 `call` 都可以立即调用函数，并设置 `this` 的值，而 `bind` 返回一个新的函数，其 `this` 值被绑定到指定的对象。它们的主要区别在于传递参数的方式： - `apply` 接收两个参数：`this` 的值和一个数组或类数组对象，数组的元素会被作为单独的参数传递给函数。 - `call` 也接收 `this` 的值，但后面的参数会直接传递给函数，不用包裹在数组中。 - `bind` 不调用函数，而是返回一个新的函数，这个函数在被调用时 `this` 将被绑定到传入 `bind` 的第一个参数。 例如： ```javascript function sayHello(name) { console.log('Hello, ' + this.user + ', ' + name); } var user = 'Alice'; sayHello.call({ user: 'Bob' }, 'Charlie'); // 输出 "Hello, Bob, Charlie" sayHello.apply({ user: 'Bob' }, ['Charlie']); // 输出同上 var boundSayHello = sayHello.bind({ user: 'Bob' }); boundSayHello('Charlie'); // 输出 "Hello, Bob, Charlie" ``` 总结： 理解 JavaScript 中函数的四种调用方式对于深入掌握 JavaScript 的运行机制至关重要。每种调用方式都有其特定的用途，比如构造器用于对象实例化，`apply`、`call` 和 `bind` 则提供了更大的灵活性，能够根据需要调整 `this` 的指向。在实际开发中，熟练运用这些调用形式能帮助我们编写更加灵活和高效的代码。