Interessant! 9 wundervolle und interessante Front-End-Interviewfragen!

Sind euch während des Interviews irgendwelche interessanten und seltsamen Fragen begegnet? Werfen wir heute einen Blick auf einige interessante und interessante Fragen im Interview!

1. Welchen Wert haben Zahlen?

Was ist bitte die Ausgabe?

const len = 5
const nums = []
for (var i = 0; i < len; i++);{
  nums.push(i + 1)
}

console.log(nums)

Analyse und Lösung

Zunächst einmal glaube ich nicht, dass es bei dieser Frage darum geht, die Programmierfähigkeiten des Kandidaten zu prüfen. Er prüft Kandidaten auf Augenprobleme. Wenn Sie das Semikolon nicht bemerkt haben, müssen Sie gedacht haben, dass Nums [0, 1, 2, 3, 4] sei.

const len = 5
const nums = []
for (var i = 0; i < len; i++);
// At this time, i has become 6
{
  nums.push(i + 1)
}

console.log(nums) // [ 6 ]

2. Sollten Sie beim Sortieren von Fallen vorsichtig sein?

Was ist bitte die Ausgabe?

const arr = [1, 30, 4, 21, 100000]
console.log(arr.sort())

Analyse und Lösung

Intuitiv denken wir, dass die Antwort [1, 4, 21, 30, 100000] lauten sollte, aber wir haben die Vergleichsfunktion nicht bestanden, sodass das Ergebnis nicht unseren Vorstellungen entspricht.

Von MDN:

Tipp: Geben Sie eine Funktion an, die die Sortierreihenfolge definiert. Wenn es weggelassen wird, werden Array-Elemente in Zeichenfolgen konvertiert und dann nach dem Unicode-Codepunktwert jedes Zeichens sortiert.

const arr = [1, 30, 4, 21, 100000]
// the array elements are converted to strings, then sorted according to each character's Unicode code point value
const charCodesOfArr = arr.map((num) => `${num}`.charCodeAt()) // [49, 51, 52, 50, 49]
// so the answer is [1, 100000, 21, 30, 4]
console.log(arr.sort())

3. Kenntnisse über den Import und Export von ES6-Modulen

Ich glaube, das ist zu einfach für dich. Schreiben Sie die Antwort direkt!

// a.js
export default () => "Hello medium"
export const name = "fatfish"
// b.js
import * as data from "./a.js"
console.log(data) // { default: function default (), name: "fatfish" }

4. Verwenden Sie Objekte als Eigenschaftsschlüssel

Was ist bitte die Ausgabe?

const x = {}
const y = { key: 'y' }
const z = { key: 'z' }
x[y] = 'fatfish'
x[z] = 'medium'
console.log(x[y])

analysieren

Wie wir alle wissen, endet die Verwendung eines Objekts als Eigenschaftsschlüssel folgendermaßen: Der eigentliche Schlüssel ist [Objekt Objekt].

const objKey = { key: 'fatfish' }
const obj = {
  [ objKey ]: 'fatfish'
}
console.log(obj) // { [object Object]: "fatfish" }

Antwort

Was ist also die Antwort? Vielleicht denken Sie, dass es sich um Fettfisch handelt, aber mittel ist die endgültige Antwort.

const x = {}
const y = { key: 'y' }
const z = { key: 'z' }
x[y] = 'fatfish' // x => { [object Object]: "fatfish" }
x[z] = 'medium' // x => { [object Object]: "medium" }
console.log(x[y]) // medium

5. SetTimeout in der for-Schleife?

Was ist bitte die Ausgabe?

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

Analyse und Lösung

Wird nach 1 Sekunde 0,1,2 gedruckt? Nein, 1 wird nach 1 Sekunde zu 3, sodass 3 dreimal hintereinander gedruckt wird.

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

Was ist, wenn wir nach 1 Sekunde 0,1,2 ausdrucken möchten?

// 1. Use let instead of var
for (let i = 0; i < 3; i++) {
  setTimeout(() => {
    console.log(i) // 0 1 2
  }, 1000)
}
// 2. Using closures
for (var i = 0; i < 3; i++) {
  ((n) => {
    setTimeout(() => {
      console.log(n) //  0 1 2
    }, 1000)
  })(i)
}

6. Kennen Sie einige grundlegende Konvertierungsregeln?

Was ist bitte die Ausgabe?

console.log(+true)
console.log(!'fatfish')

Analyse und Lösung

// The + operator
converts the Boolean to a number, true is converted to 1, and false is converted to 0
console.log(+true) // 1
// The string "fatfish" is a true value, use ! It will become false
console.log(!'fatfish')

7. Die Falle der Variablendefinition!

Was ist bitte die Ausgabe?

const fn = () => {
  let x = y = 1000
  x++
  return x
}

fn()
console.log(typeof x)
console.log(typeof y)

Analyse und Lösung

Vielleicht denken 99 % der Ingenieure, dass die Antwort *undefiniert sein sollte, weil sie nicht wissen, wie man globale Variablen definiert.

const fn = () => {
 // let x = y = 1000
 // it is equivalent to the following code
 let x = 1000
 // Note that here, we define a global variable y
 y === 1000
  x++
  return x
}
fn()
console.log(typeof x) // undefined
console.log(typeof y) // y equals 1000, so typeof y is number

8. Was ist das Heben von Variablen in JavaScript?

Was ist bitte die Ausgabe?

var x = 'fatfish'
const fn = () => {
  // No.3
  console.log(x)
  var x = 'medium'
  // No.4
  console.log(x)
}
// No.1
console.log(x)
fn()
// No.2
console.log(x)

Analyse und Lösung

Die Antwort auf die erste und die zweite Frage ist sehr einfach und jeder kennt die Antwort. Aber #3 und #4 sind nicht so einfach.

Zumal 3 das Problem des variablen Hebens mit sich bringt.

var x = 'fatfish'
const fn = () => {
  // No.3
  // Variable hoisting occurs when a variable is declared with var.
  var x = undefined
  // So at this time the value of x is undefined
  console.log(x)
  // var x = 'medium'
  x = 'medium'
  // No.4
  // The value of x is medium
  console.log(x)
}
// No.1
console.log(x) // fatfish
fn()
// No.2
console.log(x) // fatfish

9. Wie lang ist das Array?

Was ist bitte die Ausgabe?

const nums = [ 10, 18, 0, 11, 9 ]
nums.length = 0

console.log(nums[3])

Analyse und Lösung

Ist die Antwort 11? Wenn es 11 ist, bedeutet das, dass Sie nicht genug über das Längenattribut des Arrays wissen.

Wenn Sie „nums.length = 0“ verwenden, bedeutet dies, dass „nums“ leer wird.

const nums = [ 10, 18, 0, 11, 9 ]
nums.length = 0 // it causes nums to become []

console.log(nums[3]) // undefined

zu guter Letzt

Wenn Sie alles über das Frontend wissen möchten, hinterlassen Sie uns bitte eine Nachricht!

Lassen Sie hervorragende Lehrmittel nicht länger einsam und selbstgefällig sein und teilen Sie sie mit Ihnen

——Qianfeng Digital Wisdom Front-End

Guess you like

Origin blog.csdn.net/sdasadasds/article/details/132693355