A new execution context is created for each function in JavaScript.
How many execution contexts are present in memory when the following code is run? Note that function Bar
is not invoked.
function Foo () {
function Bar() {}
}
Foo();
Also, when are the execution contexts created? At evaluation time or runtime?
A new execution context is created for each function in JavaScript.
How many execution contexts are present in memory when the following code is run? Note that function Bar
is not invoked.
function Foo () {
function Bar() {}
}
Foo();
Also, when are the execution contexts created? At evaluation time or runtime?
Share Improve this question asked Nov 30, 2014 at 14:44 Ben AstonBen Aston 55.8k69 gold badges220 silver badges349 bronze badges 8- What are your answers (or even guesses)? This looks like a quiz question. – Pointy Commented Nov 30, 2014 at 14:48
- This question is straight from my brain. Does it looking like a quiz question de-value it? – Ben Aston Commented Nov 30, 2014 at 14:50
- Well without more context, it reads like something that would be on a homework assignment, but fair enough; if you say it isn't, it isn't. :) – Pointy Commented Nov 30, 2014 at 14:50
- I'm 33. I haven't done homework for a long time. – Ben Aston Commented Nov 30, 2014 at 14:51
- Thanks for the unexplained downvote?! – Ben Aston Commented Nov 30, 2014 at 14:58
4 Answers
Reset to default 5The runtime invocation of a function is what causes an execution context to be created. In your example, therefore, there's only one function call, so only one execution context is involved.
The static (pile-time) arrangement of functions is important, because that determines scope and the eventual contents of execution contexts. It's the actual call to a function that matters, however, for the creation of a context. (Some older languages used the term "activation record", though that may have been more intended for stack-based allocations.)
You can read details in the sometimes turgid language of the spec, though it can be hard to make out the forest for the trees. The spec is written in terms of control being transferred. A function call is a very mon way that that happens, but so is the invocation of an event handler, or the invocation of a plete <script>
block when it is initially loaded by a browser.
When you create a function they are piled at run time. The function is invoked when you call them.
Let me explain a little bit:
You can have any number of function contexts, and each function call creates a new context.
//Global Context
var helloWorld = "hello world!";
function foo(){//execution context
function bar(){//execution context
console.log('bar');
}
}
foo();
So, in the above code function foo is being called, and creates the new context for function foo and the execution context for bar is only created after you call it but it is piled already during the run time.
When a script is loaded first time by the browser, it enters the global execution context by default. If you call a function in global scope, the sequence flow of your program enters the function being called, creating a new execution context and pushing that context to the top of the execution stack.
Now let's have a detail about execution context:
So, everytime a function is called, a new execution context is created. Every call to an execution context has 2 stages:
1. creation stage:
When the function is called but before it executes any code inside are: create the scope chain, create variables, functions and arguments, and determine the value of "this".
2. activation stage:
Assign values, references to functions and executes the code.
Now, let's have a bit more knowledge of execution context:
function foo (a, b, c) {
function z(){alert(‘Z!’);}
var d = 3;
}
foo(‘foo’,’bar’);
ExecutionContext in the foo() call: Step 1: arguments is created
ExecutionContext: {
arguments: {
0: ‘foo’, 1: ‘bar’,
length: 2, callee: function() //Points to foo function
}
}
Step 3a: variable instantiation, arguments
ExecutionContext: {
arguments: {
0: ‘foo’, 1: ‘bar’,
length: 2, callee: function() //Points to foo function
},
a: ‘foo’, b: ‘bar’, c: undefined
}
Step 3b: variable instantiation, functions
ExecutionContext: {
arguments: {
0: ‘foo’, 1: ‘bar’,
length: 2, callee: function() //Points to foo function
},
a: ‘foo’, b: ‘bar’, c: undefined,
z: function() //Created z() function
}
Step 3c: variable instantiation, variables
ExecutionContext: {
arguments: {
0: ‘foo’, 1: ‘bar’,
length: 2, callee: function() //Points to foo function
},
a: ‘foo’, b: ‘bar’, c: undefined,
z: function(), //Created z() function,
d: undefined
}
Step 4: set this value
ExecutionContext: {
arguments: {
0: ‘foo’, 1: ‘bar’,
length: 2, callee: function() //Points to foo function
},
a: ‘foo’, b: ‘bar’, c: undefined,
z: function(), //Created z() function,
d: undefined,
this: window
}
After the creation of ExecutionContext, the function starts running its code from the first line until it finds a return or the function ends. Every time this code tries to access a variable, it is read from the ExecutionContext object.
On calling Foo();
- A single execution context is created due to the invocation of a single
function
- A pointer to the function
Bar
is also created, in the process.
Also, there is this default envionment where your code is executed for the first time, called Global Context
My best guess is that it might depend on the environment you are running your code.
Although it is not very hard to check V8 doesn't create executional context for function that is not executed at all.