181224 TIL AMAZON 1 step1 && array parser

Dec 24, 2018 » 1막, TIL (Today I Learned)

Amazon 1 stpe 1 HTML 구조화 설계

드디어 처음으로 아마존 HTML 구조를 짜는 것을 시도해보고 있다. 네이버 사이트의 구조를 참고하여 분석중…

array parser

오늘 강의에서 array parser 다시 짜는 것이 과제였는데, 단번에 짜지 못해 당황했다.

크롱이 위 그림처럼 stack 구조 힌트를 주었고, 아래처럼 짤 수 있었다.

const arr = [{
    "type": "arrayOpen",
    "value": "[",
    "child": []
}, {
    "type": "arrayOpen",
    "value": "[",
    "child": []
}, {
    "type": "number",
    "value": "1",
    "child": []
}, {
    "type": "arrayOpen",
    "value": "[",
    "child": []
}, {
    "type": "string",
    "value": "'2'",
    "child": []
}, {
    "type": "arrayClose",
    "value": "]",
    "child": []
}, {
    "type": "arrayClose",
    "value": "]",
    "child": []
}, {
    "type": "arrayClose",
    "value": "]",
    "child": []
}]

function parse(str) {
    let stack = [];
    for (let i = 0; i < str.length; i++) {
        if (i === str.length - 1)
            return stack;
        if (str[i].type === 'arrayOpen') {
            stack.push(str[i]);
        } else if (str[i].type === 'arrayClose') {
            let child = stack.pop();
            stack[stack.length - 1].child.push(child);
        } else if (str[i].type === 'string' || str[i].type === 'number') {
            stack[stack.length - 1].child.push(str[i]);
        }
    }
}

console.log(parse(arr))

앞으로 이 구조를 잘 기억해뒀다가 활용해야지!