85

I tried to investigate the jQuery code, so I used this:

document.write($.constructor);

jsfiddle

I got this result:

function Function() { [native code] }

What does [native code] mean? Why can't I see the real code?

Tested with Google-Chrome

asked Jun 27, 2012 at 20:54
5
  • 7
    Does this help: stackoverflow.com/questions/9103336/read-javascript-native-code? Commented Jun 27, 2012 at 20:56
  • Possibly constructor method is inherited from JS object, which is part of basic browser functionality. Commented Jun 27, 2012 at 21:00
  • @gdoron It doesn't answer the question directly, but jQuery is open source, so you can see for yourself what is in there. Commented Jun 27, 2012 at 21:00
  • 1
    Because that code is part of the V8 engine, which is implemented in C++ and therefore compiled code. Commented Jun 27, 2012 at 21:01
  • MDN source, for completeness Commented Apr 29, 2020 at 10:11

3 Answers 3

80

When you define functions in an interpreted language (as opposed to a compiled language). You have access to the file / string / text that defines the function.

In JavaScript for example you can read the definition body text of a function you have defined:

function custom( param ){
 console.log( param );
}
console.log( custom.toString() ); // <- Will display the full code (in text) of the function. 

If you try to do the same for a function that is included by construction* in JavaScript it is not implemented as text but as binary.

console.log( setInterval.toString() );
// Will display: function setInterval() { [native code] }

There is no reason to show the binary code that implements that function because it is not readable and it might not even be available.

jQuery extends default JavaScript behaviour. It's one of the reasons it was so highly appreciated and praised as opposed to Prototype.js for example. Prototype was altering the natural behaviour of JavaScript creating possible inconsistencies when using Prototype alongside some other piece of code that relied on normal functionality.

tl;dr:

jQuery extends JavaScript, there is functionality implemented using native code (which performance wise is a good thing).


*included by construction: Elaborating a bit on this part. JavaScript itself can be written/implemented in any language (C++, Java, etc.). In Chrome, the JavaScript engine (V8) is written in C++. Firefox's JavaScript engine (SpiderMonkey) is also written in C++.

The functions that are defined by the language specification (ECMAScript) and should be included in the actual implementation, are written in another language (e.g. C++ in these 2 cases) and become available in JavaScript as built-in/native functions.

These functions are actually compiled (binary) C++ code and thus cannot be displayed within JavaScript itself, e.g. using the [].map.toString() syntax.

Kostas Minaidis
5,6814 gold badges21 silver badges31 bronze badges
answered Jun 27, 2012 at 21:00
Sign up to request clarification or add additional context in comments.

4 Comments

This answer explained the mystery of [native code] very well. Thank you.
what do you mean by "included by construction" ?
@doubleOrt I think he's refering to the engine
@Mihai Stancu Could you explain the "included by construction" part?
28

$, jQuery is just a function. Without invoking it, it's just an ordinary function. A function's constructor is Function, hence $.constructor shows [native code].

answered Jun 27, 2012 at 20:59

3 Comments

Just to be sure, it has nothing to do with jQuery at all right, the other answer confused me.
@gdoron jQuery is irrelevant in this case.
@RobW I have this code jQuery.colorbox.close() and how to convert in native javascript
4

bind does this to functions:

var f = function() { /* source code */ };
console.log(f.toString());
function () { /* source code */ }
var a = {};
f = f.bind(a);
console.log(f.toString());
function () { [native code] }
f = new Function('/* source code */');
console.log(f.toString());
function anonymous() { /* source code */ }
f = f.bind(a);
console.log(f.toString());
function () { [native code] }

either bind returns a reference to some kind of a wrapper code, or toString considers the bound copy native since it is not created by the user directly

However, just logging function directly, w/o using toString(), prints (in Chrome) the source code of the original unbound function:

f = f.bind(a);
console.log(f)
ƒ () { /* source code */ }

in FF this doesn't work though - FF prints the function object, w/o the source code

answered Aug 16, 2021 at 11:02

2 Comments

Interesting console
Interesting console

Your Answer

Draft saved
Draft discarded

Sign up or log in

Sign up using Google
Sign up using Email and Password

Post as a guest

Required, but never shown

Post as a guest

Required, but never shown

By clicking "Post Your Answer", you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.