資料結構
網路
關係型資料庫管理系統
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理學
化學
生物學
數學
英語
經濟學
心理學
社會學
時尚研究
法律研究如何在 JavaScript 中找出呼叫函式？
在本教程中，我們將學習如何在 JavaScript 中找出呼叫函式。函式是可以重複使用的程式碼，使用者可以從任何地方呼叫它。但有時，他們需要知道哪個函式是呼叫者才能執行某些操作。
例如，假設我們可以從其他 2 到 3 個函式呼叫任何單個函式，並且我們需要根據呼叫函式執行某些操作。使用者可以透過以下程式碼示例瞭解這種情況。
function func3 () { If ( caller is func2() ) { // code for some operation } else if ( caller is func1() ){ // code for some different operation } } function func2 () { func3(); } function func1 () { func3(); }
使用上面的示例，使用者可以理解了解呼叫函式的必要性。
這裡，我們有不同的方法來獲取函式名稱。
使用 function.caller 屬性
在這種方法中，我們將使用 JavaScript 中的 function.caller 屬性。
它返回呼叫當前函式的函式的名稱。
如果函式是從頂級 JavaScript 程式碼呼叫的，則返回 null 值。
此外，使用者不能將此方法與嚴格函式和非同步函式一起使用，因為它始終為此類函式返回 null 值。
語法
使用者可以按照以下語法對任何函式使用 caller 屬性。
function_name.caller.name;
引數
Caller 屬性不包含任何引數。
function_name − 它是函式的名稱，使用者希望為其查詢呼叫函式。
示例
在下面的示例中，我們建立了 3 個函式，並從另一個函式呼叫了一個函式。當我們呼叫函式時，我們使用 function.caller.name 屬性在螢幕上呈現呼叫函式。
<!DOCTYPE html>
<html>
<body>
<h3> Finding the function caller name in JavaScript. </h3>
<h4> Caller name for func3():</h4>
<div id="caller1"> </div>
<h4> Caller name for func2(): </h4>
<div id="caller2"> </div>
<script>
let caller1 = document.getElementById("caller1");
let caller2 = document.getElementById("caller2");
function func3() {
caller1.innerHTML += func3.caller.name + " <br/>";
}
function func2() {
caller2.innerHTML += func2.caller.name + " <br/>";
func3();
}
function func1() {
func3();
func2();
}
func1();
</script>
</body>
</html>在上面的輸出中，使用者可以看到它列印了呼叫當前正在執行的函式的函式的名稱。
使用函式的 Arguments 屬性
在 JavaScript 中，每個函式都包含 arguments 物件。每個函式都有自己的 arguments 物件，其中包含函式的屬性，例如函式的呼叫者名稱和函式引數的值。
語法
請按照以下語法使用相應函式的 arguments 物件獲取函式呼叫者名稱。
arguments.callee.caller.name
示例
在下面的示例中，我們使用了 arguments 屬性來查詢函式呼叫者名稱。在這裡，我們建立了兩個函式名稱 child() 和 parent() 函式。此外，我們從 parent() 函式呼叫了 child() 函式。
<html>
<head>
<title> find out the funciton caller name in JavaScript. </title>
</head>
<body>
<h2> Finding the function caller name in JavaScript. </h2>
<h4> Finding the caller name of child() function using arguments property. </h4>
<div id="caller1"></div>
<script>
let caller1 = document.getElementById("caller1");
function child() {
caller1.innerHTML += arguments.callee.caller.name + ". <br/>";
}
function parent() {
child();
}
parent();
</script>
</body>
</html>在控制檯上記錄堆疊跟蹤
使用堆疊跟蹤查詢函式呼叫者名稱是在 JavaScript 中獲取函式名稱最流行的方法。正如堆疊跟蹤名稱所代表的那樣，它是我們在執行程式時活動幀的堆疊。它跟蹤程式的記憶體分配。當呼叫一個新函式時，它進入堆疊跟蹤，因為我們的程式為此函式分配了新的記憶體。
因此，堆疊跟蹤包含錯誤、操作、函式呼叫等的所有詳細資訊。
語法
使用者可以按照以下語法獲取堆疊跟蹤。
console.trace();
示例
在此示例中，我們將在函式中使用上述方法列印堆疊跟蹤以檢查函式的呼叫者名稱。我們可以在控制檯中看到輸出，使用者可以透過按鍵盤上的 ctrl + shift + I 鍵開啟控制檯。
function func3() {
console.trace();
}
function func2() {
func3();
}
function func1() {
func3();
func2();
}
func1();要執行上述程式碼，您應該在本地計算機上安裝了 node JS。使用者可以使用以下命令執行上述程式碼。
命令
node filename.js
輸出
我們已在終端中使用 Node Js 運行了上述程式碼。使用者可以看到上面的輸出。它清楚地表明，在第一個跟蹤中，func3() 僅從 func1() 呼叫，在第二個跟蹤中，它顯示 func2() 從 func1() 呼叫，而 func3() 從 func2() 呼叫。
結論
我們學習了三種查詢呼叫函式名稱的方法。第一種方法最簡單，並且所有現代瀏覽器都支援。第二種方法是最流行的方法，因為它列印整個堆疊跟蹤，並且使用堆疊跟蹤，使用者還可以跟蹤錯誤並輕鬆克服它們。最後一種方法是最古老的。即使某些瀏覽器不支援第三種方法，也建議使用第一種或第二種方法。
7K+ 瀏覽量
