5 개의 전형 적 인 전단 면접 문제, 괜 찮 겠 습 니까?

자 바스 크 립 트 개발 자 들 의 IT 계 수 요 량 은 줄곧 매우 크다.만약 당신 이 이 언어 에 매우 정통 하 다 면, 당신 은 직장 을 바 꾸 고 월급 을 올 릴 기회 가 많 을 것 입 니 다.하지만 한 회사 에서 당신 을 채용 하기 전에 면접 을 순조롭게 통과 하여 당신 의 기능 을 증명 해 야 합 니 다.본 논문 에서 저 는 후보자 의 자바 스 크 립 트 기능 과 그들 이 문 제 를 해결 하 는 능력 을 테스트 하기 위해 전단 과 관련 된 5 가지 문 제 를 보 여 드 리 겠 습 니 다.있 으 면 재 미 있 을 거 야!
문제 1: Scope 역할 범위
다음 코드 를 고려 하 십시오:

(function() {  
     var a = b = 5;
})();
console.log(b);

무엇이 콘 솔 에 인쇄 됩 니까?위의 코드 에 대답 하면 5 를 인쇄 합 니 다.이 문제 의 비결 은 여기에 두 개의 변수 성명 이 있 지만 a 는 키워드 var 로 성명 한 것 이다.함수 의 부분 변 수 를 대표 합 니 다.이와 반대로 b 는 전역 변수 가 되 었 다.이 문제 의 또 다른 비결 은 엄격 한 모드 ('use strict';) 를 사용 하지 않 았 다 는 것 이다.엄격 한 모드 를 사용 하면 코드 는 Reference Error 의 오 류 를 일 으 킬 수 있 습 니 다. B 는 정의 되 지 않 았 습 니 다 (b is not defined).엄격 한 모드 는 명확 하 게 지정 해 야 전역 변수 성명 을 실현 할 수 있다 는 것 을 기억 하 십시오.예 를 들 어, 당신 은 써 야 합 니 다.

(function() {  
     'use strict';  
     var a = window.b = 5;
})();
console.log(b);

질문 2: "네 이 티 브" (native) 만 드 는 방법
문자열 대상 에 repeatify 기능 을 정의 합 니 다.정수 n 이 들 어 오 면 n 차 문자열 을 반복 하 는 결 과 를 되 돌려 줍 니 다.예 를 들 면:

console.log('hello'.repeatify(3));

hellohellohello 를 인쇄 해 야 합 니 다.가능 한 실현 에 대해 다음 과 같이 대답 하 라.

String.prototype.repeatify = String.prototype.repeatify || function(times) {   
    var str = '';  
     for (var i = 0; i < times; i++) {      
        str += this;   
    }   
    return str;
};

현재 문제 테스트 개발 자 는 자 바스 크 립 트 계승 과 프로 토 타 입 에 대한 지식 을 가지 고 있 습 니 다.이것 또한 개발 자가 내 장 된 대상 을 확장 해 야 한 다 는 것 을 알 고 있 는 지 검증 했다.여기 서 또 다른 요점 은 정 의 된 기능 을 덮어 쓰 지 않 는 방법 을 알 아야 한 다 는 것 이다.이 기능 의 정 의 를 테스트 하기 전에는 존재 하지 않 습 니 다:

String.prototype.repeatify = String.prototype.repeatify || function(times) {/* code here */};

자 바스 크 립 트 함수 호환성 을 요 구 받 았 을 때 이 기술 은 특히 유용 하 다.
질문 3: 성명 향상 (Hoisting)
이 코드 를 실행 하면 어떤 결 과 를 출력 합 니까?

function test() {   
    console.log(a);   
    console.log(foo());  
     var a = 1;   
    function foo() {     
         return 2;   
    }
}
test();

이 코드 에 대답 한 결 과 는 undefined 와 2 입 니 다.변수 와 함수 의 성명 이 앞 당 겨 졌 기 때 문 입 니 다.따라서 변 수 를 인쇄 할 때 함수 에 존재 하지만 undefined 입 니 다.다시 말 하면 위의 코드 는 다음 과 같은 내용 을 나타 낸다.

function test() {  
     var a;  
     function foo() {     
         return 2;   
    }    
    console.log(a);   
    console.log(foo());      
     a = 1;
}
test();

질문 4: this 가 자 바스 크 립 트 에서 어떻게 일 하 는 지
다음 코드 는 어떤 결 과 를 출력 합 니까?답 을 줘.

var fullname = 'John Doe';
var obj = {  
    fullname: 'Colin Ihrig',   
    prop: {      
        fullname: 'Aurelio De Rosa',      
        getFullname: function() {         
            return this.fullname;      
        }   
    }
};
console.log(obj.prop.getFullname()); 
var test = obj.prop.getFullname; 
console.log(test());

정 답 은 Aurelio De Rosa 와 John Doe.이 유 는 한 함수 에서 this 의 행 위 는 자바 script 함수 의 호출 방식 과 정의 방식 에 달 려 있 기 때 문 입 니 다. 그것 이 어떻게 정의 되 는 지 만 보 는 것 이 아 닙 니 다.첫 번 째 console. log () 호출 에서 getFullname () 은 obj. prop 대상 의 함수 로 호출 되 었 습 니 다.따라서 상하 문 은 후자, 함수 가 이 대상 의 fullname 을 되 돌려 주 는 것 을 가리킨다.이와 반대로 getFullname () 이 test 변수 에 할당 되 었 을 때 상하 문 은 전역 대상 (window) 을 가리킨다.테스트 는 전역 대상 으로 암시 적 으로 설 정 된 속성 이기 때 문 입 니 다.이 때문에 이 함 수 는 window 의 fullname 을 되 돌려 줍 니 다. 즉, 첫 줄 에 있 는 값 을 정의 합 니 다.
질문 5: call () 과 apply ()
이제 이전 문 제 를 해결 하고 마지막 console. log () 를 Aurelio De Rosa 로 인쇄 합 니 다.이 질문 에 대답 하면 콜 () 이나 apply () 를 강제로 사용 하여 함수 컨 텍스트 를 바 꿀 수 있 습 니 다.아래 에서 나 는 콜 () 을 사용 할 것 이다. 그러나 이 경우 apply () 는 같은 결 과 를 출력 할 것 이다.

console.log(test.call(obj.prop));

결론.
이 글 에서 우 리 는 자바 스 크 립 트 개발 자 를 테스트 하 는 다섯 가지 전형 적 인 문 제 를 토론 했다.면접 의 개념 과 포 함 된 주 제 는 일반적으로 매우 비슷 하 다.만약 당신 이 모 르 는 몇 가지 문제 의 답 이 있다 면 걱정 하지 마 세 요. 공부 와 경험 은 천천히 쌓 일 수 있 습 니 다.다른 재 미 있 는 질문 이 있다 면 주저 하지 말고 우리 와 나 누 세 요.그것 은 많은 개발 자 들 을 도 울 것 이다.