JavaScript-Developer-I Salesforce Certified JavaScript Developer (JS-Dev-101) Free Practice Exam Questions (2026 Updated)

JavaScript consoles (browsers and Node) provide timing utilities:

console.time(label) – starts a timer with the given label.

console.timeEnd(label) – stops the timer and logs the total elapsed time.

console.timeLog(label) – logs the current elapsed time without stopping the timer.

To measure the time taken by each function separately while still using a single overall timer, you can log intermediate times:

console.time( ' Performance ' );

maybeAHeavyFunction();

console.timeLog( ' Performance ' , ' after maybeAHeavyFunction ' );

thisCouldTakeTooLong();

console.timeLog( ' Performance ' , ' after thisCouldTakeTooLong ' );

orMaybeThisOne();

console.timeLog( ' Performance ' , ' after orMaybeThisOne ' );

console.timeEnd( ' Performance ' );

Each console.timeLog( ' Performance ' ) call prints the elapsed time since console.time( ' Performance ' ) was started, so you can infer how long each function took.

Note: console.endTime in the original snippet is incorrect; the real method is console.timeEnd.

Why other options are incorrect:

B. console.trace()

Prints a stack trace, not timing information.

C. console.timeStamp()

Used with browser performance tools; it does not directly show elapsed times like timeLog or timeEnd.

D. console.getTime()

Not a standard console method.

Thus, the function that can be used to obtain timing between calls is:

Answer: A

Study Guide Concepts:

console.time, console.timeLog, console.timeEnd

Measuring performance and intermediate timings

Standard console debugging API methods

fullName is defined as a getter :

get fullName() { ... }

Getters are accessed like properties , not like functions.

So:

cat.fullName; // " Fancy Whiskers "

No parentheses.

Why others are wrong:

A: cat.fullName() tries to call the returned string as a function.

B and C: These properties (get, function) do not exist; they are misinterpretations of syntax.

Person instances have:

firstName and lastName as string properties.

A name method that returns a combined string: `${this.firstName},${this.lastName}`.

Object.assign({}, john) creates a shallow copy of john into a new object, dan.

After:

dan.firstName = ' Dan ' ;

dan.name() returns " Dan,Doe " .

Analysis of options:

A: dan.firstName() and dan.lastName() are function calls , but firstName/lastName are strings, not functions → TypeError.

B: Calls the defined method and uses both names correctly.

C: dan.name is a function reference; you’d still need to call it: dan.name().

D: dan.firstName + dan.lastName is " DanDoe " , no separator. It accesses the properties but not in the method the developer defined.

The intended way, using the provided API, is dan.name().

The answer choices appear to belong to an event propagation question using nested elements such as an outer element and an inner element.

The important clue is this third argument:

addEventListener( ' click ' , handlerFunction, true);

When the third argument is true, the event listener runs during the capturing phase .

In event capturing, the browser handles the event from the outside toward the inside:

Outer element → Inner element

So, if an inner element is clicked and both the outer and inner elements have click listeners registered with capture mode set to true, the outer listener runs first, then the inner listener runs.

That produces:

Outer message

Inner message

So the matching option is B .

Important correction:

In the exact code shown, the buttons are sibling elements:

< button class= " secondary " > Save draft < /button >

< button class= " primary " > Save and close < /button >

They are not nested inside one another. Therefore, with the code exactly as written:

Clicking the secondary button logs:

Save message.

Clicking the primary button logs:

Success message.

However, because the provided answer choices refer to Outer message and Inner message , the intended concept is clearly event capturing. In a capturing-phase question with nested outer and inner elements, the correct order is:

Outer message

Inner message

Therefore, the verified answer for the intended event-capturing question is B .

The correct answer is A , not D.

Inside myFunction(), the declaration:

var b = 1;

is hoisted to the top of the function scope, but only the declaration is hoisted, not the assignment. So internally, JavaScript treats the function approximately like this:

function myFunction() {

var b;

a = a + b;

b = 1;

}

Now examine this line:

a = a + b;

