[Translation] Send you 43 JavaScript Face-to-Face Questions

  Front end, Interview, javascript

Introduction

These two daysGitHub Trending repositoriesBy a man namedjavascript-questionsSome of the projects have been recorded.JavaScriptTopic.

I read it from beginning to end. It was all some basic topics. It took me about half an hour (some of the topics were simple and could be swept away). Although the topics were simple, each topic corresponded to a knowledge point. If you had not touched the knowledge point, you would certainly have made a mistake. If you had touched the knowledge point, then the questions would be easy for you.

It is suggested that everyone also spend half an hour to do it, so as to find out the leak and fill the vacancy.

In order to make it easier for everyone to do the questions faster without wasting time on translation, I spent several hours translating them into Chinese, which of course has been authorized by the author.

Some points in the article are not completely explained by the author. In order to better understand, I have added some personal explanations to the article.

Warehouse address:https://github.com/lydiahalli …

JavaScript Advanced Question List

I’m in myInstagramThe newspaper published dailyJavaScriptI will also publish multiple choice questions here!

From Basic to Advanced: Testing Your RightJavaScriptThe degree of understanding, refresh your knowledge, or prepare for your coding interview! I update this project with new questions every week.

The answers are located in the folded section below the question and can be expanded by clicking on them. Good luck


1. What is the output of the following code?

function sayHi() {
  console.log(name);
  console.log(age);
  var name = "Lydia";
  let age = 21;
}

sayHi();
  • A:LydiaAndundefined
  • B:LydiaAndReferenceError
  • C:ReferenceErrorAnd21
  • D:undefinedAndReferenceError

<details><summary>Answer</summary>
<p>

Answer: d

In the function, we first use thevarKeyword declarationnameVariable. This means that variables are promoted during the creation phase (JavaScriptMemory space is allocated to the variable during its creation phase). The default value isundefinedUntil we actually execute to the line that uses the variable. We haven’t done anythingnameVariable is assigned, so it remainsundefinedThe value of.

UseletKeywords (andconst) declared variables will also have variable promotion, but withvarDifferent, initialization has not been promoted. They are inaccessible until we declare (initialize) them. This is called “temporary dead zone”. When we try to access a variable before declaring it,JavaScriptWill throw aReferenceError.

Translator’s note:

AboutletWhether there is a variable promotion of, why do we use the following example to verify:

let name = 'ConardLi'
{
  console.log(name) // Uncaught ReferenceError: name is not defined
  let name = 'code秘密花园'
}

letVariable if there is no variable promotion,console.log(name)It will be outputConardLi, the result is thrown outReferenceError, then this is a good illustration,letThere is also variable promotion, but it has a “temporary dead zone” that is not allowed to be accessed until the variable is initialized or assigned.

The assignment of variables can be divided into three stages:

  • Create variables to make room in memory
  • Initialize variables, initializing variables toundefined
  • True assignment

AboutletvarAndfunction

  • letThe “create” process of has been promoted, but initialization has not.
  • varThe “Create” and “Initialize” of have both been promoted.
  • functionThe “Create”, “Initialize” and “Assign” of have been upgraded.

</p>
</details>


2. What is the output of the following code?

for (var i = 0; i < 3; i++) {
  setTimeout(() => console.log(i), 1);
}

for (let i = 0; i < 3; i++) {
  setTimeout(() => console.log(i), 1);
}
  • A:0 1 2and0 1 2
  • B:0 1 2and3 3 3
  • C:3 3 3and0 1 2

<details><summary>Answer</summary>
<p>

Answer: c

Due toJavaScriptThe event execution mechanism in,setTimeoutWhen the function is actually executed, the loop has already completed. Because of the variables in the first loopiIs to usevarKeyword, so the value is global. During the loop, we use unary operators at a time++The city williThe value of increased1. So in the first example, when callingsetTimeoutFunction,iHas been assigned to3.

In the second cycle, useletKeyword declaration variablei: uselet(and)constThe variable declared by the keyword is block-scoped (block is{}Anything in between). During each iteration,iWill be created as a new value, and each value will exist in the block-level scope within the loop.

</p>
</details>


3. What is the output of the following code?

const shape = {
  radius: 10,
  diameter() {
    return this.radius * 2;
  },
  perimeter: () => 2 * Math.PI * this.radius
};

