Day 5

너무나도 어려운 알고리즘 😭

공부하자

점수에 맞는 등급 계산하기
입력되는 score에 따라 알맞은 등급을 적어야 합니다.
100~90 → "A"
89~80 → "B"
79~70 → "C"
69~60 → "D"
59점 이하는 "F"
100점 초과나 0점 미만은 "잘못된 점수입니다"라는 문구를 띄워주세요.

내가한거 왜 작동은 안함??
-> score 함수의 이름, num 함수의 인자값임.
근데 아래 함수에 인자값을 안넣고 함수의 이름을 넣었으니 작동을 안함

function score(num){
    if(score > 100 || score < 0){
        console.log("잘못된 점수입니다")
    } else if(score >= 90){
        console.log("A")
    } else if(score >= 80){
        console.log("B")
    } else if(score >= 70){
        console.log("C")
    } else if(score >= 60){
        console.log("D")
    } else if(score >= 0){
        console.log("F")
    }
    console.log(score)
}
// 고치면 이렇게됨... score(num)으로 해놓고 num가 없었네
function grade(score){
    if(score > 100 || score < 0){
        console.log("잘못된 점수입니다")
    } else if(score >= 90){
        console.log("A")
    } else if(score >= 80){
        console.log("B")
    } else if(score >= 70){
        console.log("C")
    } else if(score >= 60){
        console.log("D")
    } else if(score >= 0){
        console.log("F")
    }
    console.log(score)
}

// 테스트
function test(num){
    let result;
    if(test > 100 || test < 0){
        result = "positive"
    }
    else {
        result = "not positive"
    }
    return result;
}

먼저 하나씩 등록이 되는지 확인, 예외처리는 위에 하는것이 좋다

마이 페이지 문제
오른쪽 myShooping은 내가 구매한 목록을 보여주고 있습니다.
해당 목록에서 "의류"를 구매한 횟수와 총 금액을 나타내고,
"의류"를 구매한 횟수에 따라 등급을 나타내세요.

등급표
"0~2" ⇒ Bronze
"3~4" ⇒ Silver
5이상 ⇒ Gold

반복문을 통해 문제를 풀어야 합니다.
myShopping 내용을 직접 수정하면 안 됩니다.
예상 결과에 나온 문구와 형식이 같아야 합니다.
의류를 구매한 횟수는 총 5회 금액은 57000원이며 등급은 Gold입니다.

ios에서 백틱이 입력되지 않을 때 : 한글로는 ₩가되는데 설정이 필요하고 그냥 영어로 바꾸면 입력 할 수 있다.
해결방법은
1. ~/Library 폴더로 이동해서 KeyBindings 폴더를 추가한다.
2. ~/Library/KeyBindings 폴더에 DefaultkeyBinding.dict 파일을 만든다.
3. DefaultkeyBinding.dict 파일에 아래의 코드를 추가한다.

{
    "₩" = ("insertText:", "`");
}

마이페이지 코드

// 의류를 구하는 갯수를 세려면 category를 세고, 가격을 더하고 횟수 카운트
//인덱스 번호에 맞는 값을 가져옴
for(let i = 0; i< myShopping.length; i= i+1){
    console.log(i, myShopping)
}
//category에서 값을 가져오는 것은? myShopping[i].category
for(let i = 0; i< myShopping.length; i= i+1){
    console.log(i, myShopping[i].category)
}
// 의류만가져오려면??
for(let i = 0; i< myShopping.length; i= i+1){
    if(myShopping[i].category === "의류"){
        console.log(myShopping[i])
    }
}
// 갯수와 가격을 더해주는 기능 더하기
for(let i = 0; i< myShopping.length; i= i+1){
    if(myShopping[i].category === "의류"){
        count += 1
        amount += myShopping[i].price
    }
}
// 등급 계산하는 기능
if(count >= 0 && count <= 2){
    grade = "Bronze"
} else if(count >= 3 && count <= 4){
    grade = "Silver"
} else if(count >= 5){
    grade = "Gold"
}
// 출력부분 만들기, 문자열로 안넣게 조심, ""에서 빼거나 백틱`+ ${}표시
// console.log(`의류를 구매한 횟수는 총  ${count}회 금액은 ${amount} 원이며 등급은 ${grade}입니다`)