Before JavaScript can assign a value to a, it must first evaluate the right-hand side:

a + b

At this point:

b

exists locally because var b was hoisted, so its value is:

undefined

However:

a

has not been declared anywhere. Reading an undeclared variable causes a:

ReferenceError

So this line throws an error before assignment happens:

a = a + b;

Because the error occurs on that line, the next line inside the function is never executed:

var b = 1;

Also, because the error is not handled with try...catch, the program stops before reaching:

console.log(a);

console.log(b);

Therefore, the accurate statement is:

Line 02 throws a reference error, therefore line 03 is never executed.

So the verified answer is A .

The correct answer is B because the JavaScript browser console allows developers to interact with the current web page using JavaScript commands. Through the console, you can access the document object, inspect DOM elements, read their properties, and modify the structure or content of the page.

For example:

document.body.style.backgroundColor = " lightblue " ;

This changes the page’s background color.

Another example:

document.querySelector( " h1 " ).textContent = " Updated Heading " ;

This changes the text of the first < h1 > element on the page.

The DOM , or Document Object Model, is the browser’s JavaScript representation of the HTML page. Since the console runs JavaScript in the context of the current page, it can be used to inspect and modify DOM elements directly.

Why the other options are incorrect:

A is not the best answer because although you can type general JavaScript expressions in the console, the browser console is mainly connected to the current page’s execution environment. The question is asking about practical browser-console actions related to a page.

C is incorrect because performance reports are usually generated through tools such as the Performance panel or Lighthouse in browser developer tools, not directly through the JavaScript console.

D is incorrect because the console can modify the DOM and runtime values, but it does not permanently change the original JavaScript source code of the page. Any changes made through the console are temporary and disappear when the page reloads.

E is incorrect because security-protected cookies, such as HttpOnly cookies, cannot be viewed or changed using JavaScript. This is an intentional browser security feature that prevents client-side scripts from accessing sensitive cookie data.

Therefore, the best verified answer is B .

Comprehensive and Detailed Explanation:

The loop removes every 4:

Start: [1, 2, 3, 4, 4, 5, 4, 4]

i=0 → 1 (no change)

i=1 → 2 (no change)

i=2 → 3 (no change)

i=3 → 4 → splice removes index 3 → [1,2,3,4,5,4,4], then i-- → 2

Next loop, i=3 → 4 again → splice → [1,2,3,5,4,4], i-- → 2

i=3 → 5 (no change)

i=4 → 4 → splice → [1,2,3,5,4] , i-- → 3

i=4 → 4 → splice → [1,2,3,5], i-- → 3

Next i=4, array.length is 4 → loop ends.

All 4s removed, final array: [1, 2, 3, 5].

The correct answers are B and D .

A strong test case checks whether the actual output matches the expected behavior of the function.

For Option B :

let res = fizzbuzz(15);

console.assert(res === ' fizzbuzz ' );

The number 15 is divisible by both 3 and 5:

15 % 3 === 0

15 % 5 === 0

So the correct return value is:

' fizzbuzz '

That makes option B a valid test.

For Option D :

let res = fizzbuzz(Infinity);

console.assert(res === ' ' );

Infinity is not a normal finite divisible number. In JavaScript:

Infinity % 3

Infinity % 5

produce NaN, and comparisons such as:

Infinity % 3 === 0

are false.

So a typical fizzbuzz implementation would not treat Infinity as divisible by 3 or 5, meaning it should return:

' '

That makes option D a valid test for the “neither divisible by 3 nor 5” path.

Now compare the incorrect options:

Option A is wrong because:

fizzbuzz(3)

should return:

' fizz '

not:

' buzz '

Option C is wrong because the function specification says the function returns strings such as ' fizz ' , ' buzz ' , ' fizzbuzz ' , or ' ' . It does not say the function returns numeric NaN.

So this assertion is not appropriate:

console.assert(isNaN(res));

Therefore, the verified answers are B and D .

If the dependency was added as a dev dependency (yarn add --dev), it goes into devDependencies.

