如何從字符串中調用JavaScript函數而不使用est

在 JavaScript 中，eval 並非良策！ MDN 的 eval 頁面指出：> 已過時 此功能已過時。儘管瀏覽器仍然支持它，但在新項目中不建議使用它。盡量避免使用它。

eval 執行包含代碼的字符串，例如：

eval("var x = 'Hello from eval!';");
console.log(x);

eval 會引發一些問題：

1. 安全性：您的字符串可能會被第三方腳本或用戶輸入註入其他命令。
2. 調試：很難調試錯誤——您沒有行號或明顯的故障點。
3. 優化：JavaScript 解釋器不一定能夠預編譯代碼，因為它可能會更改。雖然解釋器效率越來越高，但它幾乎肯定比原生代碼運行速度慢。

不幸的是，eval 功能非常強大，經驗不足的開發人員很容易過度使用此命令。儘管有警告，eval 仍然有效——即使在嚴格模式下——但您通常可以避免它。過去，它主要用於反序列化 JSON 字符串，但我們現在有更安全的 JSON.parse 方法。但是，如果我們有一個字符串中的函數名，例如：

// 我们要运行的函数
var fnstring = "runMe";

function runMe() {
    // 执行操作
}

我們如何在不使用 eval 的情況下執行 runMe() 函數？我最近在使用 HTML5 History API 時遇到了這種情況；pushState 方法不允許您存儲對函數的直接引用，因此您需要將其名稱定義為字符串。使用 Web Workers 或任何其他序列化對象的 API 時，您也可能會面臨類似的挑戰。

最簡單、最安全的無需 eval 的執行解決方案是一系列條件，例如：

// 我们要运行的函数
var fnstring = "runMe";

switch (fnstring) {
    case "functionX": functionX(); break;
    case "functionY": functionY(); break;
    case "functionZ": functionZ(); break;
    case "runMe": runMe(); break;
}

它很安全，但是如果要調用數十個函數，編寫起來效率相當低且令人頭疼。更好的解決方案是使用 window 對象，它引用當前窗口及其中的所有項目。我們可以檢查 fnstring 是否作為 window 中的對象可用，如果它是函數，則運行它，例如：

// 我们要运行的函数
var fnstring = "runMe";

// 查找对象
var fn = window[fnstring];

// 对象是否为函数？
if (typeof fn === "function") fn();

如有必要，您可以執行其他檢查以確保函數具有預期的名稱。如果我們要調用的函數有參數——可能存儲在數組中呢？沒問題；我們只需使用 apply 方法：

// 函数名称和要传递的参数
var fnstring = "runMe";
var fnparams = [1, 2, 3];

// 查找对象
var fn = window[fnstring];

// 对象是否为函数？
if (typeof fn === "function") fn.apply(null, fnparams);

所以這是停止使用 eval 的另一個理由。此外，此解決方案更安全、錯誤更少、更易於調試，並且通常執行速度更快。希望對您有所幫助。

關於在不使用 eval 的情況下從字符串執行 JavaScript 函數的常見問題解答

不使用 eval() 而使用字符串調用 JavaScript 函數的意義是什麼？

JavaScript 中的 eval() 函數是一個強大的工具，允許您執行任意代碼字符串。但是，由於安全性和性能問題，使用 eval() 通常被認為是不好的做法。它可能使您的代碼容易受到注入攻擊。此外，現代 JavaScript 引擎會優化代碼的性能，但它們無法對 eval() 執行的代碼進行優化。因此，了解如何在不使用 eval() 的情況下使用字符串調用 JavaScript 函數非常有益。這可以通過使用 window 對像或 Function 構造函數來實現，它們是更安全、更高效的替代方案。

如何使用 window 對象使用字符串調用 JavaScript 函數？

JavaScript 中的 window 對象表示瀏覽器顯示的窗口。它是瀏覽器環境中的全局對象，所有全局變量和函數都成為 window 對象的屬性和方法。您可以通過將函數作為 window 對象的屬性來訪問，從而使用 window 對象使用字符串調用函數。這是一個示例：

eval("var x = 'Hello from eval!';");
console.log(x);

在此代碼中，“hello”是 window 對象的一個屬性，它引用 hello() 函數。因此，window["hello"] 調用 hello() 函數。

什麼是 Function 構造函數，如何使用它來使用字符串調用函數？

JavaScript 中的 Function 構造函數創建一個新的 Function 對象。這是一種不太常見但仍然有效的方法來定義函數。您可以通過將字符串傳遞給構造函數來使用 Function 構造函數使用字符串調用函數。這是一個示例：

// 我们要运行的函数
var fnstring = "runMe";

function runMe() {
    // 执行操作
}

在此代碼中，Function 構造函數創建一個新的函數，該函數接受兩個參數“a”和“b”，並返回它們的和。參數和函數體作為字符串傳遞。

如果函數是對象的某個方法，我可以使用字符串調用函數嗎？

是的，即使函數是對象的某個方法，您也可以使用字符串調用函數。您可以通過訪問對象的屬性來實現此目的，這與處理 window 對象的方式類似。這是一個示例：

// 我们要运行的函数
var fnstring = "runMe";

switch (fnstring) {
    case "functionX": functionX(); break;
    case "functionY": functionY(); break;
    case "functionZ": functionZ(); break;
    case "runMe": runMe(); break;
}

在此代碼中，“hello”是 obj 對象的一個屬性，它引用 hello() 方法。因此，obj["hello"] 調用 hello() 方法。

使用字符串調用 JavaScript 函數的局限性是什麼？

雖然在某些情況下使用字符串調用 JavaScript 函數可能很有用，但它也有一些局限性。一個限制是它僅適用於全局函數或已知對象的某個方法。如果函數不是已知對象的屬性，則無法使用字符串調用它。另一個限制是您無法直接向函數傳遞參數。如果函數接受參數，則需要將它們包含在字符串中，或者使用其他函數來傳遞它們。儘管有這些限制，但在正確使用時，使用字符串調用函數仍然是一個強大的工具。

以上是如何從字符串中調用JavaScript函數而不使用est的詳細內容。更多資訊請關注PHP中文網其他相關文章！