shape.diameter();
shape.perimeter();
  • A:20and62.83185307179586
  • B:20andNaN
  • C:20and63
  • D:NaNand63

<details><summary>Answer</summary>
<p>

Answer: b

Please note,diameterIs a normal function, andperimeterIt’s an arrow function.

For the arrow function,thisKeyword refers to the environment of its context (position when defined), which is different from ordinary functions! This means that when we callperimeter, it does not point toshapeObject, but refers to the window when it is defined. No valueradiusProperty, returnsundefined.

</p>
</details>


4. What is the output of the following code?

+true;
!"Lydia";
  • A:1andfalse
  • B:falseandNaN
  • C:falseandfalse

<details><summary>Answer</summary>
<p>

Answer: a

The one-dollar plus sign attempts tobooleanType to numeric type.trueConverted to1,falseConverted to0.

String'Lydia'Is a true value. What we are actually asking is “Is this true or false?” . This will returnfalse.

</p>
</details>


Which option is incorrect?

const bird = {
  size: "small"
};

const mouse = {
  name: "Mickey",
  small: true
};
  • A:mouse.bird.size
  • B:mouse[bird.size]
  • C:mouse[bird["size"]]
  • D: All of them are valid

<details><summary>Answer</summary>
<p>

Answer: a

InJavaScriptIn, all object keys are strings (exceptSymbol)。 Although sometimes we may not give string types, they are always converted to strings.

JavaScriptExplain the statement. When we use the square bracket notation, it will see the first opening bracket[, and then continue until the closing bracket is found]. Only then will it evaluate the statement.

mouse [bird.size]: First of all, it will be rightbird.sizeEvaluate to getsmall.mouse [“small”]Returntrue.

However, using point notation, this will not happen.mouseNo one namedbirdThis means thatmouse.birdYesundefined. Then, we use dot symbols to asksizemouse.bird.size. Due tomouse.birdYesundefinedWe are actually askingundefined.size. This is invalid and will be thrownCannot read property "size" of undefined.

</p>
</details>



6. What is the output of the following code?

let c = { greeting: "Hey!" };
let d;

d = c;
c.greeting = "Hello";
console.log(d.greeting);
  • A:Hello
  • B:undefined
  • C:ReferenceError
  • D:TypeError

<details><summary>Answer</summary>
<p>

Answer: a

InJavaScriptIn, when they are set equal to each other, all objects interact by reference.

First, variablescSave a value for the object. After that, we willdSpecify ascThe same reference as the object.

<img src=”https://user-gold-cdn.xitu.io …; h=342&f=png&s=18779″ width=”200″>

When one object is changed, all objects can be changed.

</p>
</details>


7. What is the output of the following code?

let a = 3;
let b = new Number(3);
let c = 3;

console.log(a == b);
console.log(a === b);
console.log(b === c);
  • A:true false true
  • B:false false true
  • C:true false false
  • D:false true true

<details><summary>Answer</summary>
<p>

Answer: c

new Number()Is a built-in function constructor. Although it looks like a number, it is not a real number: it has a lot of extra functions and is an object.

When we use==Operator, it only checks if it has the same value. They all have.3So it returnstrue.

Translator’s note:==Implicit type conversion will be triggered, and the object type on the right will be automatically unpacked asNumberType.

However, when we use===Operator, both types and values need to be equal.new Number()Not a number, but an object type. Both returnfalse.

</p>
</details>


8. What is the output of the following code?

class Chameleon {
  static colorChange(newColor) {
    this.newColor = newColor;
  }

  constructor({ newColor = "green" } = {}) {
    this.newColor = newColor;
  }
}

const freddie = new Chameleon({ newColor: "purple" });
freddie.colorChange("orange");
  • A:orange
  • B:purple
  • C:green
  • D:TypeError

<details><summary>Answer</summary>
<p>

Answer: d

colorChangeThe method is static. Static methods exist only in the constructor that created them and cannot be passed to any children. Due tofreddieIs a child object, the function will not pass, so in thefreddieDoes not exist on instancefreddieMethod: ThrowingTypeError.

</p>
</details>


9. What is the output of the following code?

let greeting;
greetign = {}; // Typo!
console.log(greetign);
  • A:{}
  • B:ReferenceError: greetign is not defined
  • C:undefined

<details><summary>Answer</summary>
<p>

