[CNU SW Academy] 23일차(23.01.02)

프로그래머스 - 프론트엔드 미니 데브코스

Fetch API

백엔드에서 REST API의 형태로 주면, 클라이언트에서 해당 API를 쓸 때

화면에 대응되도록 가공하여 써야하는 경우가 존재

=> JSON 데이터를 내 마음대로 다룰 수 있는 역량이 필요하다.

 

Promise.all() => 동시에 실행

브라우저마다 동시에 요청할 수 있는 네트워크의 개수가 제한되어 있음

너무 많은 요청을 한꺼번에 해야 하는 경우

=> 백엔드에 다 불러올 수 있는 API를 요청

 

Promise.all을 두번 돌려서 다음 promise chain에서

productoptions, productoptions의 stock 데이터를 모두 불러올 수 있게 된다.

 

reduce() : 파라미터 2개(함수, 초기값)를 받아온다.

basePrice + option.optionPrice의 누산값을 계속 0의 위치에 저장한다.

closest() : 현재 이벤터가 발생한 대상을 기준으로 상위로 가장 인접한 것을 찾음

이벤트가 발생한 대상(버튼)을 중심으로 가장 가까운 li

 

방어코드를 작성하는 습관을 항상 들이자.

 

splice

특정 배열에서 item을 삭제해버리는 방법

 

History API

History API를 이용한 Single page application을 구성하는 방법

- 브라우저에서 페이지 로딩을 하면, 세션 히스토리를 갖는다.

- 세션 히스토리는 페이지를 이동할 때마다 쌓인다.

- pushState, replaceState 두 개의 함수로 화면 이동 없이 현재 url을 업데이트 할 수 있다.

 

pushState(state, title, url) : 세션 히스토리에 새 url 상태를 쌓는다.

- state: 세션 히스토리에 쌓음, history.state에서 꺼내 쓸 수 있는 값

- title: 빈 string을 넣으면 됨

- url: 세션 히스토리에 새로 넣을 url, a태그 클릭이나 location.href와 다르게 화면이 리로드되지는 않음

 

replaceState(state, title, url) : 뒤로가기를 제한해야 할 때, 현재 url을 대체한다.

- state: 현재 history를 대체, history.state에서 꺼내 쓸 수 있는 값

- title: 빈 string을 넣으면 됨

- url: 세션 히스토리에서 현재 url과 대체할 url, 화면이 리로드되지는 않음

 

이전 예제에서 hashbang으로 했던 url을 바꿔줄 수 있다.

=> 좀 더 자연스러운 방법

 

일반 url 형식을 따르기 때문에 querystring도 자유롭게 붙일 수 있다.

 

---

코딩테스트 - 외동 노드 찾기

n = int(input())
result = []
for i in range(n):
    parent, left, right = input().rstrip(" ").split(" ")
    if i == 0:
        continue
    if left == '.':
        if right != '.':
            result.append(int(right))
    else:
        if right == '.':
            result.append(int(left))

result.sort()
for r in result:
    print(r, end=' ')

부분합

n = int(input())
m = list(map(int, input().split(" ")))
result = [0] * (n+1)

result[0] = 0
for i in range(1, n+1):
    result[i] = result[i-1] + m[i-1]

q = int(input())
for i in range(q):
    a, b = map(int, input().split(" "))
    print(result[b] - result[a-1])

Tashu1

t = int(input())    #테스트케이스
for i in range(t):
    n = int(input())    #대여소 개수
    a = list(map(int, input().split(" ")))  #i번째 대여소의 자전거 개수
    m = int(input())
    
    for j in range(m):
        u, v = map(int, input().split(" "))
        a[u-1] -= 1
        a[v-1] += 1
        
    for j in a:
        print(j, end=' ')
    print()