면접 준비 — 기본 JavaScript-2

이 시리즈의 두 번째 부분을 환영합니다.우리가 떠난 곳부터 시작하자.
문제4 - 함수 성명과 함수 표현식 사이에는 어떤 차이가 있습니까?
대부분의 언어에서 응답 함수 성명은 정의 함수이지만, 함수 표현식은 익명 함수를 변수에 분배하는 것이다.
아래의 예시를 고려하다.우리는 함수 설명을 정의하기 전에 호출할 수도 있지만, 함수 표현식에 대해서는 그렇지 않습니다. 인용 오류가 발생합니다.
funcD(); //Output - Function declaration
funcE(); //Reference error

function funcD() {
  console.log('Function declaration');
}

let funcE = function() {
  console.log('Function expression');  
};

/*
Exception: ReferenceError: can't access lexical declaration `funcE' before initialization
[@Scratchpad](http://twitter.com/Scratchpad)/1:2:1
*/
주의: 역할 영역과 폐쇄에 대한 상세한 설명은 제 블로그에서 찾을 수 있습니다.
질문 5 - JavaScript가 동기화됩니까 아니면 비동기화됩니까? 이벤트 순환은 무엇입니까?
답변 JavaScript는 동기화된 단일 스레드 언어입니다.자바스크립트의 비동기적 행위(setTimeout, 리셋, 약속)는 자바스크립트 자체의 일부분이 아니라 브라우저의 자바스크립트 언어 위에 구축되어 브라우저api를 통해 접근합니다.

Now, the browser have a Call Stack, Browser API and Message Queue and the order of there processing is called event loop.


다음 코드를 고려하십시오.이것은 설정이 0ms를 초과하더라도 A C B를 출력합니다.
function main(){
  console.log('A');
  setTimeout(
    function(){ console.log('B'); }
  ,0);
 console.log('C');
}
main();

//Output
// A
// C
// B
이 점을 알고 싶다면, 우리는 내재적으로 집행 과정에서 작용을 발휘하는 것을 보아야 한다.main () 은 호출 창고에 밀어넣고 컨트롤러는 A를 기록합니다. 그리고 팝업되고 setTimeout은 호출 창고에 밀어넣습니다.현재 setTimeout()은 브라우저 API를 사용하기 때문에 그곳으로 전송되고 컨트롤러 로그 C는 호출 창고로 전송됩니다.
0ms 지연되더라도 setTimeout의 exec () 는 메시지 대기열로 이동해야 합니다.
main () 의 모든 문장을 실행하고 호출 창고가 비어 있으면 메시지 대기열에 있는 exec () 를 호출 창고로 보낼 수 있습니다.
집행 기간의 내부 업무
이것은 전체 이벤트가 브라우저에서 순환하는 작업 방식입니다. setTimeout이나 모든 API 호출 같은 비동기적인 호출을 실행합니다.
주: 이 답안은 Philip Roberts의 대화에 큰 영향을 받았다.
문제 6 - 아래의 출력은 무엇입니까?
console.log('A');
setTimeout(
    function(){ console.log('B'); }
,0);
console.log('C');
답이 같은 출력은 C B가 됩니다. 문제 5에서 보여준 이벤트 순환 개념 때문에 0ms의 setTimeout이 있어도 마지막으로 호출됩니다.
문제 7 - 폐쇄가 무엇입니까, 우리는 그것을 어떻게 사용합니까?
답안 패키지는 기본적으로 내부 함수로 외부 함수에 저장된 변수의 범위 정보를 저장한다.
다음 코드를 고려하십시오.변수 b는 외부 함수에서 네 번째 줄에서 열 번째 줄까지의 범위가 있다.따라서 13줄에서 외부 함수를 호출할 때 b의 값에 접근할 수 있지만 14줄에는 외부 함수가 없습니다.
그러면 innerFn () 은 b의 값에 어떻게 접근합니까? 이것이 바로 패키지를 닫는 JS 특성이 작용하는 곳입니다.
6행에서 var internal을 만들 때 JS 엔진은 함수 대상 정보를 저장할 뿐만 아니라 범위 정보도 저장합니다*따라서 내부 함수 대상에 변수 **b*의 범위를 저장합니다.
현재 이 파일에서든 어떤 제3자 파일에서든 내부에서 호출하는 것은 중요하지 않다.그것은 마치 스냅샷을 찍은 것처럼 a와 b의 값을 시종 기억할 것이다.
작용하는 폐합
주의: 제 글에서 패키지 닫기에 대한 상세한 설명을 찾을 수 있습니다.
질문 8 - "this"키워드를 JavaScript로 설명하시겠습니까?
JavaScript "this"키워드에 대답하는 것은 단지 하나의 범위나 함수나 대상에 있다면, "this"는 당신이 있는 범위/함수/대상을 나타냅니다.우리는 각종 언어 환경에서'this'를 사용할 수 있다.한번 봅시다.

