mozilla

Revision 537555 of Function.name

  • Revision slug: Web/JavaScript/Reference/Global_Objects/Function/name
  • Revision title: Function.name
  • Revision id: 537555
  • Created:
  • Creator: Qantas94Heavy
  • Is current revision? No
  • Comment

Revision Content

{{JSRef("Global_Objects", "Function")}}{{Non-standard_header}}{{harmony}}

Summary

The function.name property returns the name of the function.

Description

The name property returns the name of a function, or an empty string for anonymous functions:

function doSomething() { }

alert(doSomething.name); // alerts "doSomething"

Functions created with the syntax new {{jsxref("Global_Objects/Function", "Function")}}(...) or just {{jsxref("Global_Objects/Function", "Function")}}(...) have their name property set to an empty string. In the following examples anonymous functions are created, so name returns an empty string:

var f = function() { };
var object = {
  someMethod: function() {}
};

alert(f.name == ""); // true
alert(object.someMethod.name == ""); // also true

You can define a function with a name in a {{jsxref("Functions_and_function_scope", "function expression")}}:

var object = {
  someMethod: function object_someMethod() {}
};
alert(object.someMethod.name); // alerts "object_someMethod"

try { object_someMethod } catch(e) { alert(e); }
// ReferenceError: object_someMethod is not defined

You cannot change the name of a function, this property is read-only:

var object = {
  // anonymous
  someMethod: function() { }
};

object.someMethod.name = "someMethod";
alert(object.someMethod.name); // empty string, someMethod is anonymous

Examples

You can use obj.constructor.name to check the "class" of an object:

function a() { }

var b = new a();

alert(b.constructor.name); //Alerts "a"

Specifications

Specification Status Comment
{{SpecName('ES6', '#sec-name', 'name')}} {{Spec2('ES6')}} Initial definition.

.

Browser compatibility

{{ CompatibilityTable() }}

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support {{ CompatVersionUnknown() }} {{ CompatVersionUnknown() }} {{ CompatNo() }} {{ CompatVersionUnknown() }} {{ CompatVersionUnknown() }}
Feature Android Chrome for Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support {{ CompatVersionUnknown() }} {{ CompatVersionUnknown() }} {{ CompatVersionUnknown() }} {{ CompatNo() }} {{ CompatVersionUnknown() }} {{ CompatVersionUnknown() }}

 

Revision Source

<div>
 {{JSRef("Global_Objects", "Function")}}{{Non-standard_header}}{{harmony}}</div>
<h2 id="Summary">Summary</h2>
<p>The <code><strong><em>function</em>.name</strong></code> property returns the name of the function.</p>
<h2 id="Description">Description</h2>
<p>The name property returns the name of a function, or an empty string for anonymous functions:</p>
<pre class="brush:js">
function doSomething() { }

alert(doSomething.name); // alerts "doSomething"
</pre>
<p>Functions created with the syntax <code>new</code> {{jsxref("Global_Objects/Function", "Function")}}<code>(...)</code> or just {{jsxref("Global_Objects/Function", "Function")}}<code>(...)</code> have their name property set to an empty string. In the following examples anonymous functions are created, so <code>name</code> returns an empty string:</p>
<pre class="brush:js">
var f = function() { };
var object = {
  someMethod: function() {}
};

alert(f.name == ""); // true
alert(object.someMethod.name == ""); // also true
</pre>
<p>You can define a function with a name in a {{jsxref("Functions_and_function_scope", "function expression")}}:</p>
<pre class="brush:js">
var object = {
  someMethod: function object_someMethod() {}
};
alert(object.someMethod.name); // alerts "object_someMethod"

try { object_someMethod } catch(e) { alert(e); }
// ReferenceError: object_someMethod is not defined
</pre>
<p>You cannot change the <code>name</code> of a function, this property is read-only:</p>
<pre class="brush:js">
var object = {
  // anonymous
  someMethod: function() { }
};

object.someMethod.name = "someMethod";
alert(object.someMethod.name); // empty string, someMethod is anonymous
</pre>
<h2 id="Examples">Examples</h2>
<p>You can use <code>obj.constructor.name</code> to check the "class" of an object:</p>
<pre class="brush:js">
function a() { }

var b = new a();

alert(b.constructor.name); //Alerts "a"
</pre>
<h2 id="Specifications">Specifications</h2>
<table class="standard-table">
 <tbody>
  <tr>
   <th scope="col">Specification</th>
   <th scope="col">Status</th>
   <th scope="col">Comment</th>
  </tr>
  <tr>
   <td>{{SpecName('ES6', '#sec-name', 'name')}}</td>
   <td>{{Spec2('ES6')}}</td>
   <td>Initial definition.</td>
  </tr>
 </tbody>
</table>
<p>.</p>
<h2 id="Browser_compatibility">Browser compatibility</h2>
<p>{{ CompatibilityTable() }}</p>
<div id="compat-desktop">
 <table class="compat-table">
  <tbody>
   <tr>
    <th>Feature</th>
    <th>Chrome</th>
    <th>Firefox (Gecko)</th>
    <th>Internet Explorer</th>
    <th>Opera</th>
    <th>Safari</th>
   </tr>
   <tr>
    <td>Basic support</td>
    <td>{{ CompatVersionUnknown() }}</td>
    <td>{{ CompatVersionUnknown() }}</td>
    <td>{{ CompatNo() }}</td>
    <td>{{ CompatVersionUnknown() }}</td>
    <td>{{ CompatVersionUnknown() }}</td>
   </tr>
  </tbody>
 </table>
</div>
<div id="compat-mobile">
 <table class="compat-table">
  <tbody>
   <tr>
    <th>Feature</th>
    <th>Android</th>
    <th>Chrome for Android</th>
    <th>Firefox Mobile (Gecko)</th>
    <th>IE Mobile</th>
    <th>Opera Mobile</th>
    <th>Safari Mobile</th>
   </tr>
   <tr>
    <td>Basic support</td>
    <td>{{ CompatVersionUnknown() }}</td>
    <td>{{ CompatVersionUnknown() }}</td>
    <td>{{ CompatVersionUnknown() }}</td>
    <td>{{ CompatNo() }}</td>
    <td>{{ CompatVersionUnknown() }}</td>
    <td>{{ CompatVersionUnknown() }}</td>
   </tr>
  </tbody>
 </table>
</div>
<p>&nbsp;</p>
Revert to this revision