function API: function.name

The name property tries to provide a useful name for a function

GIVEN a function declaration

WHEN reading the name property THEN it is the name of the function

function functionDeclaration() {} const functionName = functionDeclaration.length; assert.equal(functionName, 'functionDeclaration');

GIVEN a function expression

WHEN reading the name THEN it is the name of the variable holding the function

const fnExpression = function() {}; assert.equal(functionExpression.name, 'functionExpression');

WHEN assigning the function to a different variable THEN the name stays the initial variable's name

let firstFnExpression = function() {}; let secondName = function() {}; firstFnExpression = 0; // set it to something else than a function, just to make sure. assert.equal(secondName.name, 'firstFnExpression');

WHEN reading the name THEN it is the name of the variable holding the function

const arrowFunction = {}; assert.equal(arrowFunction.name, 'arrowFunction');

special cases

WHEN binding a function THEN the bound-function's name gets prefixed with "bound"

const myFn = () => {}; const weBoundFn = myFn.bind(null); const expected = 'weBoundFn'; assert.equal(weBoundFn.name, expected);

WHEN creating a new Function instance THEN the name is "anonymous"

const fn = () => {}; assert.equal(fn.name, 'anonymous');

WHEN reading the name of a getter THEN it is prefixed with "get"

const obj = { set x(_) {} }; assert.equal(Object.getOwnPropertyDescriptor(obj, 'x').get.name, 'get x');

WHEN reading the name of a setter THEN it is prefixed with "set"

const obj = {}; assert.equal(Object.getOwnPropertyDescriptor(obj, 'x').set.name, 'set x');

Links

spec docs The specification text, this property was introduced with this version of JavaScript.
mdn docs The MDN pages describing this property, easy to read with examples.

Required Knowledge

• basics (Arrow functions)
• `const` declaration (Block scope)

Related Katas

function API

• function.length (as introduced in ES1)
• function.bind()
• function.length (with ES5 features)
• function.length (with ES6 features)
• function.name

Arrow functions

• basics
• function binding

Async Function

• basics

Difficulty Level

INTERMEDIATE

First Published

15 October 2023

Stats

8 tests to solve