JavaScript 函数
在 JavaScript 中,函数(Function) 是一组执行特定任务或计算的语句的集合。函数是 JavaScript 中非常重要的一部分,它允许你封装代码,复用代码,提高代码的可维护性。
1. 函数的定义
a. 函数声明
使用 function 关键字来声明一个函数,函数声明包括函数名、参数列表和函数体。
function greet() {
console.log("Hello, World!");
}
greet(); // 输出:Hello, World!
b. 函数表达式
函数表达式是将一个函数赋值给变量。它可以是匿名的(没有函数名)或具名的(有函数名)。
let greet = function() {
console.log("Hello, World!");
};
greet(); // 输出:Hello, World!
c. 箭头函数(ES6 引入)
箭头函数是函数表达式的一种简洁写法。它不使用 function 关键字,并且没有自己的 this。
let greet = () => {
console.log("Hello, World!");
};
greet(); // 输出:Hello, World!
如果箭头函数只有一个参数,且不需要大括号,则可以省略括号和函数体的大括号。
let square = (x) => x * x;
console.log(square(5)); // 输出:25
2. 函数参数
函数可以接受参数,也叫输入值,这些参数在函数体内使用。参数在函数声明时定义,并且可以传递多个参数。
function greet(name) {
console.log("Hello, " + name);
}
greet("Alice"); // 输出:Hello, Alice
如果函数调用时没有传递某个参数,那么该参数的默认值是 undefined。
function greet(name = "Guest") {
console.log("Hello, " + name);
}
greet(); // 输出:Hello, Guest
greet("Bob"); // 输出:Hello, Bob
参数的个数:
JavaScript 允许传递任意数量的参数,甚至超出函数声明中的参数个数。
function sum(a, b) {
return a + b;
}
console.log(sum(1, 2)); // 输出:3
console.log(sum(1, 2, 3, 4)); // 输出:3,因为额外的参数会被忽略
3. 返回值
函数可以返回一个值。return 语句用于返回函数的结果,函数执行到 return 语句时会停止。
function add(a, b) {
return a + b;
}
let result = add(2, 3);
console.log(result); // 输出:5
如果没有 return 语句,或者 return 后没有值,函数默认返回 undefined。
function greet() {
console.log("Hello!");
}
let result = greet(); // 没有返回值
console.log(result); // 输出:undefined
4. 函数的作用域和闭包
- 作用域:每个函数都有自己的作用域。函数内部的变量不能在外部直接访问,而外部的变量也不能直接在函数内部修改。
- 闭包:函数可以访问它外部的变量,即使外部函数已经执行完毕。闭包可以帮助我们保持对外部变量的引用。
例子:
function outer() {
let outerVar = "I'm from outer function";
function inner() {
console.log(outerVar); // 可以访问 outer() 的变量
}
return inner;
}
let closure = outer();
closure(); // 输出:I'm from outer function
5. 函数的 this
在函数中,this 关键字指向调用该函数的对象。对于普通函数,this 指向全局对象(浏览器中是 window)。对于方法函数,this 指向调用该方法的对象。
例子:
function greet() {
console.log(this);
}
greet(); // 输出:window (浏览器环境下)
如果函数是作为对象方法调用的,this 指向该对象。
let person = {
name: "Alice",
greet: function() {
console.log("Hello, " + this.name);
}
};
person.greet(); // 输出:Hello, Alice
箭头函数中的 this
箭头函数不会创建自己的 this,它会继承外部函数的 this。
let person = {
name: "Alice",
greet: function() {
let innerGreet = () => {
console.log("Hello, " + this.name);
};
innerGreet();
}
};
person.greet(); // 输出:Hello, Alice
6. 函数的递归
递归是指一个函数直接或间接地调用自身。递归函数必须有一个终止条件,否则会造成无限调用。
例子:
计算阶乘(n!)的递归函数:
function factorial(n) {
if (n === 0) { // 终止条件
return 1;
}
return n * factorial(n - 1);
}
console.log(factorial(5)); // 输出:120
7. 匿名函数
匿名函数是没有名称的函数,通常用于作为参数传递给其他函数或事件处理程序。
setTimeout(function() {
console.log("Hello after 2 seconds");
}, 2000); // 2秒后输出:Hello after 2 seconds
8. 函数表达式与函数声明的区别
- 函数声明:在函数声明之前就可以调用,因为 JavaScript 引擎会将函数声明提升到代码顶部。
- 函数表达式:只能在函数定义后调用,因为函数表达式是在代码执行时定义的。
例子:
myFunc(); // 可以正常调用,因为函数声明会提升
function myFunc() {
console.log("Function declaration");
}
myFunc2(); // 报错:myFunc2 is not a function,因为函数表达式不提升
var myFunc2 = function() {
console.log("Function expression");
};
9. 总结
- 函数是 JavaScript 中的基本构建块之一,允许你封装一组操作并复用代码。
- 可以使用 函数声明、函数表达式 或 箭头函数 定义函数。
- 函数支持 参数 和 返回值。
this关键字指向调用函数的上下文对象。- 闭包 允许函数访问其外部作用域中的变量。
- 可以通过递归来实现一些复杂的操作,如计算阶乘。
更多详细内容请关注其他相关文章!