JavaScript를 이해하고 있는지 확인하기 위해 12가지 인터뷰 질문을 공유하세요!

자바스크립트를 아시나요? 다음 기사에서는 12가지 JavaScript 인터뷰 질문을 공유하고 이 12가지 인터뷰 질문에 모두 올바르게 답할 수 있는지 확인하세요.

JavaScript는 모든 프런트엔드 개발자가 숙지해야 할 기본 기술이지만, JavaScript를 완전히 이해하지 못하는 경우가 많습니다.

사람의 기술 수준을 테스트하는 두 가지 매우 간단한 방법이 있습니다. 그가 작성한 코드를 보거나 다른 사람이 작성한 코드를 보도록 합니다.

JavaScript에 대한 이해도를 테스트할 수 있는 몇 가지 코드 질문을 요약했습니다. 시도해 보고 모두 올바르게 답할 수 있는지 확인할 수 있습니다. 모든 질문에 올바르게 대답하면 JavaScript를 어느 정도 알고 있는 것으로 간주됩니다.

첫 번째 질문

출력을 추측해 보세요:

const person = { name: '代码与野兽' }
Object.defineProperty(person, 'age', { value: 18 })

console.log(person.age)
console.log(Object.keys(person))

출력:

18
['name']

분석:
defineProperty를 사용하여 정의된 속성은 기본적으로 열거할 수 없기 때문에 많은 사람들이 두 번째 출력을 쉽게 착각합니다. .

두 번째 질문

출력을 추측해 보세요:

const name = '代码与野兽'
age = 18

console.log(delete name)
console.log(delete age)
console.log(typeof age)

출력:

false
true
"undefined"

Analytic:
첫 번째 거짓은 삭제가 객체의 속성만 삭제할 수 있고 이름은 속성이 아니기 때문입니다. 그래서 삭제에 실패했습니다.
두 번째 사실은 변수를 생성하기 위해 어떤 선언도 사용하지 않기 때문입니다. 전역 변수로 간주되어 window 객체에 마운트됩니다. 이는 window.age 삭제와 동일하므로 삭제가 성공합니다.
세 번째 undefine은 나이가 삭제되었기 때문입니다.

세 번째 질문

출력을 추측해 보세요:

let person = { name: '代码与野兽' }
const members = [person]
person = null
console.log(members)

출력:

[{
  name: "代码与野兽"
}]

분석:
많은 사람들이 출력 결과가 [null]이어야 한다고 생각하지만, 우리는 person을 설정했습니다. this 변수에 대한 새로운 참조입니다. 이전 참조는 여전히 멤버에 있습니다.
간단히 말하면, { name: 'Code and the Beast' } 이 객체는 주소가 X201이라고 가정할 때 특정 메모리 공간에 존재합니다. 그 논리는 대략 다음과 같습니다:

let person = X201
const members = [X201]
persion = null

Question 4

출력을 추측해 보세요:

function SuperHero() {
  this.make = '代码与野兽'
  return { make: '野兽与代码'}
}

const mySuperhero = new SuperHero()
console.log(mySuperhero)

출력:

{
  make: "野兽与代码"
}

Analytic:
생성자가 최종적으로 객체를 반환하면, 그러면 모두 이전에 설정된 속성은 유효하지 않습니다.

질문 5

출력을 추측해 보세요:

const name = '代码与野兽'
console.log(name.padStart(14))
console.log(name.padStart(2))

출력:

"         代码与野兽"
"代码与野兽"

설명:
padStart 메소드는 문자열 시작 부분의 공백을 채울 수 있습니다.
매개변수는 새 문자열의 전체 길이입니다. 이 길이가 원래 문자열 길이보다 짧으면 패딩이 적용되지 않습니다.

Question 6

출력을 추측해 보세요:

console.log(parseInt("7"))
console.log(parseInt("7*6"))
console.log(parseInt("7Din"))

Output:

7
7
7

Parse:
parseInt의 매개변수가 문자열과 숫자의 조합인 경우 처음부터 끝까지 확인합니다. 데이터 유형 오류 위치가 발견되면 데이터 유형 오류 위치 앞에 유효한 숫자가 있으면 숫자를 반환합니다.

질문 7

출력을 추측해 보세요:

[1, 2, 3, 4].reduce((x, y) => console.log(x, y))

출력:

1
2
undefined
3
undefined
4

분석:
리듀스에 초기 값을 전달하지 않으면 x가 배열의 첫 번째 값이 됩니다. , y는 배열의 두 번째 값입니다.

Question 8

출력을 추측해 보세요:

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

const superHero = '代码与野兽'
const age = 1000

getUserInfo`${superHero} 是 ${age} 岁`
getUserInfo`hello`

출력:

["", " 是 ", " 岁"]
"代码与野兽"
1000
["hello"]
undefined
undefined

Analytic:
템플릿 문자열 구문을 사용하여 함수를 호출할 때 첫 번째 매개 변수는 항상 문자열의 분할 배열입니다. 나머지 매개변수는 템플릿 표현식의 값입니다.

Question 9

출력을 추측해 보세요:

(() => {
  let x, y;
  try {
    throw new Error()
  } catch (x) {
    (x = 1), (y = 2);
    console.log(x)
  }
  console.log(x)
  console.log(y)
})()

출력:

1
undefined
2

Analytic:
catch에서 x에 액세스할 때 외부 변수 x가 아닌 매개변수에 액세스됩니다.

질문 10

출력을 추측해 보세요:

class Clazz {}

console.log(typeof Clazz)

출력:

"function"

解析：
在 JavaScript 中，Class 也是 function。

第十一题

尝试推测它的输出：

const arr = [7, 1, 4, 3, 2];
for (const elem of arr) {
  setTimeout(() => console.log(elem), elem);
}

输出：

1
2
3
4
7

解析：
没什么好解释的......

第十二题

尝试推测它的输出：

const foo = { bar: 1 };
with(foo) {
  var bar = 2
};
console.log(foo.bar);

输出：

2

解析：

with 的对象会作为 global 对象。在 with 使用 var 等价于 window.[xxx]。而这时 foo 就是那个 window。

【相关推荐：javascript学习教程】

위 내용은 JavaScript를 이해하고 있는지 확인하기 위해 12가지 인터뷰 질문을 공유하세요!의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!