JavaScript - 函数调用
Hello, 未來的 JavaScript 巫師們！今天，我們將深入探索函數調用的神奇世界。別擔心如果你是編程新手——我會成為你這次旅程中的友好指南。在本課結束時，你將能夠像專業人士一樣調用函數！
函数調用
讓我們從基礎開始。到底什麼是函數調用？這只是「呼叫函數」或「運行函數」的一種花哨說法。想像你有一個機器人（那就是你的函數），你正在給它一個命令讓它做某件事。那就是調用！
這裡有一個簡單的例子：
function sayHello() {
console.log("Hello, world!");
}
sayHello(); // 這就是函數調用在這個例子中，我們定義了一個名為 sayHello 的函數，然後我們通過寫上它的名字後跟括號來調用它。當你運行這段代碼時，你會在控制台中看到 "Hello, world!" 被打印出來。
讓我們試一些更具互動性的東西：
function greetUser(name) {
console.log("Hello, " + name + "!");
}
greetUser("Alice"); // 輸出：Hello, Alice!
greetUser("Bob"); // 輸出：Hello, Bob!在這裡，我們的 greetUser 函數接受一個參數 name。當我們調用函數時，我們在括號內傳遞一個參數。然後函數使用這個參數來創建一個個性化的問候。
函数構造器的調用
現在，讓我們來討論一些更進階的內容：函數構造器。這些是用來創建對象的特殊函數。別擔心如果這聽起來很複雜——我會為你分解！
function Person(name, age) {
this.name = name;
this.age = age;
this.greet = function() {
console.log("Hi, I'm " + this.name + " and I'm " + this.age + " years old.");
};
}
var alice = new Person("Alice", 25);
alice.greet(); // 輸出：Hi, I'm Alice and I'm 25 years old.在這個例子中，Person 是我們的函數構造器。我們使用 new 關鍵字來創建一個新的 Person 對象。構造器內部的 this 關鍵字指的是正在被創建的對象。
對象方法的調用
JavaScript 中的對象可以有作為屬性的函數。這些被稱為方法。讓我們看看如何調用它們：
var car = {
brand: "Toyota",
model: "Corolla",
startEngine: function() {
console.log("Vroom! The " + this.brand + " " + this.model + " is starting.");
}
};
car.startEngine(); // 輸出：Vroom! The Toyota Corolla is starting.在這裡，startEngine 是 car 對象的一個方法。我們使用點語法調用它：car.startEngine()。
自調用函數
有時候，我們希望函數在定義後立即運行。這些被稱為自調用函數或立即調用的函數表達式（IIFE）。它們就像一開始就工作的機器人！
(function() {
console.log("I'm running immediately!");
})();
// 輸出：I'm running immediately!這個函數被定義並且立即調用。函數外部的括號和結尾的括號是讓它自調用的原因。
其他調用函數的方法
在 JavaScript 中還有幾種調用函數的方法。讓我們在表中看看它們：
| 方法 | 描述 | 示例 |
|---|---|---|
call() |
使用給定的 this 值和個別提供的參數調用函數 |
func.call(thisArg, arg1, arg2, ...) |
apply() |
與 call() 相似，但參數作為數組傳遞 |
func.apply(thisArg, [arg1, arg2, ...]) |
bind() |
創建一個具有固定 this 值的新函數 |
var boundFunc = func.bind(thisArg) |
讓我們看看它們的使用：
var person = {
fullName: function(city, country) {
console.log(this.firstName + " " + this.lastName + " lives in " + city + ", " + country);
}
}
var john = {
firstName: "John",
lastName: "Doe"
}
// 使用 call()
person.fullName.call(john, "New York", "USA");
// 輸出：John Doe lives in New York, USA
// 使用 apply()
person.fullName.apply(john, ["London", "UK"]);
// 輸出：John Doe lives in London, UK
// 使用 bind()
var johnInfo = person.fullName.bind(john);
johnInfo("Paris", "France");
// 輸出：John Doe lives in Paris, France在這些例子中，我們使用 call()、apply() 和 bind() 來調用 fullName 函數，並使用不同的 this 值和參數。
這就是全部！你剛剛學會了在 JavaScript 中調用函數的各種方法。記住，熟練是需要練習的，所以不要害怕嘗試這些概念。在你意識到之前，你將會像一個有經驗的編程員一樣寫作和調用函數！
開心地編程，願你的函數總是調用成功！??
Credits: Image by storyset