JavaScript는 정말 잘 알고 있지만 폭탄 코딩 인터뷰는 [폐쇄]

그래서 저는 현재 프론트 엔드 개발자로서 새로운 직책을 찾고 있습니다. 저는 JavaScript를 매우 잘 알고 있으며 폐쇄, 커리, 프로토 타입 상속, 디자인 패턴, 앱 성능 및 전체 프론트 엔드 아키텍처에 대해 시적으로 왁싱 할 수 있습니다. 그러나 나는 여전히 폭행 작업 인터뷰를 끝냅니다. (내가 인터뷰하는 대부분의 작업은 일종의 MVC 프레임 워크를 사용하여 SPA를 구축하는 것입니다)

일반적으로 코딩 테스트는 전문적으로 접할 수없는 작은 코드 스 니펫입니다. 일종의 수학 문제를 해결하는 함수를 작성하는 것과 같습니다. 한 손으로 전화를 들고 낯선 사람이 화면을보고 입력하는 모든 문자를 보도록하는 동안 코드를 작성하는 것은 어색함을 제외하고는 실제로 이런 종류의 물건을 실제 세계에서는 볼 수 없습니다.

이것은 내가 부족하거나 면접관이 내게 관련없는 질문을하는 심각한 기술이다. 나는 함수형 프로그래밍과 알고리즘을 다루어야한다고 생각하지만 웹 (또는 인쇄본)에서 많은 제안을 찾지 못했습니다.

— 마이크 피셔
소스

일부 샘플은 Project Euler 를 사용해보십시오 .

— Peter K.

휴대 전화 용 핸즈프리 키트를 받으시겠습니까?

— AakashM

왜 휴대 전화에서 코딩 테스트를하고 있습니까? 직장을 구할 때 그런 식으로 일해야합니까?

— Burhan Ali

@BurhanAli, 전화는 통화 용이며, 이는 인터뷰의 1 단계 표준입니다.

— greenoldman

예, 요즘에는 일부 sceen 테스트가 완전한 헛소리라고 생각합니다. 특히 "테이크 홈 (take-home)"테스트를 멸시합니다. 여기서 한 시간 안에 무언가를 할 수 있다고 말하지만 실제로는 올바르게 처리하는 데 반나절 이상이 걸릴 것입니다. 나는 그 일을 완전히 거부합니다. 당신은 실제로 면접관의 변덕에 있습니다. 그들 중 일부는 실제 기술을 평가하는 좋은 시험을 생각합니다. 다른 면접관들은 그들이 무엇을하고 있는지 알지 못하고 자신의 개인적인 의제와 불안감을 가지고 있습니다.

— 링고

코드 작성은 인터뷰 과정의 일부일뿐입니다.

실제로 논리적 문제를 해결하는 것은 코드 작성 작업의 일부일뿐입니다.

면접관은 다음을 확인하려고합니다.

코드를 작성할 수 있습니다. 10 년 동안 언어에 대한 전문적인 경험이있는 많은 지원자는 전혀 코드를 작성할 수 없으며이 테스트는 해당 지원자를 거부하기위한 것입니다.
코드를 작성하기 전에 문제에 대해 생각합니다. 많은 사람들이 키보드로 뛰어 들어 수십 줄의 코드를 작성한 다음, 원래의 문제를 오해 한 것으로 생각합니다. 시간이 걸리지 않기 때문입니다.
코드를 작성할 때 스스로 적응할 수 있습니다. 해결책을 찾았지만 구현을 시작했을 때 첫 번째 아이디어가 최고의 아이디어가 아닌 것으로 나타났습니다. 더 나은 코드로 빠르게 전환하여 결국 작성한 코드를 리팩토링 할 수 있습니까?

이는 또한 그러한 인터뷰가보다 대화식 이어야한다는 것을 의미합니다 . 한 손으로 입력하는 대신 핸즈프리 키트를 구입하거나 Skype를 통해 전화를 걸어 헤드셋을 사용하십시오. 직장에서 타이핑 할 때 입력하는 내용을 설명하고 설명하면서 입력하십시오. 갑자기 어색해집니다.

페어 프로그래밍을 했습니까? 그렇다면 면접 상황이 매우 비슷합니다. 면접관이 자신의 의견을 제시하지 않을 수 있으며, 끝났을 때 키보드를 전환하도록 요청하지 않습니다.

다음은 순전히 수학 문제 의 몇 가지 예 와 개발자의 비 수학적 기술을 보여주는 방법입니다.

예제 1 : 간단한 코딩 연습

JavaScript로 피보나치 수 계산기를 구현해야합니다. 색인을 변경할 수 있어야합니다. 피보나치 수열은 다음 규칙을 따릅니다.

