Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Call javascript function from chrome developer console [duplicate]

Tags:

javascript

Very simple script:

function foo(){
    return "bar"
}

console.log( foo() );

console:

> bar // sanity test that proves everything's working
> foo(); // this guy is key!
> ReferenceError: foo is not defined

How should I call foo(); for debugging and experimentation purposes?

Is this not a practise? I love using IRB / Rails Console to verify my ruby code and want to do the same with JavaScript

http://jsfiddle.net/m2muL/

like image 931
Starkers Avatar asked May 13 '14 20:05

Starkers


People also ask

What is the JavaScript Console in chrome?

Chrome comes with built-in developer tools. This comes with a wide variety of features, such as Elements, Network, and Security. Today, we’ll focus 100% on its JavaScript console. When I started coding, I only used the JavaScript console for logging values like responses from the server, or the value of variables.

How to call a function from the console in JavaScript?

To call a JavaScript function from the console, run the following code: Example <!DOCTYPE html> <html> <body> <script> var display = { displayOne: function(){ return "displayTwo" ;} }; console.log(display.displayOne()); </script> </body> </html>

How to debug a JavaScript function in chrome?

In this article I explain how to debug a JavaScript function in Chrome. Open the Chrome browser and type in an URL address. When you first reach the page with the JavaScript function to be debugged use the following procedure. 1. Right-click on that page and click "Inspect element"; the page will be split into two parts: 2. Now click on "Sources".

How to run JavaScript snippets with Chrome Dev Tools?

Moreover there are another ways how to run JavaScript snippets with Chrome Dev Tools: The first step – to open dev tools in chrome: Press command+option+J (on MacBooks) and ctrl+shift+J (on non mac) The second step – to click on the button named “source” to open a panel, so the sub-tab will be also opened.


2 Answers

The problem is that your foo function is not part of the global scope. The console essentially has access to everything that window does. As a result, if it is undefined there, then it is undefined in the console. For example, this could be an example of foo not being available in the console.

(function(){
   function foo(){
     return "bar";
   } 
   console.log(foo()); //"bar"
})()

console.log(foo()); //ReferenceError: foo is not defined

Find a way to locate where this method is exposed. If it is inside of an object or method, make sure to reference that from your console.

var foobar = {
 foo: function(){ return "bar" ;}
};

console.log(foobar.foo()); //"bar"

If you cannot reference foo, then you cannot call it.

like image 150
Travis J Avatar answered Oct 26 '22 03:10

Travis J


You're trying to do this in JSFiddle, which is "hiding" your javascript away from your console. It's not really in scope for you to execute. It's not working there like you are assuming it will...

If you created a simple HTML file and stuck your javascript in there between tags, you wouldn't have a problem running "foo()" in console.

Create test.html and put this inside:

<script>
function foo(){
    return "bar"
}
console.log( foo() );
</script>
like image 43
Ralph N Avatar answered Oct 26 '22 03:10

Ralph N