When NODE_ENV=production, Yarn (and npm) typically skip devDependencies on install.

Thus the package doesn’t get installed for other team members in a production environment.

YARN_ENV is not a standard variable, --save is npm syntax (and Yarn saves by default), and --add is not how Yarn works (the command itself is yarn add).

objA is created with:

{ value: 10 }

objB = objA; Objects in JavaScript are assigned by reference , not copied. So objA and objB refer to the same object in memory.

The function:

changeValue(obj) {

obj.value = obj.value / 2;

}

When called as changeValue(objB), it updates the value property of the shared object :

value = 10 / 2 → 5

Therefore:

objA.value === 5

Because objA and objB refer to the same object, the change is reflected in both.

JavaScript Knowledge References (text-only)

Objects are stored and passed by reference.

Mutating an object inside a function mutates the original object.

==================================================

This question tests understanding of let (block scope) and var (function scope) in JavaScript.

Initial declarations in the function:

let x = 1; // line 2

var y = 1; // line 3

Here:

x is declared with let, so it is block-scoped to the function body.

y is declared with var, so it is function-scoped to the entire function.

Inside the if (reassign) block (and since reassign is true, we enter it):

if (reassign) {

let x = 2; // line 6

var y = 2; // line 7

console.log(x); // line 8

console.log(y); // line 9

}

Detailed behavior:

let x = 2; on line 6 creates a new block-scoped variable x that exists only inside the if block. It does not change the outer x declared on line 2.

var y = 2; on line 7 declares y with var again, but var is function-scoped. This effectively reassigns the same y defined on line 3 for the entire function. After this line, y is 2 everywhere in the function.

Now, inside the if block:

console.log(x); (line 8) logs the inner block-scoped x, which is 2.

console.log(y); (line 9) logs y, which is the function-scoped y that was set to 2.

So the first two outputs are:

2

2

After the if block, execution continues:

console.log(x); // line 12

console.log(y); // line 13

Outside the if block:

The block-scoped let x = 2; no longer exists; it was only visible inside the if block.

The outer let x = 1; (line 2) is still in scope and has not been changed.

Thus:

console.log(x); (line 12) logs the outer x, which is still 1.

console.log(y); (line 13) logs y which, due to var y = 2; inside the if, is now 2 for the whole function.

Therefore, when myFunction(true) is called, the output in order is:

2 (inner x in if)

2 (function-scoped y after reassignment)

1 (outer x after if)

2 (function-scoped y remains 2)

This corresponds to:

Answer: B (2 2 1 2)

JavaScript knowledge / study guide reference concepts:

let declarations and block scope

var declarations and function scope

Shadowing of variables with let inside a block

Re-declaration and reassignment of var within a function

Execution order of statements and console output

In JavaScript server-side development using Node.js, dependency management is typically handled through package managers such as npm or yarn . These tools categorize installed packages into:

dependencies – required for running the application in any environment

devDependencies – required only during development (testing tools, build tools, documentation generators, etc.)

When a package is installed using:

yarn add < package > --dev

it is placed under the " devDependencies " section of package.json.

Behavior of Production Mode

Node.js uses the environment variable:

NODE_ENV=production

When this environment variable is set to production, both npm and Yarn follow the standard Node.js convention and skip installing devDependencies . This is done to optimize production builds and reduce deployment size. This is a known and documented behavior in Node.js package management tools.

Therefore, if:

The developer added the date-manipulation library as a dev dependency , and

Other team members execute yarn in an environment where NODE_ENV=production is set,

then Yarn will not install that dependency because devDependencies are intentionally excluded in production mode.

This explains the behavior described in the question.

Why the Other Options Are Incorrect

Option A:

" YARN_ENV is set to production " is incorrect because Yarn does not use the variable YARN_ENV for dependency installation behavior. Node.js tools use NODE_ENV , not YARN_ENV.

Option B:

This is incorrect because Yarn automatically writes dependencies into package.json. Unlike older npm versions, there is no need for the --save flag.

Option D:

