JavaScript 確實很靈活，但也帶來了一些混亂。例如，你可以使用多種方式來做同一件事情，例如建立函數、物件等。那麼標題中提到的兩者有什麼差別呢？
new Function 是另一種建立函數的方式，其語法：
const func = new Function ([arg1, arg2, ...argN], functionBody);
一個簡單的例子：
const sum = new Function('a', 'b', 'return a + b');
sum(1 + 2); // 3
嗯，這提供了很大的靈活性。這並不常見，但在某些情況下可以使用它。例如，當我們需要將模板動態編譯為函數時，我們可以使用它，據我所知，這就是 Vue.js 所做的。除此之外，如果我們需要從伺服器接收程式碼字串來動態建立函數，也可以使用它。
讓我們快速談談它的特點。看看下面的程式碼會輸出什麼？
globalThis.a = 10;
function createFunction1() {
const a = 20;
return new Function('return a;');
}
function createFunction2() {
const a = 20;
function f() {
return a;
}
return f;
}
const f1 = createFunction1();
console.log(f1()); // ?
const f2 = createFunction2();
console.log(f2()); // ?
答案是10和20。這是因為new Function總是在全域範圍內建立函數。運行時只能存取全域變數和它們自己的局部變數。
而 new function() 的目的是建立一個新物件並應用匿名函數作為建構子。例如下面的例子：
const a = new (function () {
this.name = 1;
})();
console.log(a); // { name: 1 }
就是這樣。實際上，每個 JavaScript 函數都是一個 Function 對象，換句話說，(function () {}).constructor === Function returns true。
關聯的一個知識點是如何使用new Function()建立非同步函數？ MDN給了我們答案：
// Since `AsyncFunction` is not a global object, we need to get it manually:
const AsyncFunction = (async function () {}).constructor;
const fetchURL = new AsyncFunction('url', 'return await fetch(url);');
fetchURL('/')
.then((res) => res.text())
.then(console.log);
如果您發現這有幫助，請考慮 訂閱我的電子報 以獲取更多有關 Web 開發的有用文章和工具。感謝您的閱讀！
以上是JavaScript 中 new Function() 和 new function() 的差異的詳細內容。更多資訊請關注PHP中文網其他相關文章！