전 세계적으로 "this"


우리가 전역적으로 이 작업을 진행할 때, 아래의 예시와 같이, 창과 함께 인용할 수도 있다.
'this'는 전 세계적으로

방법 중의 "this"


함수cleanTable () 이 있는 개인 대상 nabsRoom을 보여 줍니다.현재 함수의 "this"는 대상 nabsRoom의 표를 가리킨다.
'this'방법에서

함수의 "this"


현재, 만약 우리가cleanTable () 이라는 함수를 가지고 있다면, "this"는 창을 가리킨다
"this"함수 내
문제 9 - 호출 방법의 "this"키워드를 설명합니까?
응답 호출 방법은 특정한 대상을 가진 함수를 호출하는 데 사용되며, 이러한 상황에서 "this"는 이 대상에 사용된다.우리도 그것에 대해 약간의 논점을 전달할 수 있다.
호출 방법의 "this"키워드
문제 10 - 다음 코드가 내부 함수에서'this'에 접근하는 다른 방식은 무엇입니까?
const cleanTable = function(soap) {
  const innerFunc = function(_soap) {
    console.log(`Cleaning ${this.table} with ${_soap}`)      
  }
  innerFunc(soap);
}

let nabsRoom = {
  table: "nabs table"
}

cleanTable.call(nabsRoom, "Harpic"); 
//Output - Cleaning undefined with Harpic
innerFunc()에서 "this"에 액세스하는 데는 네 가지 해결 방안이 있습니다.

솔루션 1


cleanTable () 에서 "that"변수를 사용하여 innerFunc () 의 "this"에 액세스합니다.기본적으로'그것'은 외부의'이것'일 뿐이다.
const cleanTable = function(soap) {
  let that = this;
  const innerFunc = function(_soap) {    
    console.log(`Cleaning ${that.table} with ${_soap}`)      
  }
  innerFunc(soap);
}

let nabsRoom = {
  table: "nabs table"
}

cleanTable.call(nabsRoom, "Harpic");
//Output - Cleaning nabs table with Harpic

솔루션 2


call 메서드를 사용하여 innerFunc() 내에서 외부 "this"를 사용합니다.
const cleanTable = function(soap) {
  const innerFunc = function(_soap) {    
    console.log(`Cleaning ${this.table} with ${_soap}`)      
  }
  innerFunc.call(this, soap);
}

let nabsRoom = {
  table: "nabs table"
}

cleanTable.call(nabsRoom, "Harpic");
//Output - Cleaning nabs table with Harpic

솔루션 3


bind 메서드를 사용하여 innerFunc() 내에서 외부 "this"를 사용합니다.
const cleanTable = function(soap) {
  const innerFunc = function(_soap) {    
    console.log(`Cleaning ${this.table} with ${_soap}`)      
  }
  innerFunc.bind(this)(soap);
}

let nabsRoom = {
  table: "nabs table"
}

cleanTable.call(nabsRoom, "Harpic");
//Output - Cleaning nabs table with Harpic

솔루션 4


innerFunc에서 화살표 함수를 사용합니다.화살표 함수는'this'에 특별한 의미를 가진다. 폐쇄된 범위에서'this'의 값을 가져오는 데 매우 유용하다.
const cleanTable = function(soap) {
  const innerFunc = (_soap) => {    
    console.log(`Cleaning ${this.table} with ${_soap}`)      
  }
  innerFunc(soap);
}

let nabsRoom = {
  table: "nabs table"
}

cleanTable.call(nabsRoom, "Harpic");
//Output - Cleaning nabs table with Harpic
문제 11 - 구조 함수나 ES6 클래스의 "this"키워드를 설명합니까?
답안 구조 함수와 ES6 클래스는 모두 같다.ES6류는 구조 함수에 불과한 합성당으로 내부에서 완전히 같다.
둘 중 "this"는 new 키워드를 사용하여 변수를 만드는 실례입니다.
아래의 예시를 고려하다.여기의'this'는 cleanTable () 내의nabsRoom이나shikhaRoom입니다. 구체적으로는 호출된 위치에 달려 있습니다.
"this"는 구조 함수에서
구조 함수를 가진 ES6 클래스로 같은 코드를 작성할 수 있지만, 완전히 같고,'this'도 같다.
"this"는 ES6 클래스에서
이것은 JavaScript 기본 면접 문제의 두 번째 부분입니다.

좋은 웹페이지 즐겨찾기