Answer: a

The console will output an empty object because we have just created an empty object on the global object! When we mistakenly putgreetingThe input isgreetignJS interpreter actually treats it asglobal.greetign = {}(orwindow.greetign = {})。

In order to avoid this situation, we can use“use strict”. This ensures that variables must be declared before they can be assigned values.

</p>
</details>


10. What happens when we do this?

function bark() {
  console.log("Woof!");
}

bark.animal = "dog";
  • A: Nothing, this is totally fine!
  • B:SyntaxError. You cannot add properties to a function this way.
  • C:undefined
  • D:ReferenceError

<details><summary>Answer</summary>
<p>

Answer: a

This is inJavaScriptThis is possible because functions are also objects! (Everything except the original type is an object)

Function is a special type of object. The code you write yourself is not an actual function. This function is an object with an attribute that is callable.

</p>
</details>


11. What is the output of the following code?

function Person(firstName, lastName) {
  this.firstName = firstName;
  this.lastName = lastName;
}

const member = new Person("Lydia", "Hallie");
Person.getFullName = () => this.firstName + this.lastName;

console.log(member.getFullName());
  • A:TypeError
  • B:SyntaxError
  • C:Lydia Hallie
  • D:undefined undefined

<details><summary>Answer</summary>
<p>

Answer: a

You cannot add attributes to constructors as you would with regular objects. If you want to add functionality to all objects at once, you must use prototypes. So in this case should write like this:

Person.prototype.getFullName = function () {
  return `${this.firstName} ${this.lastName}`;
}

This will makemember.getFullName()Is available, why is it right? Suppose we add this method to the constructor itself. Maybe not everyonePersonAll instances need this method. This wastes a lot of memory space because they still have this attribute, which takes up memory space in each instance. On the contrary, if we only add it to the prototype, we only need to put it in a place in memory, but they can all access it!

</p>
</details>


12. What is the output of the following code?

function Person(firstName, lastName) {
  this.firstName = firstName;
  this.lastName = lastName;
}

const lydia = new Person("Lydia", "Hallie");
const sarah = Person("Sarah", "Smith");

console.log(lydia);
console.log(sarah);
  • A:Person {firstName: "Lydia", lastName: "Hallie"}andundefined
  • B:Person {firstName: "Lydia", lastName: "Hallie"}andPerson {firstName: "Sarah", lastName: "Smith"}
  • C:Person {firstName: "Lydia", lastName: "Hallie"}and{}
  • D:Person {firstName: "Lydia", lastName: "Hallie"}andReferenceError

<details><summary>Answer</summary>
<p>

Answer: a

ForsarahWe didn’t use itnewKey words. UsenewWhen, it refers to the new empty object we created. However, if you don’t addnewIt refers to global objects!

We have designatedthis.firstNameequal to'SarahAndthis.lastNameequal toSmith. What we actually do is defineglobal.firstName ='Sarah'Andglobal.lastName ='Smith.sarahThe return value of itself isundefined.

</p>
</details>


12. What are the three stages of event dissemination? ?

  • A: target > capture > bubbling
  • B: bubbling > target > capture
  • C: target > bubbling > capture
  • D: capture > target > bubbling

<details><summary>Answer</summary>
<p>

Answer: d

In the capture phase, events are passed down through the parent element to the target element. Then it reaches the target element and bubbling begins.

<img src=”https://user-gold-cdn.xitu.io …; h=272&f=png&s=24320″ width=”200″>

</p>
</details>


13. All objects have prototypes.

  • A: yes
  • B: error

<details><summary>Answer</summary>
<p>

Answer: b

Except ..Basic objectIn addition, all objects have prototypes. The underlying object can access certain methods and properties, such as.toString. This is what you can use built-inJavaScriptThe reason for the method! All these methods can be found on the prototype. AlthoughJavaScriptIt cannot be found directly on your object, but it will look down the prototype chain and find it there, which allows you to access it.

Translator’s Note: The basic object refers to the object at the end of the prototype chain. The prototype of the underlying object isnull.

</p>
</details>


14. What is the output of the following code?

function sum(a, b) {
  return a + b;
}

sum(1, "2");
  • A:NaN
  • B:TypeError
  • C:"12"
  • D:3

<details><summary>Answer</summary>
<p>

Answer: c