시퀀스의 처음 두 숫자는 0과 1입니다.

이후의 각 숫자는 이전 두 숫자의 합계입니다.

예 : F ₀ = 0, F ₁ = 1, F ₂ = 1, F ₃ = 2, F ₁₀ = 55

3 분 남았습니다.

여기서 면접관은 가능한 빨리 생각하고 솔루션을 찾고 신속하게 구현하기를 원합니다. 이러한 연습은 실제 개발자의 업무와 관련이 없으며 CS 학위를 수행 할 때 찾을 수있는 것에 훨씬 더 가깝지만 인터뷰 담당자는 이런 종류의 일을 좋아합니다. 또한 시간 제약으로 인해 자동 테스트를 수행 할 수 없으므로 면접관이이를 예상하지 못할 수도 있습니다.

“알고리즘에 대한 설명은 재귀에 대해 생각하게합니다. 두 번째 규칙은 다음과 같은 재귀 함수로 이어집니다.”

var fibonacci = function (n) {
    return fibonacci(n - 2) + fibonacci(n - 1);
};

console.log(fibonacci(10));

"재귀를 끝내기 위해 fibonacci기능 본문을 교체하여 특별한 경우를 추가 할 것 입니다."

switch (n) {
    case 0: return 0;
    case 1: return 1;
    default: return fibonacci(n - 2) + fibonacci(n - 1);
}

"끝난."

결론

내가 말했듯이, 그러한 연습은 개발자의 실제 직업과는 전혀 관련이 없습니다. 무의미합니까? 적어도, 그 사람이 다음을 보여주기 때문에 실제로는 아닙니다.

문제에 대해 생각할 수 있습니다. 일부 후보자들은 완전히 잃어 버리고 스트레스를 받으면 문제에 접근 할 수있는 가능한 방법에 대해 생각하기 위해 할당 된 시간보다 더 많은 시간이 걸립니다.
재귀를 알고 있거나 일반 루프를 통해 재귀를 피할 수 있습니다. 나중에 면접관은 재귀를 사용하거나 사용하지 않는 방법이 있는지, 그리고 재귀의 이점 / 약점이 무엇인지 물어볼 수 있습니다.
프로그래밍 언어의 기본 사항을 알고 있습니다. 사람 switch이 가드 조항, 조건부 또는 사전을 사용했는지 여부는 중요하지 않습니다 . 배경에 따라 다른 후보자는 동일한 것을 달성하기 위해 다른 도구를 선택합니다.
단위 테스트, 확장 성 또는 성능과 같은 것을 가져 오지 않고 문제에 계속 집중합니다. 그런 다음 면접관은 왜 성과면에서 위의 기능이 끔찍한 지 물을 수 있으며, 후보가 성과를 합리적인 수준으로 끌어 올리기 위해 수행해야 할 작업을 설명 할 것을 기대할 수 있습니다.

예 2 : 까다로운 질문

JavaScript로 피보나치 수 계산기를 구현해야합니다. 가능한 빨리해야합니다. 인덱스 범위는 0에서 100까지 변경할 수 있어야합니다. 피보나치 수열은 다음 규칙을 따릅니다.

시퀀스의 처음 두 숫자는 0과 1입니다.

이후의 각 숫자는 이전 두 숫자의 합계입니다.

예 : F ₀ = 0, F ₁ = 1, F ₂ = 1, F ₃ = 2, F ₁₀ = 55

3 분 남았습니다.

이제 우리는 면접관이 후보자가 문제를 해결하는 능력에 관심을 두지 않고 다른 방법보다 어떤 방법이 더 빠른지를 추측 할 수있는 능력에 관심이 있다는 것을 보여주는 흥미로운 제약이 있습니다.

이러한 까다로운 질문은 일반적으로 까다로운 답변을 초대합니다. 여기에는 시간 제약이 주어지면 여러 구현을 수행하고 벤치마킹하며 가장 빠른 프로필을 작성하고 최적의 솔루션을 제공 할 수있는 방법이 없습니다.

대신 다음은 어떻습니까?

"Google"First Fibonacci numbers "를 알려 드리겠습니다. 이것은 유망한 것 같습니다. A의 ~~간단한~~ 정규 표현식 (즉 모순이 될 것이다), 우리는 값의 쉼표로 구분 된 목록을 구축 할 수 있습니다. "

sed -e "s;\([0-9]*\) \([0-9]*\);'\2',;g" fbncc10.txt | tr '\n' ' '

"마침내 프로그램 자체."

