CODEWITHSUNDEEP
javascriptgoogle-chrome-devtools
alireza
alireza

Reputation: 121

How do I change dev tools console scope to be local to a function?

How do I use Chrome dev tools to evaluate code within the local scope of a function? I.e. for the following code

const name1 ="alireza"

function person(){
    const name2 ="joe" 
}

the result of code manually executed in the console should be

console.log(name2) //"joe"

Upvotes: 1

Views: 2399

Answers (2)

acran
acran

Reputation: 8988

What you are looking for are breakpoints:

You can dynamically set a breakpoint on a line within the function you want to inspect: devTools will break before the execution of that line and you can evaluate code within the scope of that function in the console.

Alternatively - if you can change the code (which you can also from devTools) - you can put a debugger statement where you want the execution to break.

Upvotes: 3

Quentin
Quentin

Reputation: 943578

This is slightly tricky because the statement you want to examine is the only statement in the function.

If you were to add another statement on the following line:

const name1 ="alireza"

function person(){
    const name2 ="joe" 
    const name3 ="bob";
}

Then you could:

  1. Open the Debugger tab
  2. Create a break point on the line after const name2 ="joe"
  3. Open the Console tab
  4. Type person() to run the person function
  5. Wait for the breakpoint to be hit
  6. Return to the Console tab
  7. Type console.log(name2); (or you could just look at the debugging information in the Debugging tab which reports all the in-scope variables).

Upvotes: 1

Related Questions