函数作为返回值

复习闭包时注意到的

function lazy_sum(arr) {
    let sum = function () {
        return arr.reduce(function (x, y) {
            return x + y;
        });
    }
    return sum;
}

当我们调用lazy_sum()时，返回的并不是求和结果，而是求和函数：

let f = lazy_sum([1, 2, 3, 4, 5]); // function sum()

调用函数f时，才真正计算求和的结果：

f(); // 15

在这个例子中，我们在函数lazy_sum中又定义了函数sum，并且，内部函数sum可以引用外部函数lazy_sum的参数和局部变量，当lazy_sum返回函数sum时，相关参数和变量都保存在返回的函数中，这种称为“闭包（Closure）”的程序结构拥有极大的威力。

请再注意一点，当我们调用lazy_sum()时，每次调用都会返回一个新的函数，即使传入相同的参数：

let f1 = lazy_sum([1, 2, 3, 4, 5]);
let f2 = lazy_sum([1, 2, 3, 4, 5]);
f1 === f2; // false

f1()和f2()的调用结果互不影响。

例子
注意区别

<template>
  <div>
   
    <button @click="btnHandler2">点击</button>
  </div>
</template>


<script>
export default {
  data() {
    return {};
  },
  methods: {
    btnHandler1() {
      function add() {
        console.log("执行了add方法");
      }
      return add;//注意这里
    },
    btnHandler2() {
      var a = this.btnHandler1();
      console.log(a);
      console.log(a());
    },
  },
};
</script>

<template>
  <div>
     <button @click="btnHandler2">点击</button>
  </div>
</template>


<script>
export default {
  data() {
    return {};
  },
  methods: {
    btnHandler1() {
      function add() {
        console.log("执行了add方法");
      }
      return add();//注意这里
    },
    btnHandler2() {
      var a = this.btnHandler1();
      console.log(a);
      console.log(a());
    },
  },
};
</script>