JavaScript高级特性之函数、作用域之概念、用法和高级技巧

103 阅读5分钟

一、JavaScript函数

JavaScript函数是一段可重复使用的代码块,它可以接受参数并返回值。函数可以在任何地方定义和调用,包括全局作用域和局部作用域。

1.1 函数的定义和调用

函数的定义可以使用function关键字,语法如下:

function functionName(parameter1, parameter2, ...) { 
    // 函数体 
    return value; 
} 

其中,functionName是函数的名称,parameter1、parameter2等是函数的参数,函数体是一段可执行的代码块,return语句用于返回函数的值。

函数的调用可以使用函数名称和参数列表,语法如下:

functionName(argument1, argument2, ...);

其中,argument1、argument2等是函数的实际参数,它们会传递给函数的形式参数(parameter1、parameter2等)

1.2 函数的参数

函数的参数可以是任何JavaScript表达式,包括变量、常量、对象、数组、函数等。函数的参数可以有默认值,也可以使用剩余参数语法。

1.2.1 默认参数

默认参数是指在函数定义时为参数指定默认值,如果调用函数时没有传递参数,则使用默认值。

默认参数可以使用等号(=)指定,语法如下:

function functionName(parameter1 = defaultValue1, parameter2 = defaultValue2, ...) { 
    // 函数体 
    return value; 
} 

其中,defaultValue1、defaultValue2等是参数的默认值。

1.2.2 剩余参数

剩余参数是指在函数定义时使用省略号(...)指定一个参数,它可以接受任意数量的实际参数,并将它们存储在一个数组中。

剩余参数可以在函数体中使用,语法如下:

function functionName(...parameters) { 
    // 函数体 
    return value; 
} 

其中,parameters是一个数组,它包含所有传递给函数的实际参数。

1.3 函数的返回值

函数的返回值可以是任何JavaScript表达式,包括变量、常量、对象、数组、函数等。

函数的返回值可以使用return语句指定,语法如下:

function functionName(parameter1, parameter2, ...) { 
    // 函数体 
    return value; 
} 

其中,value是函数的返回值。

1.4 函数的作用域

函数的作用域是指函数内部可以访问的变量和函数的范围。

JavaScript函数有两种作用域:全局作用域和局部作用域。

1.4.1 全局作用域

全局作用域是指在函数外部定义的变量和函数,它们可以在任何地方访问。

全局作用域的变量和函数可以使用window对象访问,语法如下:

var globalVariable = "global variable"; 
function globalFunction() { 
    // 函数体 
} 
console.log(window.globalVariable); // "global variable" 
window.globalFunction(); // 调用全局函数 
1.4.2 局部作用域

局部作用域是指在函数内部定义的变量和函数,它们只能在函数内部访问。

局部作用域的变量和函数可以使用var、let或const关键字定义,语法如下:

function localFunction() { 
    var localVariable = "local variable"; 
    let localLetVariable = "local let variable"; 
    const localConstVariable = "local const variable"; 
    // 函数体 
} 
console.log(localVariable); // 报错,无法访问局部变量 
console.log(localLetVariable); // 报错,无法访问局部变量 
console.log(localConstVariable); // 报错,无法访问局部变量 

1.5 函数的高级用法

JavaScript函数有许多高级用法,包括函数表达式、匿名函数、立即执行函数、箭头函数等。

1.5.1 函数表达式

函数表达式是指将函数赋值给变量或属性,语法如下:

var functionName = function(parameter1, parameter2, ...) { 
    // 函数体 
    return value; 
}; 

其中,functionName是变量或属性的名称,它可以在任何地方使用。

1.5.2 匿名函数

匿名函数是指没有名称的函数,它可以作为参数传递给其他函数或立即执行。

匿名函数可以使用函数表达式定义,语法如下:

var functionName = function(parameter1, parameter2, ...) { 
    // 函数体 
    return value; 
}; 

其中,functionName为空,表示这是一个匿名函数。

1.5.3 立即执行函数

立即执行函数是指定义后立即执行的函数,它可以使用匿名函数和函数表达式定义,语法如下:

(function(parameter1, parameter2, ...) { 
    // 函数体 
    return value; 
})(argument1, argument2, ...); 

其中,(function(){...})是匿名函数的定义,(argument1, argument2, ...)是实际参数的列表,它们会传递给匿名函数的形式参数(parameter1, parameter2, ...)

1.5.4 箭头函数

箭头函数是一种简化的函数定义方式,它可以使用箭头(=>)代替function关键字,语法如下:

(parameter1, parameter2, ...) => { 
    // 函数体 
    return value; 
} 

其中,parameter1、parameter2等是函数的参数,=>表示函数体的开始,value是函数的返回值。

二、JavaScript作用域

JavaScript作用域是指变量和函数的可访问范围。

在JavaScript中,有两种作用域:全局作用域局部作用域

全局作用域是指在整个JavaScript程序中都可以访问的变量和函数。在全局作用域中声明的变量和函数可以被任何函数和代码块访问。

局部作用域是指在函数或代码块中声明的变量和函数。在局部作用域中声明的变量和函数只能在该函数或代码块中访问。

JavaScript中的作用域链是指在函数嵌套中,内部函数可以访问外部函数的变量和函数。作用域链的顶端是全局作用域,底端是当前函数的局部作用域。

在JavaScript中,可以使用var、let和const关键字来声明变量。var关键字声明的变量是函数作用域的,而let和const关键字声明的变量是块级作用域的。

JavaScript中的闭包是指一个函数可以访问其外部函数的变量和函数,即使外部函数已经执行完毕。闭包可以用来创建私有变量和函数,以及实现模块化编程。

JavaScript中的this关键字是指当前执行代码的对象。在全局作用域中,this指向window对象。在函数中,this指向调用该函数的对象。