var map = ['0', '1', '1', '2', '3', '5', '8', '13', '21', '34', '55', '89', '144', '233', '377', '610', '987', '1597', '2584', '4181', '6765', '10946', '17711', '28657', '46368', '75025', '121393', '196418', '317811', '514229', '832040', '1346269', '2178309', '3524578', '5702887', '9227465', '14930352', '24157817', '39088169', '63245986', '102334155', '165580141', '267914296', '433494437', '701408733', '1134903170', '1836311903', '2971215073', '4807526976', '7778742049', '12586269025', '20365011074', '32951280099', '53316291173', '86267571272', '139583862445', '225851433717', '365435296162', '591286729879', '956722026041', '1548008755920', '2504730781961', '4052739537881', '6557470319842', '10610209857723', '17167680177565', '27777890035288', '44945570212853', '72723460248141', '117669030460994', '190392490709135', '308061521170129', '498454011879264', '806515533049393', '1304969544928657', '2111485077978050', '3416454622906707', '5527939700884757', '8944394323791464', '14472334024676221', '23416728348467685', '37889062373143906', '61305790721611591', '99194853094755497', '160500643816367088', '259695496911122585', '420196140727489673', '679891637638612258', '1100087778366101931', '1779979416004714189', '2880067194370816120', '4660046610375530309', '7540113804746346429', '12200160415121876738', '19740274219868223167', '31940434634990099905', '51680708854858323072', '83621143489848422977', '135301852344706746049', '218922995834555169026', '354224848179261915075'];

var fibonacci = function (n) {
    return map[n];
};

console.log(fibonacci(10));

결론

까다로운 질문은 까다로운 답변을 초대합니다. 영웅적이지 말고 3 분만 있으면 벤치마킹 및 프로파일 링을 시작하지 마십시오. 경험을 사용하면서 문제를 해결하는 영리한 방법을 생각하십시오. 내 경험에 따르면 맵을 사용하는 것이 숫자를 계산하는 것보다 빠를 수 있습니다. 잘못되었을 수 있지만 시간 제한이 주어지면이 시도가 예상됩니다.

도구를 아는 것도 도움이되고 개발자 기술의 필수 부분입니다. 정규 표현식을 모르면 쉼표로 구분 된 목록에 대해 3 분의 인터넷 검색을 사용하거나 필요한 배열을 구축 할 파서를 작성하기 시작합니다.

훌륭한 개발자는 바로 코딩을 시작하는 사람이 아니라 더 나은 기회가있을 때 코딩을 피하는 방법을 알고있는 사람입니다. 일부 면접관은 주저하지 않고 코딩과 비슷하지만 거의 코드가 필요없는 과제를 제공합니다.

예 3 : 완전한 응용 프로그램 개발

JavaScript에서 피보나치 시퀀스를 구현해야합니다. 시퀀스의 길이는 프로그램 실행 중에 결정됩니다. 순서는 다음 규칙을 따릅니다.

시퀀스의 처음 두 숫자는 0과 1입니다.

이후의 각 숫자는 이전 두 숫자의 합계입니다.

예 : 0, 1, 1, 2, 3, 5, 8, 13, 21, 34, 55, 89

응용 프로그램은 웹 페이지로 표시되어야하며 사용자가 입력 필드를 통해 시퀀스 길이를 지정할 수 있습니다.

당신은 한 시간이 있습니다.

시작하자.

“예제 시퀀스는 구현이 완전히 잘못 보이지 않도록 많은 단위 테스트를 수행 할 수 있기 때문에 매우 유용합니다. 일반적으로 node.js에 Mocha를 사용하거나 클라이언트 측 JavaScript에 QUnit을 사용하지만 여기서는 단순성을 위해 많은 테스트 함수를 던질 것입니다.”

“ 파일 index.htm과 fib.js파일 을 만드는 것으로 시작 합니다. 그런 다음 index.htmW3C 호환 코드가 아닌 매우 최소한의 코드로 채 웁니다 (HTML 기술에 관심이있는 경우 나중에 다시 확인할 수 있습니다).”

<label>Length</label> <input id="length" value="15" />
<input id="compute" type="button" value="Compute" />
<div id="result" style="font-weight:bold;"></div>
<div id="tests"></div>
<script src="fib.js"></script>

"이제 피보나치 생성기 함수를 호출하고 결과를 보여주는 코드를 작성해 보겠습니다."

fibonacci = (function () {
    var compute,
        init;

    compute = function (length) {
        // TODO: Implement Fibonacci sequence.
        return [1, 2, 3];
    };

    init = function () {
        var button = document.getElementById('compute');
        button.addEventListener('onclick', function () {
            var length = parseInt(document.getElementById('length').value, 10),
                result;

            console.log(
                'Computing Fibonacci sequence of length ' + length + '.'
            );

            result = compute(length);
            document.getElementById('result').innerText = result.join(', ');
        });
    };

    return {
        compute: compute,
        init: init
    };
}());

