向对象声明中添加函数名称有什么好处？

Question

For instance, when I assign a function as a property of an object declaration, my loader for Webpack, which is babel-loader, will automatically add a function name? For instance, let's say I have the following compare function:

var utils = {
  compare: function (a, b) {
    if (parseFloat(a[0]) - parseFloat(b[0]) === 0) {
      return parseFloat(a[1]) - parseFloat(b[1]);
    }
    else {
      return parseFloat(a[0]) - parseFloat(b[0]);
    }
  }
}

Webpack will compile it to the following:

var utils = {
  compare: function compare(a, b) {

    if (parseFloat(a[0]) - parseFloat(b[0]) === 0) {
      return parseFloat(a[1]) - parseFloat(b[1]);
    } else {
      return parseFloat(a[0]) - parseFloat(b[0]);
    }
  }
}

[compare: function (a,b) has been changed to compare: function compare (a,b)]

Answer 1

It's just a good practice to name all your functions for debugging and recursion purposes. Babel does that on the transpiled code with the loader, is not Webpack's work.

Answer 2

In the code you posted in the question there would indeed be little to no benefit. However, to recursively call an anonymous function you need to give it a name (at least in newer versions of javascript). This syntax has a name. It's called the named function expression .

In older versions of javascript, the arguments object has a property called .callee that refers to the function. This could be used to recurse into an anonymous function:

var sum = function(numbers){
    var n = numbers.pop();
    if (numbers.length) {
        return n + arguments.callee(numbers);
    }
    return n;
}

The arguments.callee property has been deprecated in ES5. Therefore in current (and newer) versions of javascript you need to use a named function expression to do recursion on an anonymous function:

var sum = function s (numbers){
    var n = numbers.pop();
    if (numbers.length) {
        return n + s(numbers);
    }
    return n;
}

---

Note, that according to the specification, the name of a named function expression is private to the function itself. Therefore, in a non-buggy javascript interpreter/compiler the second example above should not create a function named s() outside of the anonymous function sum() . However, some ES4 implementations (older browsers) were known to be broken and would create both s() and sum() . Apart from the name leak the named function expression syntax works in all browsers released in the last 10 years or so.