JavaScriptIs a kind ofDynamic type language: We did not specify the type of some variables. Without your knowledge, the value can be automatically converted to another type, called implicit type conversion.MandatoryConvert from one type to another.

In this example,JavaScriptPut a number1Converts to a string to make the function meaningful and return a value. In allowing numeric types (1) and string types ('2') are added, the number is treated as a string. We can connect images“Hello”+“World”This string, so what happens here is“1”+“2”Return“12”.

</p>
</details>


15. What is the output of the following code?

let number = 0;
console.log(number++);
console.log(++number);
console.log(number);
  • A:1 1 2
  • B:1 2 2
  • C:0 2 2
  • D:0 1 2

<details><summary>Answer</summary>
<p>

Answer: c

SuffixUnary operator++

  1. Return value (return0)
  2. Value added (the figure is now1)

PrefixUnary operator++

  1. Value added (the figure is now2)
  2. Return value (return2)

So return0 2 2.

</p>
</details>


16. What is the output of the following code?

function getPersonInfo(one, two, three) {
  console.log(one);
  console.log(two);
  console.log(three);
}

const person = "Lydia";
const age = 21;

getPersonInfo`${person} is ${age} years old`;
  • A:Lydia 21 ["", "is", "years old"]
  • B:["", "is", "years old"] Lydia 21
  • C:Lydia ["", "is", "years old"] 21

<details><summary>Answer</summary>
<p>

Answer: b

If a marked template string is used, the value of the first parameter is always an array of string values. The remaining parameters get the value of the expression passed into the template string!

</p>
</details>


17. What is the output of the following code?

function checkAge(data) {
  if (data === { age: 18 }) {
    console.log("You are an adult!");
  } else if (data == { age: 18 }) {
    console.log("You are still an adult.");
  } else {
    console.log(`Hmm.. You don't have an age I guess`);
  }
}

checkAge({ age: 18 });
  • A:You are an adult!
  • B:You are still an adult.
  • C:Hmm.. You don't have an age I guess

<details><summary>Answer</summary>
<p>

Answer: c

In comparison equality, the original types are compared by their values, while the objects are compared by their references.JavaScriptChecks whether an object has a reference to the same location in memory.

The objects we pass as parameters and the objects we check for equality are located in different locations in memory, so their references are different.

That’s why.{ age: 18 } === { age: 18 }And{ age: 18 } == { age: 18 }ReturnfalseWhy?

</p>
</details>


18. What is the output of the following code?

function getAge(...args) {
  console.log(typeof args);
}

getAge(21);
  • A:"number"
  • B:"array"
  • C:"object"
  • D:"NaN"

<details><summary>Answer</summary>
<p>

Answer: c

Extension operator (... args) returns an array with parameters. An array is an object, sotypeof argsReturnobject.

</p>
</details>


20. What is the output of the following code?

function getAge() {
  "use strict";
  age = 21;
  console.log(age);
}

getAge();
  • A:21
  • B:undefined
  • C:ReferenceError
  • D:TypeError

<details><summary>Answer</summary>
<p>

Answer: c

