Functions Flashcards
(152 cards)
1
Q
What is the invocation context of a function ?
A
It is the value of the ‘this’ keyword.
Usually, when a function that is a property of an object is invoked on (or through) this object, that object is the invocation context or the ‘this’ value for the function.
2
Q
Javascript functions are closures. What does it mean ?
A
It mean that javascript functions can be nested within other functions, and they have access to any variables that are in scope where there are defined.
3
Q
What are the different ways to create functions in javascript ?
A
5 ways.
- Using the function keyword either as a declaration or as an expression
- Using the shorthand syntax (arrow functions)
- In object litterals and class definitions, using the shorthand syntax for declaring methods. As well as getters and setters.
- Using the Function constructor
- Using specialized kind of functions as : generators (function*) and async functions.
4
Q
What does the following mean: Function declarations are hoisted ?
A
Function declarations are hoisted to the top of the enclosing script, function or block so that functions defined in this way may be invoked from code that appear before the definition.
It means that all of the function declared in a block of javascript code will be defined throughout that block, and they will be defined before the javascript interpreter begins to execute any of the code in that block.
5
Q
Functions are objects.
True or False ?
A
True
6
Q
What is a function in JavaScript?
A
A block of JavaScript code that is defined once but may be executed any number of times.
7
Q
What are parameters in a JavaScript function?
A
Identifiers that work as local variables for the body of the function.
8
Q
What are arguments in a function invocation?
A
Values provided to a function’s parameters during invocation.
9
Q
What is the return value of a function?
A
The value computed by the function using its argument values.
10
Q
What does the ‘this’ keyword represent in a function invocation?
A
The invocation context of the function.
11
Q
What is a method in JavaScript?
A
A function assigned to a property of an object.
12
Q
What are constructors in JavaScript?
A
Functions designed to initialize a newly created object.
13
Q
How are JavaScript functions treated in the language?
A
JavaScript functions are objects and can be manipulated by programs.
14
Q
What is a closure in JavaScript?
A
A function that has access to its own scope, the outer function’s scope, and the global scope.
15
Q
What is the most straightforward way to define a JavaScript function?
A
Using the function keyword.
16
Q
What are arrow functions in JavaScript?
A
A compact syntax for defining functions introduced in ES6, using the => syntax.
17
Q
What is the syntax for a function declaration?
A
function keyword, followed by an identifier, parentheses with parameters, and curly braces with statements.
18
Q
What is hoisting in JavaScript functions?
A
Function declaration statements are moved to the top of their enclosing block, allowing them to be invoked before their definition.
19
Q
What happens if a function does not contain a return statement?
A
It executes until the end and returns undefined.
20
Q
True or False: In ES6, function declarations are only allowed at the top level.
A
False.
21
Q
What is the difference between function declarations and function expressions?
A
Declarations are hoisted and can be called before their definition; expressions are not hoisted.
22
Q
Fill in the blank: Arrow functions use the _______ syntax to separate parameters from the function body.
A
=>
23
Q
What must be included when returning an object literal from an arrow function?
A
The object literal must be inside parentheses.
24
Q
What is the significance of the ‘this’ keyword in arrow functions?
A
Arrow functions inherit the value of ‘this’ from the surrounding context.
25
What is a nested function in JavaScript?
A function defined within another function.
26
How do nested functions access variables?
They can access parameters and variables of the outer function.
27
28
29
What is a nested function?
A nested function is simply a function defined inside another function.
30
Provide an example of a nested function.
function outer() {
function inner() {
console.log("I'm nested!");
}
inner();
}
31
What is a closure?
A closure is a function that remembers and has access to variables from the scope in which it was defined, even after that scope has exited.
32
Provide an example of a closure.
function outer() {
let count = 0;
return function inner() {
count++;
console.log(count);
}
}
const counter = outer();
counter(); // 1
counter(); // 2
33
What is the key difference between a nested function and a closure?
All closures are nested functions, but not all nested functions are closures.
34
When does a nested function become a closure?
A nested function becomes a closure only when it accesses variables from its outer scope after the outer function has returned.
35
True or False: All nested functions are closures.
False
36
True or False: A closure is a structural concept.
False
37
Fill in the blank: A nested function is a function defined ______ another function.
inside
38
Fill in the blank: A closure is a function that remembers and has access to variables from the ______ in which it was defined.
scope
39
What does a closure allow a function to do after the outer function has returned?
Access variables from the outer function's scope.
40
What determines the value of `this` inside a regular function in JavaScript?
How the function is called
41
How do arrow functions handle the value of `this`?
They inherit the `this` value from the environment in which they were defined
42
What is the term for the way arrow functions handle `this`?
Lexical scoping
43
In the example of a regular function, what does `this` refer to when calling `person.greet()`?
The object `person`
44
What happens when a regular function is called without an object context?
In a non strict mode, This becomes the global object, so `this.name` is undefined.
In strict mode "this" will be "undefined".
45
`const person = {
name: "Bob",
greet: () => {
console.log("Hi, I'm " + this.name);
}
};
person.greet();`
What will `person.greet()` output if `greet` is defined as an arrow function?
In non strict mode:
Hi, I'm undefined
In strict mode: TypeError. As this will be undefined.
46
`
const person = {
name: "Bob",
greet: () => {
console.log("Hi, I'm " + this.name);
}
};
person.greet();
`
Why does `this` not refer to `person` in the arrow function example?
Because the arrow function inherits `this` from its surrounding context
47
What is a typical use case for arrow functions?
Callbacks, especially in classes or objects where you want `this` to refer to the enclosing object
48
`
function Timer() {
this.seconds = 0;
setInterval(() => {
this.seconds++;
console.log(this.seconds);
}, 1000);
}
const t = new Timer();
// Outputs: 1, 2, 3, 4... every second
`
In the `Timer` example, what does `this` refer to when using an arrow function in `setInterval`?
The Timer instance
49
Can arrow functions be used as constructors?
No
50
What will happen if you try to use an arrow function with `new`?
TypeError: Person is not a constructor
51
What is a key difference between regular functions and arrow functions regarding `prototype`?
Regular functions have a `prototype`, arrow functions do not
52
Fill in the blank: Arrow functions are mostly used for _______ and _______.
small functions and callbacks
53
True or False: Arrow functions are good for methods.
False
54
What is the main advantage of using arrow functions in callbacks?
They provide lexical `this`
55
Between arrow and regular functions,, which type of function is good for methods?
Regular Function
56
Beyween arrow and regular functions, which type of function is considered as usually not good for methods?
Arrow Function
57
58
59
What does `this` refer to in JavaScript?
`this` refers to the execution context — the object that is currently executing the function.
60
What does `this` refer to in the global context (outside any function or class)?
In browsers: `window`, in Node.js: `global`.
61
What is the value of `this` inside a non-strict mode function?
In browsers: `window`.
62
What is the value of `this` inside a strict mode function invoked directly (not through an object)?
`undefined`.
63
What does `this` refer to inside an object method?
The object the method was called on.
64
What happens to `this` in arrow functions?
Arrow functions do not bind their own `this`, they inherit it from their lexical scope.
65
What does `this` refer to when using a constructor function?
The newly created object.
66
What does `this` refer to inside a class method invoked through an object ?
The instance of the class.
67
What do the methods call(), apply(), and bind() do in relation to `this`?
They let you manually control what `this` points to.
68
What is the difference between call() and apply()?
Both immediately invoke the function with `this` set to the first argument, but apply() takes an array of arguments.
69
What does `this` refer to in a regular function inside setTimeout?
Global object (in browsers).
70
What does `this` refer to in an event handler using a regular function?
The DOM element triggering the event.
71
What does `this` refer to in an event handler using an arrow function?
Lexical `this`, often `window`.
72
Fill in the blank: When a function is used with ______, `this` refers to the newly created object.
[new]
73
True or False: In strict mode, `this` is always `undefined`.
False.
74
What is the value of `this` in a DOM inline event handler?
The button element.
75
List the contexts and their corresponding `this` values from the summary table.
* Global scope (non-strict): Global object (window or global)
* Global scope (strict mode): undefined
* Inside a method: The object the method was called on
* Inside a regular function: Depends on call site
* Inside a constructor: The newly created object
* Inside an arrow function: Inherits from enclosing scope
* With call, apply, or bind: The explicitly provided object
* In event handler (regular func): The DOM element triggering the event
* In event handler (arrow func): Lexical this, often window
* In setTimeout / setInterval: Global object unless arrow function
* Inside class methods: The instance of the class.
76
What are nested functions in JavaScript?
Functions that are defined within other functions.
77
What can nested functions access?
Parameters and variables of the function they are nested within.
78
When is the body of a JavaScript function executed?
When the function is invoked.
79
How many ways can JavaScript functions be invoked?
Five ways:
* As functions
* As methods
* As constructors
* Indirectly with call() and apply()
* Implicitly via language features.
80
What is an invocation expression in JavaScript?
A function expression followed by parentheses containing arguments.
81
What happens to argument expressions in a function invocation?
They are evaluated and the resulting values become the arguments to the function.
82
What is the return value of a function invocation if it reaches the end without a return statement?
Undefined.
83
What does the syntax f?.(x) do in JavaScript?
Invokes the function only if it is not null or undefined.
84
What is the invocation context of a regular function invoked directly (not as an object.method) in non-strict mode ?
The global object.
85
What is a recursive function?
A function that calls itself.
86
What is the stack in relation to recursive functions?
A structure that keeps track of execution contexts for each function call.
87
What does a method in JavaScript refer to?
A function stored in a property of an object.
88
How is a method invoked?
Using the syntax o.m(); where o is the object and m is the method.
89
What is the significance of the this keyword in method invocations?
It refers to the object through which the method is invoked.
90
What is method chaining?
Invoking multiple methods on the same object in a single expression.
91
What does the keyword new signify in a function invocation?
It indicates a constructor invocation.
92
What is a constructor function's typical behavior regarding return values?
1. Implicit Return of the New Object
When a constructor function is called using the new keyword, it automatically returns the newly created object, even if no return statement is provided.
2. Explicit Return Behavior
If a constructor function explicitly returns a non-object value (like a number, string, boolean, null, or undefined), JavaScript ignores it and still returns the new object.
However, if the constructor function explicitly returns an object, that object overrides the default return:
93
What is the purpose of the call() and apply() methods in JavaScript?
They allow to invoke a function indirectly, to manually control what "this" points to, and to dynamically pass arguments to this function.
"call" will take its remaining arguments as the arguments of the function invoked. "apply" will take an array of values to be used as arguments of the function invoked.
94
What can cause implicit function invocations in JavaScript?
Features like getters/setters, toString(), valueOf(), iterables, and tagged template literals, Proxy Objects
95
True or False: Functions defined as expressions are hoisted.
False.
96
Fill in the blank: A _______ function is one that calls itself.
recursive
97
What is the difference between function objects and regular objects at the prototype level?
They differ in their internal prototype chains and special internal behaviors.
## Footnote
Function objects have additional behaviors and properties compared to regular objects.
98
What is the internal prototype chain of a function object?
myFunc ---> Function.prototype ---> Object.prototype ---> null
## Footnote
This shows the inheritance hierarchy for function objects.
99
What is the internal prototype chain of a regular object?
myObj ---> Object.prototype ---> null
## Footnote
Regular objects inherit directly from Object.prototype.
100
What additional methods do function objects have compared to regular objects?
* call
* apply
* bind
* other function-specific methods
## Footnote
These methods are not available to regular objects.
101
What is the result of typeof myFunc.call?
"function"
## Footnote
This indicates that call is a method of function objects.
102
What is the result of typeof myObj.call?
"undefined"
## Footnote
Regular objects do not have the call method.
103
Can function objects be called like this: myFunc();?
Yes
## Footnote
Function objects are callable.
104
Can regular objects be called like this: myObj();?
No
## Footnote
Regular objects throw a TypeError if called.
105
What happens when a function object is called with new?
It becomes constructible
## Footnote
This creates a new object and sets its prototype.
106
What is the default .prototype property of a function object?
An object with a constructor property pointing to the function
## Footnote
This is not part of the prototype chain.
107
What is the default .prototype property of a regular object?
undefined
## Footnote
Regular objects do not have a .prototype property.
108
What are the characteristics of function objects compared to regular objects? Fill in the blanks.
* Has [[Prototype]]: Yes (Function → Object)
* typeof result: "function"
* Callable with (): Yes
* Has .prototype property: Yes
* Inherits from: Function.prototype
* Has .call, .apply: Yes
## Footnote
This summarizes the differences in a table format.
109
Do regular objects inherit from Function.prototype?
No
## Footnote
Regular objects inherit from Object.prototype.
110
True or False: Only function objects have a .prototype property.
True
## Footnote
Regular objects do not have this property.
111
Can you turn a regular object into a true function?
No, not fully.
112
What are two methods that will not make an object callable?
* Setting its `[[Prototype]]` to `Function.prototype`
* Adding a `.prototype` property
113
What is a special internal behavior in JavaScript that allows an object to be callable?
`[[Call]]` internal method
114
What happens when you try to call an object that is not a true function?
TypeError: fakeFunc is not a function
115
What can you fake to make an object appear like a function?
You can fake part of it by setting the prototype.
116
What is true about objects with a `[[Call]]` internal slot?
They can be invoked with `()`.
117
What type of objects have the `[[Call]]` internal slot?
* Native function objects
* Function-created objects
118
What is the only way to create a true function dynamically?
Use the `Function` constructor or a real function expression/declaration.
119
What does the `Function` constructor return?
An object that is truly callable.
120
Fill in the blank: Callability (`[[Call]]`) is not just a matter of _____ — it's an intrinsic capability.
prototype
121
True or False: You can manually make an object callable like a function by mimicking its structure.
False
122
What is an example of a true function created dynamically?
const realFunc = new Function('a', 'b', 'return a + b');
123
What behavior does a true function have that allows it to be called?
`[[Call]]` behavior
124
Can you turn a regular object into a true function?
No, not fully.
125
What are two methods that will not make an object callable?
* Setting its `[[Prototype]]` to `Function.prototype`
* Adding a `.prototype` property
126
What is a special internal behavior in JavaScript that allows an object to be callable?
`[[Call]]` internal method
127
What happens when you try to call an object that is not a true function?
TypeError: fakeFunc is not a function
128
What can you fake to make an object appear like a function?
You can fake part of it by setting the prototype.
129
What is true about objects with a `[[Call]]` internal slot?
They can be invoked with `()`.
130
What type of objects have the `[[Call]]` internal slot?
* Native function objects
* Function-created objects
131
What is the only way to create a true function dynamically?
Use the `Function` constructor or a real function expression/declaration.
132
What does the `Function` constructor return?
An object that is truly callable.
133
Fill in the blank: Callability (`[[Call]]`) is not just a matter of _____ — it's an intrinsic capability.
prototype
134
True or False: You can manually make an object callable like a function by mimicking its structure.
False
135
What is an example of a true function created dynamically?
const realFunc = new Function('a', 'b', 'return a + b');
136
What behavior does a true function have that allows it to be called?
`[[Call]]` behavior
137
Can another object inherit from a function?
Yes. Any object can inherit from a function object via Object.create or by setting its prototype explicitly.
## Footnote
Example: Object.create(greet) creates an object that inherits from the function greet.
138
What will the type of an object that inherits from a function be?
object
## Footnote
Even if the prototype is a function, the object itself won’t gain the [[Call]] internal method.
139
Will the inherited object be callable as a function?
No.
## Footnote
The object itself will throw a TypeError when called as a function.
140
Can a function inherit from another function?
Yes! This is a real pattern.
## Footnote
Example: Inheriting instance properties using Parent.call(this) in the Child function.
141
What was the main inheritance model in JavaScript before ES6?
Function constructors + prototype chaining.
## Footnote
This model has been largely replaced by class syntax in ES6.
142
What inheritance model is more idiomatic since ES6?
class syntax.
## Footnote
The class syntax still uses prototypes behind the scenes.
143
Is function inheritance common in JavaScript?
Yes, especially with constructors or class.
## Footnote
Function inheritance is a common pattern in JavaScript.
144
What happens when an object inherits from a function?
It is possible, but not callable.
## Footnote
The inherited object will not be a function unless created via Function constructor or class.
145
What type are Parent and Child in ES6 class syntax?
function.
## Footnote
They are still functions behind the scenes despite being defined using class syntax.
146
Fill in the blank: The inherited object will not gain the _______ internal method.
[[Call]].
147
iIn the expression new o.m(), o is used as the invocation context. True or False.
False.
Because of new, the created object will be the invocation context.
148
Both the call() and apply() methods of functions allow you to specify the arguments for the invocation.
True or False ?
True
Call takes its own arguments as arguments of the function.
Apply expects an array of values to be used as arguments.
149
What are "rest parameters" ?
Parameter defaults enable us to write functions that can be invoked with fewer arguments than parameters. Rest parameters enable the opposite case: they allow us to write functions that can be invoked with arbitrarily more arguments than parameters.
Example: function max(first=-Infinity, ...rest) {
let maxValue = first; // Start by assuming the first arg is biggest
// Then loop through the rest of the arguments, looking for bigger
for(let n of rest) {
if (n > maxValue) {
maxValue = n;
}
}
// Return the biggest
return maxValue;
}
150
For functions with multiple parameters, you cannot use the value of a previous parameter to define the default value of the parameters that follow it.
True or False ?
False.
You can use the value of a previous parameter to define the default value of the parameters that follow it
151
How are called functions with rest parameters ?
Variadic functions
Variable arity functions
vararg functions.
152