const myShopping = [
    { category: "과일", price: 12000　},
    { category: "의류", price:10000　 },
    { category: "의류", price: 20000　},
    { category: "장난감", price: 9000 },
    { category: "과일", price: 5000　 },
    { category: "의류", price: 10000  },
    { category: "과일", price: 8000　　},
    { category: "의류", price: 7000　　},
    { category: "장난감", price: 5000  },
    { category: "의류", price: 10000　 },
]

let count = 0; // 구매한 총 갯수
let amount = 0; // 구매한 총 가격
let grade = ""; // 등급

for(let i = 0; i< myShopping.length; i= i+1){
    if(myShopping[i].category === "의류"){
        count += 1
        amount += myShopping[i].price;

        if(count >= 0 && count <= 2){
            grade = "Bronze"
        } else if(count >= 3 && count <= 4){
            grade = "Silver"
        } else if(count >= 5){
            grade = "Gold"
        }
    }
}

console.log(`의류를 구매한 횟수는 총  ${count}회 금액은 ${amount} 원이며 등급은 ${grade}입니다`)

배열 안에 객체 데이터를 어떻게 다루는지.
하나씩 넣어보면서 작동방식을(로직을)이해해보는 것도 좋다
앞으로 사용할 때가 많을 것.
공부좀 하죠.. ㅠㅠ

React 5강

라우팅, 정적/동적 라우팅, 예외처리, 데이터 조회

!페이지 꾸미기 고민해보기
예시는 오늘의 집,-> 클론 코딩으로 해보기
안에 있는것도 게시판과 상품일 필요가 없음.
첫 시작 페이지, 랜딩페이지도 가능

페이지 여는 과정
게시물 등록 -> 등록한 글의 아이디/넘버를 받아옴 -> 그 페이지로 이동 -> 해당하는 게시물 받아온다. 즉 등록한 글의 아이디를 받아오는 과정이 필요함

이런 아이디가 필요하다.

gql 부분에서 원하는 부분을 선택할 수 있는 것이 장점, 대신 값 부분은 똑같이 쓰도록 하기
async/ await 까먹지말기

console.log(result.data.createBoard._id)
주소를 지정해줘서 내 아이디에 해당하는 부분 소환
근데 이 아이디 안다고 다 되는것이 아니다
개념도 알고 필요한 것도 있음.

라우팅

라우팅? 페이지를 이동한다 , 라우팅이라고한다
사용하는 도구는 이미 제공되어있음 useRouter()
router.push("이동할 페이지")

라우팅 실습

import useRouter 를 next/router에서 받아와야함
그리고 함수이름.push(상세주소) 를 넣어야함

근데 페이지가 세개면 이렇게 연결, 만약 만개면.. 만개의 인덱스 페이지를 만들어야하나??

새로운 라우팅의 등장 , 동적 라우팅

동적 라우팅
여러개의 페이지를 [변수로 받겠다]

페이지 이동방식은 똑같으나 변수 안의 폴더에는 index.js 파일 하나가 있고 그냥 열림
하지만 13번이든 1번페이지든 변수 안의 폴더 안에 담기고 열리는 방식
-> 여러개의 폴더를 만들지 않고 만들 수 있게됨

http:://localhose:3000/boards/1 이렇게 넣으면
http:://localhose:3000/boards/[aaa] 에 남기는 형식

const router = use Router()
router.query ={aaa: 1}

useQuery 는 비동기적 방식

{data && data.fetchProduct.seller}
데이터 있음 보여주고 없으면 보여주지마
3항연산자
{data ? data.fetchProduct.seller: "qqq"}
데이터 있으면 보여주고 없으면 "qqq"를 보여줘 -> 받아오는동안 qqq보여주기
옵셔널 체이닝은
{data?.ata.fetchProduct.detail}

try{} catch(error){}
키, 밸류가 같으면 : 뒤에 것들을 생략할 수 있음