ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • [알고리즘] JavaScript 문제 해결 접근법
    알고리즘/Javascript 용어 2025. 7. 24. 20:59

    코딩테스트를 볼 때 문제 해결법 5단계를 소개한다. 라이브 코딩테스트일 수도 있고, 면접에 참여한 상황에서 화이트 보드를 앞에 두고 많은 사람들이 지켜보는 가운데 새로운 과제를 해결해야 하는 상황일 수도 있다. 애플리케이션을 구축해야 한다든지, 검색 결과를 정렬해야 한다던지, 뭐가 됐건 5단계를 거치면 문제 없다.

     

    1단계: 문제의 이해

    Understand the Problem

    우선 문제를 확실히 이해하는 단계이다. 모든 설명과 앞으로 살펴볼 다양한 방법들은 면접에 초점을 두고 있다. 즉, 대체로 문제를 이해하는 쪽으로 맞춰져 있다. 면접관에게 질문을 던져서 문제를 명확히 함으로써 확실히 이해하기 위해서다. 또한 뭔가 작업을 수행하면서 어떤 해결책을 마련할지, 애플리케이션이 어떻게 구동되도록 할지, 각 상황에서 어떤 식으로 작동되도록 할지에 대해 확실히 이해하기 위해서도 마찬가지이다. 이는 구체적인 예시를 살펴보는 것과도 관련이 있다.

    문제: 입력 문자열을 받아 문자열에 사용된 각 문자의 개수를 리턴하시오.

     

    2단계: 구체적 예제들

    Explore Concrete Example

    1단계와 2단계는 문제를 이해하고, 입력값과 출력값을 이해하고 경계 조건을 이해하는 것에 관한 것이다. 에러를 어떻게 처리할지, 그리고 사용자가 잘못된 값을 입력하면 어떻게 되는지와 같은 질문들은 처음부터 모든 것이 어떻게 작동해야 하는지를 이해하는 것과 관련이 있다.

    charCount("aaaa"); // {a:4}
    charCount("aaaa"); // {a:4, b:0, c:0 ...}, 적합한 출력값의 형태는?
    charCount("hello"); // {h:1, e:1, l:2, o:1}
    
    // Q1: 숫자도 세는가?
    str1 = "my phone number is 182839" // 영숫자 이외 문자들의 처리는?
    str2 = "Hello hi" // 대문자 무시? 또는 대문자와 소문자를 따로 세는가?

     

    3단계: 세분화

    Break It Down

    세분화 단계는 완벽한 의사코드를 한 줄씩 작성하는 것도 좋지만 구현해야 할 코드에 대한 계획의 틀을 잡기 위한 단계를 몇 가지로 세분화하는 것도 좋다. 이 단계는 특히 면접에서 큰 도움이 된다. 시간이 제한된 상황에서 시간이 부족하리라는 것을 알고 있다면 계획을 작성하여 본인이 이런 방향을 갖고 있지만 40% 밖에 구현하지 못했다고 면접관에게 제시할 수 있다면 좋다.

    코드를 작성하기 전에 방향을 확실히 정해야 한다. 무작정 코드를 작성하는 건 좋지 않다. 도중에 가로막힐 수도 있고, 혼란에 빠질 수도 있다. 많은 인터뷰 지원자들이 겪는 일이다. 시작만 하면 어디서부터 시작해야 할지 알 것 같고 나머지는 진행하면서 알게 될 것이라고 생각할 수도 있다. 한 가지 접근법에 치우치다가 제대로 풀리지 않으면 당황하게 된다. 그러다 다시 물러서서 작성한 내용을 모두 지우고 다시 시작해서 계획을 세우게 된다.

    function charCount(str) {
        // make object to return at end
        // loop over string, for each character...
        	// if the char is a number/letter AND is a key in object, add one to count
            // if the char is a number/letter AND not in object, add it to object and set value to 1
            // if charater is something else (space, period, etc.) don't do anything
        // return object at end
    }

     

    4단계: 해결 또는 단순화

    Solve/Simplify

    문제를 당장 해결할 수 없다면 해결할 수 있는 문제부터 처리하길 바란다. 단순한 문제 같더라도 더 단순화하면 핵심적인 어려운 부분이 사라진다. 해결할 수 있는 부분을 먼저 처리하면 어려운 부분을 다시 통합할 수 있을 것이다. 예를들어 영숫자인지 검사하는 방법을 확실히 모른다면 해당 부분을 무시하고 해결책을 작성하길 바란다. 영숫자 부분을 일단 무시하고 나중에 연결하면 된다.

    function charCount(str) {
        const obj = {};
        for (let i=0; i<str.length; i++) {
            const char = str[i].toLowerCase();
            if (/[a-z0-9]/.test(char)) {
                if (obj[char] > 0) {
                    obj[char]++;
                } else {
                    obj[char] = 1;
                }
            }
        }
        return obj;
    }

     

    5단계: 되돌아 보기와 리팩터

    Look Back and Refactor

    마지막으로 개발자로서 배우거나 향상하는 데 있어서 중요한 것은 코드를 되돌아보고 리팩터링하고, 때로는 되돌아보고 분석하면서 자신을 격려하는 것이다. 대부분의 경우 리팩터링이 필요할 것이다. 완전히 숙련된개발자라 하더라도 다른 사람의 해결책이나 스스로의 해결책을 면밀히 살펴보고 무엇을 더 향상시킬 수 있을지를 파악하는 것이 큰 도움이 될 것이다.

    // refactor
    function charCount(str) {
        const obj = {};
        for (const char of str) {
            char = char.toLowerCase();
            if (isAlphaNumeric(char)) {
                char = char.toLowerCase();
                obj[char] = ++obj[char] || 1;
            }
        }
        return obj;
    }
    
    // 정규 표현식보다 빠른 처리 속도를 갖는 함수
    function isAlphaNumeric(char) {
        var code = char.charCodeAt(0);
        if (!(code > 47 && code < 58) && // numeric (0-9)
            !(code > 64 && code < 91) && // upper alph (A-Z)
            !(code > 96 && code < 123)) { // lower alpha (a-z)
            return false;
        }
        return true;
    }

     

    마무리

    어려운 문제를 맞닥트린 적이 있다면, 특히 면접에서는 반드시 문제를 이해하는 것부터 시작해서 한 두 가지 예시를 살펴보기를 강력히 추천한다. 면접관이 당신의 말을 듣고 풀이 과정에 들어올 수 있도록 크게 이야기하자. 수행 작업 정의, 문제 세분화, 해결 단계를 작성하는 것을 면접관에게 확실히 인지시킨 후 문제를 해결하고, 가능하면 코드를 되돌아 보고 리팩터링하길 바란다.

    솔직히 이 모든 과정은 면접 상황뿐만 아니라 현실에서도 똑같이 중요하다. 이는 일종의 접근 방법으로써 당신이 스스로를 정신적으로 대비하는데 취할 수 있는 단계이다.

     

     

    출처: [유데미] JavaScript 알고리즘 & 자료구조 마스터클래스

     

Designed by Tistory.