在JavaScript中，可以通过检查函数内的this值或使用new.target元属性来判断函数是通过new关构造调用还是作为普通函数调用。当函数通过new关键字调用时，this会指向一个全新的对象，而当函数正常调用时，this通常指向全局对象或者undefined(在严格模式下)。new.target在通过new操作符调用函数时会返回一个引用该函数的引用，而普通函数调用时new.target是undefined。
通过this值来判断的方法主要是基于构造函数的特性。构造函数设计的初衷是创建一个具有特定原型的新对象，当使用new操作符调用时，构造函数内的this指向新创建的对象。相比之下，普通函数调用不会创建新对象，this的值取决于调用上下文（或为全局对象，或在严格模式下为undefined）。通过识别这点，可以在函数内部编写逻辑来判断函数的调用方式。
new.target属性，它在函数体内部可用，提供了一种直接的方式来检测函数是否被作为构造器调用。在构造器中（即通过new调用），new.target指向构造器或派生类的构造函数。对于普通函数调用，new.target值为undefined。
现在，我们将对如何使用这些方法进行详细讨论。
一、使用 this 判断调用方式
在JavaScript中，当使用new运算符调用函数时，该函数内部的this将指向一个新创建的对象，该对象原型指向函数的prototype属性。以下为一个利用this来判断的示例：
function MyFunction() {
if (this instanceof MyFunction) {
// 这里的逻辑是当函数被当作构造器调用时执行
console.log('通过 new 调用');
} else {
// 这里的逻辑是当函数被当作普通函数调用时执行
console.log('通过普通调用');
}
}
// 测试函数调用
new MyFunction(); // 输出：通过 new 调用
MyFunction(); // 输出：通过普通调用
二、使用 new.target 判断调用方式
ES6 引入的 new.target 属性提供了另一种更直接的方式来检测函数是否通过new调用。在函数体内，new.target 属性会返回一个对当前类或函数的引用。对于普通函数调用，new.target 为 undefined。
function MyFunction() {
if (new.target) {
console.log('通过 new 调用');
} else {
console.log('通过普通调用');
}
}
new MyFunction(); // 输出：通过 new 调用
MyFunction(); // 输出：通过普通调用
三、注意事项与限制
虽然使用this和new.target可以有效地判断函数调用方式，但也有一些注意事项和限制需要考虑。使用this判断时，必须考虑到不同执行环境对this的影响。例如，在严格模式下，未绑定的函数调用中this会是undefined，导致与new调用进行区分变得复杂。此外，当函数被用作方法或通过Function.prototype.apply/call/bind方法调用时，this的值也会受到影响。
使用new.target比较直接，它不受执行环境的影响。然而，需要注意的是，new.target是ES6中引入的特性，如果你在不支持ES6的环境中工作，将无法使用它。此外，new.target无法在普通函数（非构造器）中区分是否通过.apply()、.call()或.bind()方法调用，因为这些方法并不会更改new.target的值。
四、实际应用
了解了如何判断函数调用方式后，我们可以将这些知识应用于实际开发中。例如，在开发中，你可能会创建一个既可以作为构造函数使用也可以通过直接调用返回实例的函数。这种模式在JavaScript库中非常常见，比如jQuery：
function Library(selector) {
if (new.target) {
this.elements = document.querySelectorAll(selector);
} else {
return new Library(selector);
}
}
// 可以作为构造函数使用
const obj = new Library('div');
// 也可以直接调用函数来得到新对象
const sameObj = Library('div');
在这个示例中，Library函数既可以通过new操作符构造实例，也可以不使用new产生相同的结果，使得函数使用起来非常灵活。
综上所述，JavaScript提供了两种方式来检测函数调用的类型，根据需要选择合适的方法可以提高代码的健壮性和灵活性。
相关问答FAQs：
如何判断JavaScript中的函数是通过new调用还是普通调用？
-
有什么区别在于使用new关键字调用函数和普通调用函数的区别？
当使用new关键字调用一个函数时，会创建一个新的对象并将其用作函数的this上下文。而普通调用函数则不会创建新的对象，this的值取决于调用函数时的上下文。 -
有没有可以识别通过new调用函数和普通调用函数的方法？
在JavaScript中，可以通过判断函数内部的this值来确定函数是通过new调用还是普通调用。当函数通过new调用时，this的值会指向新创建的对象；而当函数通过普通调用时，this的值取决于调用函数时的上下文。 -
有什么常见的技巧可以判断函数是通过new调用还是普通调用？
一种常见的技巧是使用构造函数的名称来判断函数是通过new调用还是普通调用。通过在函数内部检查构造函数的名称是否与函数的名称相同，可以确定函数是通过new调用还是普通调用。另外，可以检查函数内部是否有其他特定的标志或属性来判断函数的调用方式。例如，可以检查函数内部是否有某个固定的参数或属性，如果存在，则说明函数是通过new调用。
注意：在实际开发中，应当尽量避免依赖函数的调用方式来实现逻辑，而是通过明确的代码设计和使用约定来确保函数的正确调用方式。
