简单的JavaScript函数及闭包

原创已于 2024-02-18 11:47:10 修改 · 421 阅读

9 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #开发语言 #前端

于 2024-02-16 17:19:50 首次发布

本文详细介绍了JavaScript中函数的声明方法，包括基本用法、匿名函数、立即调用函数表达式、函数嵌套和闭包概念。同时提供了闭包和箭头函数的实例，并给出了练习题目，如测试代码工具和计数器函数的创建。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

🌷简单的JavaScript闭包函数练习总结

函数语法

在 JavaScript 中，声明函数有两种主要方法。其中之一是使用function关键字。

基本用法

function f(a,b){
    const sum = a + b;
    return sum;
}
console.log(f(3.4));//7

f是函数的名称。(a, b)是论据。您可以在正文中编写任何逻辑并最终得到return结果。您可以不返回任何内容，而是会隐式返回undefined。

匿名函数

也可以选择排除关键字后的函数名称function

const f = function(a,b){
    const sum = a + b;
    return sum;
}
console.log(f(3,4));//7

立即调用函数表达式

const result = (function(a, b){
    const sum = a + b;
    return sum;
})(3,4);
console.log(result);//7

函数中的函数

function cretaeFunction(){
    function f(a,b){
        const sum = a + b;
        return sum;
    }
}
const result = createFunction();
console.log(result(3));

功能提升

JavaScript 有一个称为提升的功能，有时可以在初始化之前使用函数。仅当使用语法声明函数时才能执行此操作function

function createFunction() {
    return f;
    function f(a, b) {
        const sum = a + b;
        return sum;
    }
}
const f = createFunction();
console.log(f(3, 4)); // 7

闭包

JavaScript 中的一个重要主题是闭包的概念。创建函数时，它可以访问对其周围声明的所有变量的引用，也称为它的词法环境。函数及其环境的组合称为闭包。这是该语言的一个强大且经常使用的功能。

function createAdder(a){
    function f(b){
        const sum = a + b;
        reture sum;
    }
    return f;
}
const f = createAdder(3);
console.log(f(4));//7

箭头函数

声明函数的另一种常见方法是使用箭头语法。在许多项目中，它是首选语法。

const f = (a,b) => {
    const sum = a + b;
    return sum;
};
console.log(f(3.4));//7

附：练习

存在与否

🍂 编写一个函数来帮助开发人员测试其代码。它应该接受任何值，并返回一个具有以下两个函数的对象。expect val

toBe(val)接受另一个值，如果两个值彼此相同，则返回。如果它们不相等，则应抛出错误。true === "Not Equal"

notToBe(val)接受另一个值，如果两个值彼此相同，则返回。如果它们相等，则应抛出错误。true !== "Equal"

var expect = function(val) {
    return {
        toBe:(valOne)=>{
            if(val===valOne){
                return true;
            }else{
                throw new Error("Not Equal");
            }
        },
        notToBe:(valTwo)=>{
            if(val !==valTwo){
                return true;
            }else{
                throw new Error("Equal");
            }
        }
    }
    
};

/**
 * expect(5).toBe(5); // true
 * expect(5).notToBe(5); // throws "Equal"
 */

计数器

🍂编写一个函数。它应该接受一个初始整数。它应该返回一个具有三个函数的对象。createCounter init

这三个功能是：

increment()将当前值增加 1，然后返回它。
decrement()将当前值减小 1，然后返回它。
reset()将当前值设置为，然后返回该值。init

var createCounter = function(init) {
    var alInit=init;
    return {
        increment:()=>{
            return ++init;
        },
        decrement:()=>{
            return --init;
        },
        reset:()=>{
            init=alInit
            return init;
        }
    }
    
};
/**
 * const counter = createCounter(5)
 * counter.increment(); // 6
 * counter.reset(); // 5
 * counter.decrement(); // 4
 */