JavaScript函数

时间:2024-10-15 09:24:05

一、 函数的定义

和变量类似,函数必须先定义然后才能使用。

使用 `function` 关键字定义函数。

> function:函数、功能。

【方式 1 函数声明

function fun() {
    // 函数语句块
}

- `function`:定义函数的关键字
- `fun`:函数名(必须符合 JS 标识符命名规则)
- `()`:圆括号中是形参列表,即使没有形参,也必须书写圆括号
- `{}`:花括号内为函数语句块

【方式 2 函数表达式】

var fun = function() {
    // 函数语句块
}
;

- `function(){}`:匿名函数
- `()`:圆括号中是形参列表,即使没有形参,也必须书写圆括号
- `{}`:花括号内为函数语句块
- `fun`:变量(指向一个函数)

风格说明:

​ function fun() {​} // 末尾不需要加 ;

var fun = function() {

}; // 末尾应该加上 ;(因为这是一个赋值语句)

二、函数的调用

执行函数体中的所有语句,就称为 “调用函数”。

调用函数非常简单,只需要在函数名字后书写圆括号对即可。
调用函数 :  fun();    

三、函数声明的提升

和变量声明提升类似,函数声明也可以被提升。

fun();
// 在预解析阶段会被提升
function fun() {
   alert("函数被执行");
}

效果相当于:

function fun() {
   alert("函数被执行");
}
fun();

【函数表达式不能被提升】

fun();  // 报错!
var fun = function() {
   alert("函数不能被执行");
};

解释:函数表达式不能被提升的本质原因是函数表达式定义的其实是个变量,只不过是把函数赋给这个变量,而变量的提升只提升定义,不提升赋值!

还是那个原则:先定义再使用!

四、函数优先提升

可以简单理解为:函数提升程度 > 变量提升程度。

在JavaScript中,“提升”(hoisting)是指变量和函数声明会被移动到其作用域的顶部的行为。然而,需要注意的是,只有声明部分会被提升,而赋值或函数体不会被提升。

函数提升

函数声明会在任何变量声明之前被完全提升,这意味着函数声明不仅会被提升到作用域的顶部,而且整个函数体也会被提升。例如:

console.log(add(1, 2)); // 输出: 3

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

在这个例子中,即使add函数在调用之后才定义,它仍然可以正常工作,因为整个函数声明被提升了。

变量提升

对于变量,只有声明部分会被提升,而初始化(即赋值)不会被提升。例如:

console.log(num); // 输出: undefined

var num = 5;

这里,num的声明被提升到了作用域的顶部,但是赋值没有被提升,所以第一次输出num时会得到undefined

函数表达式与变量提升

如果函数是通过表达式来定义的(即函数表达式),那么它遵循变量提升的规则:

console.log(sum(1, 2)); // 抛出错误:sum is not a function

var sum = function(a, b) {
    return a + b;
};

在这个例子中,虽然sum的声明被提升,但是函数的赋值没有被提升,因此在函数表达式赋值之前尝试调用sum会导致错误。