JavaScript(JS)函数调用的4种方式

上一节我们深入学习了JS函数参数的arguments对象，本节我们将深入学习调用JS函数的4种方式：

1. 最简单的方式，作为一个函数被调用：

/*作为一个函数被调用*/
function f()
{
  console.log('Hello JS!');
  
}
f();//输出“Hello JS!”

2.方法调用：将函数作为对象的方法进行调用。

const obj = {
brand:"Dotcpp编程",
address:"dotcpp.com",
f(){
  console.log(`${this.brand}:${this.address}`);
}
}
obj.f();//打印“Dotcpp编程：dotcpp.com”

3.构造函数调用：使用new关键字创建对象实例时，会自动调用构造函数。

/*作为构造器调用*/
function dotcpp_user(name,age,grade)
{
  this.name=name;
  this.age=age;
  this.grade=grade;
}
const user01=new dotcpp_user('user01',18,100)
const user02=new dotcpp_user('user02',18,100)
const user03=new dotcpp_user('user03',18,100)
console.log(user01);//dotcpp_user {name: 'user01', age: 18, grade: 100}
console.log(user02);//dotcpp_user {name: 'user02', age: 18, grade: 100}
console.log(user03);//dotcpp_user {name: 'user03', age: 18, grade: 100}

4.间接调用：使用call()或apply()方法来间接调用函数，并指定函数内部的this值。

/*通过apply、call来更改this指向，进行speak函数的不同输出*/
const JS = { course: "JS" };
const CPP = { course: "C++" };
const Java = { course: "Java" };

function speak() {
  console.log(this.course);
}

speak.call(JS);    // 输出: JS
speak.apply(CPP);  // 输出: C++
speak.call(Java);  // 输出: Java

在JS函数调用过程中，还有一些特殊的情况需要注意：

1.如果没有明确指定this值，严格模式下函数内部的this将为undefined，非严格模式下this将指向全局对象（浏览器环境下为window）。

2.函数可以接收参数，在调用时传递给函数。

3.函数可以返回值，调用时可以接收函数的返回值。

JS中函数调用时需要注意一些常见的问题，下面我们通过表格展示：

总结：本节我们详细介绍了如何调用JS中的函数，同时分析了JS函数调用的常见错误，希望读者养成合法调用函数的习惯。