2024-06-02|閱讀時間 ‧ 約 26 分鐘

Javascript入門-Day7:函數

函數的基本結構

JavaScript 中的函數可以用幾種不同的方式定義:函數聲明、函數表達式、箭頭函數和匿名函數。

函數聲明

這是最常見的函數定義方式。

function greet(name) {
console.log("Hello, " + name + "!");
}

函數表達式

將函數賦值給變量。

const greet = function(name) {
console.log("Hello, " + name + "!");
};

箭頭函數

用於簡潔地定義函數,特別是在匿名函數的情境下。

const greet = (name) => {
console.log("Hello, " + name + "!");
};

// 當函數體只有一行語句時,可以省略大括號
const greet = name => console.log("Hello, " + name + "!");

匿名函數

函數沒有名字,可以立即執行,也叫自調用函數。

(function() {
console.log("This is an anonymous function");
})();

函數的呼叫

函數呼叫是指執行函數定義的代碼。可以通過函數名稱加上括號來呼叫函數,並傳遞參數。

function greet(name) {
console.log("Hello, " + name + "!");
}

greet("Alice"); // Hello, Alice!

函數的參數

函數可以接受參數,參數在函數定義時指定,在函數呼叫時傳遞。

單個參數

function greet(name) {
console.log("Hello, " + name + "!");
}

greet("Bob"); // Hello, Bob!

多個參數

function add(a, b) {
return a + b;
}

console.log(add(2, 3)); // 5

預設參數值

可以為參數設置預設值,當呼叫函數時未傳遞該參數,將使用預設值。

function greet(name = "stranger") {
console.log("Hello, " + name + "!");
}

greet(); // Hello, stranger!
greet("Charlie"); // Hello, Charlie!

剩餘參數

可以使用剩餘參數(...args)來處理不定數量的參數。

function sum(...numbers) {
return numbers.reduce((total, num) => total + num, 0);
}

console.log(sum(1, 2, 3)); // 6
console.log(sum(4, 5, 6, 7)); // 22

函數的返回值

函數可以使用 return 關鍵字返回值。返回值可以是任何類型,包括數字、字符串、物件、陣列、甚至是另一個函數。

單個返回值

function add(a, b) {
return a + b;
}

let result = add(2, 3);
console.log(result); // 5

返回物件

function createUser(name, age) {
return {
name: name,
age: age
};
}

let user = createUser("Dave", 30);
console.log(user.name); // Dave
console.log(user.age); // 30

返回函數

function createGreeting(greeting) {
return function(name) {
console.log(greeting + ", " + name + "!");
};
}

let greetHello = createGreeting("Hello");
greetHello("Eve"); // Hello, Eve!

let greetHi = createGreeting("Hi");
greetHi("Frank"); // Hi, Frank!

了解這些函數的基本概念和用法,可以幫助你更靈活地編寫和理解 JavaScript 代碼。

分享至
成為作者繼續創作的動力吧!
© 2024 vocus All rights reserved.