Use“use strict”To ensure that global variables are not accidentally declared. We never declare variablesageBecause we use`use strict'Which throws aReferenceError. If we don’t use it“use strict”, it works because the propertyageWill be added to the global object.

</p>
</details>


21. What is the output of the following code?

const sum = eval("10*10+5");
  • A:105
  • B:"105"
  • C:TypeError
  • D:"10*10+5"

<details><summary>Answer</summary>
<p>

Answer: a

evalThe code passed by the string is evaluated. If it is an expression, as in this case, it evaluates the expression. The expression is10 * 10 + 5Calculated105.

</p>
</details>


22. How long can COOL _ SECRET visit?

sessionStorage.setItem("cool_secret", 123);
  • A: Data will never be lost.
  • B: when the user closes the tab.
  • C: When the user closes the entire browser, not only the tabs.
  • D: when the user shuts down the computer.

<details><summary>Answer</summary>
<p>

Answer: b

When the tab is closed, the data stored in thesessionStorageData in.

If usedlocalStorage, data will always exist unless, for example, you calllocalStorage.clear().

</p>
</details>


23. What is the output of the following code?

var num = 8;
var num = 10;

console.log(num);
  • A:8
  • B:10
  • C:SyntaxError
  • D:ReferenceError

<details><summary>Answer</summary>
<p>

Answer: b

UsevarKeyword, you can declare multiple variables with the same name. The variable will then hold the latest value.

You cannot useletOrconstTo achieve this, because they are block-scoped.

</p>
</details>


24. What is the output of the following code?

const obj = { 1: "a", 2: "b", 3: "c" };
const set = new Set([1, 2, 3, 4, 5]);

obj.hasOwnProperty("1");
obj.hasOwnProperty(1);
set.has("1");
set.has(1);
  • A:false true false true
  • B:false true true true
  • C:true true false true
  • D:true true true true

<details><summary>Answer</summary>
<p>

Answer: c

All object keys (excludingSymbols) are stored as strings, even if you do not have a key of the given string type. That’s why.obj.hasOwnProperty('1')Also returntrue.

The above statement does not apply toSet. In ourSetNo“1”set.has('1')Returnfalse. It has a number type1,set.has(1)Returntrue.

</p>
</details>


25. What is the output of the following code?

const obj = { a: "one", b: "two", a: "three" };
console.log(obj);
  • A:{ a: "one", b: "two" }
  • B:{ b: "two", a: "three" }
  • C:{ a: "three", b: "two" }
  • D:SyntaxError

<details><summary>Answer</summary>
<p>

Answer: c

If the object has two keys with the same name, the previous key will be replaced. It will still be in the first position, but with the last specified value.

</p>
</details>


26. JavaScript global execution context creates two things for you: global object and this keyword.

  • A: yes
  • B: error
  • C: it depends

<details><summary>Answer</summary>
<p>

Answer: a

The basic execution context is the global execution context: it is content that can be accessed anywhere in the code.

</p>
</details>


27. What is the output of the following code?

for (let i = 1; i < 5; i++) {
  if (i === 3) continue;
  console.log(i);
}
  • A:1 2
  • B:1 2 3
  • C:1 2 4
  • D:1 3 4

<details><summary>Answer</summary>
<p>

Answer: c

If a condition returnstrue, thencontinueStatement skips iteration.

</p>
</details>


28. What is the output of the following code?

String.prototype.giveLydiaPizza = () => {
  return "Just give Lydia pizza already!";
};

const name = "Lydia";

name.giveLydiaPizza();
  • A:"Just give Lydia pizza already!"
  • B:TypeError: not a function
  • C:SyntaxError
  • D:undefined

<details><summary>Answer</summary>
<p>

Answer: a

StringIs a built-in constructor that we can add attributes to. I just added a method to its prototype. The original type of string is automatically converted into a string object, which is generated by the string prototype function. Therefore, all strings (string objects) can access the method!

Translator’s note:

When calling with a basic type of stringgiveLydiaPizzaIn fact, the following process occurred:

  • Create aStringThe package type instance of
  • Called on the instancesubstringMethod
  • Destruction instance

</p>
</details>


29. What is the output of the following code?

const a = {};
const b = { key: "b" };
const c = { key: "c" };

a[b] = 123;
a[c] = 456;

console.log(a[b]);
  • A:123
  • B:456
  • C:undefined
  • D:ReferenceError

<details><summary>Answer</summary>
<p>

Answer: b

Object keys are automatically converted to strings. We tried to set an object as an objectaThe key of the, whose value is123.

However, when the object is automatically converted to stringing, it becomes[Object object]. So what we’re talking about here isa["Object object"] = 123. Then, we can try to do the same thing again.cObjects are also implicitly typed. So,a["Object object"] = 456.

Then, we printa[b]Which is actuallya["Object object"]. We set it to456And therefore returns456.

</p>
</details>


30. What is the output of the following code?

const foo = () => console.log("First");
const bar = () => setTimeout(() => console.log("Second"));
const baz = () => console.log("Third");

bar();
foo();
baz();
  • A:First Second Third
  • B:First Third Second
  • C:Second First Third
  • D:Second Third First

<details><summary>Answer</summary>
<p>

Answer: b

We have onesetTimeoutFunction and call it first. However, it was finally printed.

This is because in the browser, we don’t only have a runtime engine, we also have one calledWebAPIThings.WebAPIHas provided us withsetTimeoutFunctions such asDOM.

willcallbackPush toWebAPIAfter that,setTimeoutFunction itself (but not callback! ) pops out of the stack.

<img src=”https://user-gold-cdn.xitu.io …; h=592&f=png&s=33812″ width=”200″>

Now, callfooAnd printFirst.

<img src=”https://user-gold-cdn.xitu.io …; h=592&f=png&s=27983″ width=”200″>

fooEject from stack,bazCalled and printedThird.

<img src=”https://user-gold-cdn.xitu.io …; h=600&f=png&s=28037″ width=”200″>

WebAPIYou cannot just add content to the stack when you are ready. Instead, it pushes the callback function to atask queueThings.

<img src=”https://user-gold-cdn.xitu.io …; h=580&f=png&s=24682″ width=”200″>

This is where the cycle of events begins to work.Event cycleView stacks and task queues. If the stack is empty, it occupies the first content in the queue and pushes it onto the stack.

<img src=”https://user-gold-cdn.xitu.io …; h=596&f=png&s=24825″ width=”200″>

barCalled,SecondWhen printed, it pops out of the stack.

</p>
</details>


31. what is the event.target when the button is clicked?

<div onclick="console.log('first div')">
  <div onclick="console.log('second div')">
    <button onclick="console.log('button')">
      Click!
    </button>
  </div>
</div>
  • A:divExternal
  • B:divInternal
  • C:button
  • D: array of all nested elements.

<details><summary>Answer</summary>
<p>

Answer: c

The deepest nested element that causes the event is the target of the event. You can passevent.stopPropagationStop bubbling

</p>
</details>


32. Click on the following html fragment to print what is it?

<div onclick="console.log('div')">
  <p onclick="console.log('p')">
    Click here!
  </p>
</div>
  • A:p div
  • B:div p
  • C:p
  • D:div

<details><summary>Answer</summary>
<p>

Answer: a

If we clickp, we will see two logs:pAnddiv. There are three stages during the event propagation: capture, target and bubbling. By default, the event handler executes during the bubbling phase (unless youuseCaptureSet totrue)。 It extends outward from the deepest nested element.

</p>
</details>


33. What is the output of the following code?

const person = { name: "Lydia" };

function sayHi(age) {
  console.log(`${this.name} is ${age}`);
}

sayHi.call(person, 21);
sayHi.bind(person, 21);
  • A:undefined is 21 Lydia is 21
  • B:function function
  • C:Lydia is 21 Lydia is 21
  • D:Lydia is 21 function

<details><summary>Answer</summary>
<p>

Answer: d

Using both, we can deliver what we wantthisThe object referenced by the keyword. But,.callThe method will be executed immediately!

.bindThe method returns the copy value of the function, but with the bound context! It will not be implemented immediately.

</p>
</details>


34. What is the output of the following code?

function sayHi() {
  return (() => 0)();
}

typeof sayHi();
  • A:"object"
  • B:"number"
  • C:"function"
  • D:"undefined"

<details><summary>Answer</summary>
<p>

Answer: b

sayHiThe function returns the function called immediately (IIFEThe return value of the. This function returns0, of typenumber.

For reference only: there are only 7 built-in types:null,undefined,boolean,number,string,objectAndsymbol.functionIs not a type because the function is an object and its type isobject.

</p>
</details>


35. Which of the following values are false?

0;
new Number(0);
("");
(" ");
new Boolean(false);
undefined;
  • A:0,'',undefined
  • B:0,new Number(0),'',new Boolean(false),undefined
  • C:0,'',new Boolean(false),undefined
  • D: All are false values

<details><summary>Answer</summary>
<p>

Answer: a

JavaScriptThere are only 6 false values in:

  • undefined
  • null
  • NaN
  • 0
  • ''(empty string)
  • false

Function constructor, such asnew NumberAndnew BooleanIt’s all true.

</p>
</details>


36. What is the output of the following code?

console.log(typeof typeof 1);
  • A:"number"
  • B:"string"
  • C:"object"
  • D:"undefined"

<details><summary>Answer</summary>
<p>

Answer: b

typeof 1Return"number".
typeof "number"Return"string"

</p>
</details>


37. What is the output of the following code?

const numbers = [1, 2, 3];
numbers[10] = 11;
console.log(numbers);
  • A:[1, 2, 3, 7 x null, 11]
  • B:[1, 2, 3, 11]
  • C:[1, 2, 3, 7 x empty, 11]
  • D:SyntaxError

<details><summary>Answer</summary>
<p>

Answer: c

When you set a value for an element in an array that exceeds the length of the array,JavaScriptA thing called “empty slot” will be created. The values for these locations are actuallyundefined, but you will see something similar:

[1, 2, 3, 7 x empty, 11]

It depends on where you run it (each browser may be different).

</p>
</details>


38. What is the output of the following code?

(() => {
  let x, y;
  try {
    throw new Error();
  } catch (x) {
    (x = 1), (y = 2);
    console.log(x);
  }
  console.log(x);
  console.log(y);
})();
  • A:1 undefined 2
  • B:undefined undefined undefined
  • C:1 1 2
  • D:1 undefined undefined

<details><summary>Answer</summary>
<p>

Answer: a

catchBlock reception parametersx. When we pass parameters, this is related to thexDifferent. This variablexIt belongs tocatchOf scope.

After that, we set the variable of this block-level scope to1And set variablesyThe value of. Now, let’s print the variables for the block-level scope.xWhich is equal to1.

IncatchOutside the block,xis stillundefined, andyYes2. When we want tocatchOutside the blockconsole.log(x), it returnsundefined, andyReturn2.

</p>
</details>


39. Everything in JavaScript is …

  • A: original or object
  • B: function or object
  • C: skills! Only objects
  • D: number or object

<details><summary>Answer</summary>
<p>

Answer: a

JavaScriptOnly the original types and objects.

The original type isboolean,null,undefined,bigint,number,stringAndsymbol.

</p>
</details>


40. What is the output of the following code?

[[0, 1], [2, 3]].reduce(
  (acc, cur) => {
    return acc.concat(cur);
  },
  [1, 2]
);
  • A:[0, 1, 2, 3, 1, 2]
  • B:[6, 1, 2]
  • C:[1, 2, 0, 1, 2, 3]
  • D:[1, 2, 6]

<details><summary>Answer</summary>
<p>

Answer: c

[1,2]Is our initial value. This is the beginning of our implementation.reduceThe initial value of the function and the firstaccThe value of. In the first round,accYes[1,2],curYes[0,1]. We connected them and the result was[1,2,0,1].

Then,accThe value of is[1,2,0,1],curThe value of is[2,3]. We connect them and get[1,2,0,1,2,3].

</p>
</details>


41. What is the output of the following code?

!!null;
!!"";
!!1;
  • A:false true false
  • B:false false true
  • C:false true true
  • D:true true false

<details><summary>Answer</summary>
<p>

Answer: b

nullIt’s a false value.! nullReturntrue.! trueReturnfalse.

""It’s a false value.! ""Returntrue.! trueReturnfalse.

1It’s true.! 1Returnfalse.! falseReturntrue.

</p>
</details>


42.setIntervalWhat is the return value of the method?

setInterval(() => console.log("Hi"), 1000);
  • A: A unique oneid
  • B: number of milliseconds specified
  • C: transfer function
  • D:undefined

<details><summary>Answer</summary>
<p>

Answer: a

It returns a uniqueid. ThisidCan be usedclearInterval()Function to clear the timer.

</p>
</details>


43. What is the return value of the following code?

[..."Lydia"];
  • A:["L", "y", "d", "i", "a"]
  • B:["Lydia"]
  • C:[[], "Lydia"]
  • D:[["L", "y", "d", "i", "a"]]

<details><summary>Answer</summary>
<p>

Answer: a

Strings are iterative. The extension operator maps each character of the iteration to an element.

</p>
</details>

Summary

I hope you can reach the following points after reading this article:

  • UnderstandElectronThe basic operating principle of
  • MasterElectronCore Basic Knowledge of Development
  • UnderstandElectronOn the basic use of functions such as bullet frame, printing, protection, packaging, etc.

If there are any mistakes in the article, please correct them in the comment area. If this article helps you, please comment and pay attention.

If you want to read more quality articles, please pay attention to me.github博客Your star✨, praise and attention are the driving force of my continuous creation!

Recommended for everyoneFundebug, a very useful BUG monitoring tool ~

It is recommended to pay close attention to my WeChat public number “code Secret Garden” and push high-quality articles every day so that we can communicate and grow together.

图片描述

After paying attention to the public number, reply [Add Group] to pull you into the high-quality front-end communication group.