“코드를 처음 실행할 때가되었지만 작동하지 않습니다. 아무 반응이 없습니다. 왜?"

“좋아요, 나는 fibonacci.init();끝을 잊어 버렸습니다 . 나는 그것을 추가했지만 아무 일도 일어나지 않지만 콘솔에 메시지를 표시해야합니다. 잠깐만, 그렇지 onclick는 않지만 click; JQuery를 너무 자주 사용하여 일반 JavaScript에서 이벤트 이름을 잊어 버리기 시작합니다.”

"테스트를 추가하겠습니다."

ensureAreEqual = function (expected, actual) {
    var testResultsContainer = document.getElementById('tests');
    testResultsContainer.innerText += (expected.equals(actual) ?
            '.' :
            ('Actual [' + actual.join(', ') + '] is different from ' +
             'expected [' + expected.join(', ') + '].'));
};

test = function () {
    ensureAreEqual([0], compute(1));
};

"배열을 비교하는 것은 까다로울 수 있으므로이 답변Array.prototype.equals 에서 코드를 복사하여 붙여 넣기 만하면 됩니다."

"이제 응용 프로그램을 실행하면 다음과 같이 표시됩니다."

실제 [1, 2, 3]은 예상 [0]과 다릅니다.

“ return [1, 2, 3];피보나치 시퀀스 의 실제 구현 ( )을 감안할 때 테스트가 실패했습니다 . 이제 바꿔야 할 때입니다.”

"원래 진술에서 피보나치 수열은로 시작 [0, 1]하므로 compute다음 과 같이 됩니다."

compute = function (length) {
    var fib = [0];
    return fib;
};

"이로 인해 첫 번째 시험에 합격 할 수있게되었으며 이제 두 번째 시험을 작성할 수 있습니다."

ensureAreEqual([0, 1], compute(2));

"실패하므로 다시 돌아가서 compute수정합니다."

compute = function (length) {
    var fib = [0, 1];
    return length === 1 ? [0] : fib;
};

"이제 두 가지 테스트를 모두 통과했으며 이제 비 에지 사례로 전환해야합니다."

compute = function (length) {
    var fib = [0, 1],
        i,
        next,
        current = 1,
        previous = 0;

    for (i = 2; i < length; i += 1) {
        next = current + previous;
        previous = current;
        current = next;
        fib.push(next);
    }

    return length === 1 ? [0] : fib;
};

“결과가 100과 같이 더 큰 길이에 맞지 않다는 것을 제외하고는 세 가지 테스트가 모두 통과되었습니다. 이러한 결과를 올바르게 얻으려면 임의 정밀도 라이브러리를 사용해야합니다 . 개선해야 할 사항도 있습니다. 예를 들어, 명명 규칙은 때때로 너무 나쁩니다 (무엇 fib입니까?). HTML 관련 JavaScript 코드는 테스트 코드뿐만 아니라 다른 객체로 이동해야합니다. 또한 테스트 compute(0)를하지 않았으며 입력을 확인하지 않았습니다.”

결론

예제를 살펴보면 인터뷰 중에 예상되는 상호 작용을 볼 수 있습니다. 모든 것이 매끄럽지는 않았습니다 (처음에는 응용 프로그램을 실행할 때 아무 일도 일어나지 않는 당혹스러운 상황으로 이어질 몇 가지 실수가 있었으며), 큰 시퀀스 길이를 지원 해야하는 경우 원래의 접근 방식은 절망적이지만 달성했습니다. 그것을 보여주기 위해 :

다른 문제를 처리 할 수 있습니다.
저는 테스트 중심 개발을 사용합니다. 피보나치 시퀀스는 이에 대한 훌륭한 기회이며
소스를 신뢰할 수있을 때 코드를 복사하여 붙여 넣기하고 처음부터 작성하는 것은 압도적으로 복잡하고 오류가 발생하기 쉬운 것 같습니다.
JQuery와 같은 라이브러리에 지나치게 의존하지 않습니다.
면접관이 JavaScript 기술을 확인하고 싶기 때문에 완벽하고 깨끗한 HTML을 작성하는 데 시간을 낭비하지 않을 것입니다. 여기에서 시간을 보내지 않으면 단위 테스트를 작성하는 데 더 많은 시간을 할애 할 수 있습니다.
나는 완료하고 내가 끝났다는 것을 알고 있지만, 많은 것들이 완벽하지는 않다는 것을 명심하면서 ( compute(0)실패 할 수는 있지만 데모에는 중요하지 않음).

면접관이 당신에게 기대하는 것입니다.

— 아르 세니 무르 첸코
소스