There is no such option as --add. The correct syntax is simply:

yarn add < package >

Missing an option that does not exist cannot be the cause.

JavaScript Knowledge References

Node.js uses the environment variable NODE_ENV to determine production or development mode.

Package managers (npm and Yarn) follow the rule that when NODE_ENV=production , only " dependencies " are installed and " devDependencies " are skipped.

Yarn automatically persists installed packages to package.json without requiring --save.

Yarn uses the command yarn add to add dependencies; there is no --add flag.

Behavior of Promise.prototype.finally:

.finally(handler) registers a callback that runs when the promise is settled , meaning:

Either fulfilled (resolved) , or

rejected .

Important points:

The finally callback does not receive the promise’s value or error (unlike then and catch).

It is executed after the promise is settled, but before the resolution value or rejection reason is passed further down the chain.

It runs in both success and failure paths.

In the given code:

The promise may either:

Call reject( ' fraction > 0.5, ' + fraction) if fraction > 0.5, or

Call resolve(fraction) otherwise.

In both cases:

If it resolves , .then(() = > console.log( ' resolved ' )) runs, and then .finally(...) is executed.

If it rejects , .catch((error) = > console.error(error)) runs, and then .finally(...) is executed.

So .finally runs:

Not just “when rejected”.

Not just “when resolved”.

But whenever the promise is resolved or rejected .

Therefore, the correct choice is:

D. When resolved or rejected .

Animal class:

Has a constructor that sets this.name.

Has a makeSound method that logs a message using this.name.

Dog class:

Extends Animal.

Its constructor calls super(name) to run the parent constructor, which sets this.name.

It overrides makeSound() to log:

console.log(`${this.name} is barking.`);

Instantiation:

let myDog = new Dog( ' Puppy ' );

myDog.makeSound();

new Dog( ' Puppy ' ):

Calls Dog constructor with name = ' Puppy ' .

Inside, super(name) sets this.name = ' Puppy ' in the Animal constructor.

Then this.name = name; in the Dog constructor keeps it as ' Puppy ' .

myDog.makeSound():

Calls the overridden makeSound() in Dog.

Logs: " Puppy is barking. "

No reference errors, no undefined; the output is:

Puppy is barking.

Study Guide Concepts:

ES6 classes and inheritance (extends)

super() in subclass constructors

Method overriding in subclasses

Template literals: `${this.name} ...`

When async is added to a function:

async function example() {}

JavaScript guarantees:

The function always returns a Promise , regardless of what is returned inside.

Inside the function, await pauses execution until a Promise resolves.

Code appears synchronous even though it uses asynchronous behavior.

Analysis of each option:

A incorrect: Not " sometimes " —an async function always returns a Promise.

B incorrect: Async functions can be called just like normal functions.

C incorrect: Async/await has nothing to do with classes specifically.

D correct: This is the standard description: “Async functions behave asynchronously but allow writing code that looks synchronous.”

JavaScript Knowledge References (text-only)

async functions always return Promises.

await pauses execution of the async function.

Async/await syntax creates synchronous-looking code on top of asynchronous operations.

At line 03, the developer assigns:

Item.prototype.description = function() { return ' This is a ' + this.name; }

This affects all objects whose prototype chain includes Item.prototype .

regItem inherits from Item → gets this method.

saleItem, as an instance of SaleItem, also inherits Item.prototype (since SaleItem uses prototype inheritance from Item), so it also has this method at this moment.

Outputs at lines 04 and 05:

regItem.description() → " This is a Scarf "

saleItem.description() → " This is a Shirt "

At line 07, the developer overrides the method on SaleItem.prototype :

SaleItem.prototype.description = function() {

return ' This is a discounted ' + this.name;

}

From this point:

regItem still uses the Item.prototype version

saleItem uses the overridden SaleItem.prototype version

Outputs at lines 08 and 09:

regItem.description() → " This is a Scarf "

saleItem.description() → " This is a discounted Shirt "

Combining all results:

This is a Scarf

This is a Shirt

This is a Scarf

This is a discounted Shirt

This matches option B .

JavaScript Knowledge References (text-only)

Objects created from constructor functions use prototype chaining.

Overriding a subclass prototype method does not affect the parent class prototype.

Instances inherit the most specific version of the method on their prototype chain.

==================================================

userInformation is a plain JavaScript object:

{

id: " user-01 " ,

email: " user01@universalcontainers.demo " ,

age: 25

}

You can access object properties in two standard ways:

Dot notation : object.propertyName

Bracket notation : object[ ' propertyName ' ]

Apply to each option:

A. userInformation.email

Correct dot notation; accesses " user01@universalcontainers.demo " .

B. userInformation.get( " email " )

.get() is a method on Map instances, not on plain objects.

A regular object does not have a .get method; this would be TypeError.

C. userInformation[ " email " ]

Correct bracket notation; string " email " is used as the property key.

Returns " user01@universalcontainers.demo " .

D. userInformation[email]

Here email is treated as a variable, not a string literal.

Unless there is a variable named email defined with a value matching a property key, this will either:

Throw a ReferenceError (if email is not defined), or

Use the value of email as a computed key (not what is intended here).

It is not the correct way to access the " email " property literal.

Therefore, the correct ways are:

Answer: A, C

Relevant concepts: object property access (. vs []), plain objects vs Map, literal property names vs computed property names.

In ES6 class syntax, the special method used to initialize a new instance is called constructor.

A class definition syntax:

class ClassName {

constructor(param1, param2) {

this.prop1 = param1;

this.prop2 = param2;

}

}

The constructor method:

Is called automatically when you create a new instance with new ClassName(...).

Receives the arguments passed in the new expression.

Assigns values to this to set instance properties.

Applying this to Story

We want to be able to write:

const article = new Story( ' Some body ' , ' Author Name ' , 100);

and have:

article.body === ' Some body '

article.author === ' Author Name '

article.viewCount === 100

To achieve this, the class must have:

class Story {

constructor(body, author, viewCount) {

this.body = body;

this.author = author;

this.viewCount = viewCount;

}

}

So the correct line 02 is:

constructor(body, author, viewCount) {

Why the other options are incorrect

A. constructor() {

This defines a constructor with no parameters.

The lines inside the constructor use body, author, and viewCount, which would be undefined unless they exist in an outer scope (they normally do not).

This would lead to the instance properties being set to undefined in normal usage.

B. super(body, author, viewCount) {

super(...) is used inside a constructor of a subclass to call the parent class constructor.

You cannot use super(...) { as a method definition; this is invalid syntax in a class body.

Additionally, Story as given is not shown extending any class, so super is inappropriate here.

C. function Story(body, author, viewCount) {

Inside a class definition, you do not use the function keyword to define methods.

function Story(...) here would be invalid syntax in a class body.

Even if it were allowed, the special constructor method for a class is named constructor, not the class name.

Therefore, only:

constructor(body, author, viewCount) {

correctly declares the constructor for the Story class and ensures instances created with new Story(body, author, viewCount) have all three properties populated.

References / Study Guide concepts (no links):

ES6 class syntax

constructor method in classes

this and instance properties in classes

Difference between class constructors and regular functions

Invalid use of super and function inside class bodies

The correct answer is A .

JavaScript evaluates the expression from left to right:

true + 3 + ' 100 ' + null

Step 1:

true + 3

In numeric addition, true is converted to:

1

So:

true + 3

becomes:

1 + 3

Result:

4

Step 2:

4 + ' 100 '

Because one operand is a string, JavaScript performs string concatenation instead of numeric addition.

So:

4 + ' 100 '

becomes:

" 4100 "

Step 3:

" 4100 " + null

Again, because one operand is already a string, JavaScript converts null into the string:

" null "

So the final result is:

" 4100null "

Execution summary:

true + 3 + ' 100 ' + null

// 1 + 3 + ' 100 ' + null

// 4 + ' 100 ' + null

// " 4100 " + null

// " 4100null "

Therefore, the verified answer is A .