내배캠 4기 React - WIL

221113 2주 차 - WIL

찌우닝 2022. 11. 13. 23:16

내배캠 시작한 지 벌써 2주가 흘렀다.

첫 주는 바로 프로젝트하느라 솔직히 공부를 많이 못했는데 이번 주는 그래도 좀 열심히 한 거 같다.

알고리즘 강의가 떠서 그걸 보고 진짜 멘붕이 너무 와서 이걸 어떻게 해야 하나 막막했는데

사람들과 대화하다 보니 같은 생각을 가지고 있으신 분들이 많아서 좀 위안이 됐고

자바스크립트에만 몰두해도 된다고 하셔서 요즘은 자바스크립트 기초 문법 강의 듣고

프로그래머스 0단계 풀어보고 있다.

프로그래머스 풀면서 많은 함수들을 알게 되고 그 함수들을 공부하게 돼서 좋은 거 같다

사실 여러 사람들의 이야기를 듣다 보니 조바심이 나서 이거 했다가 저거 했다가 왔다 갔다 하느라 

뭘 제대로 한 게 없는 거 같았는데 프로그래머스 알게 된 후로는 방향이 좀 잡혀서 다행이었다.

다음 주 금요일부터 또 새 프로젝트 시작인데 그전까지 어떻게 공부를 해야 할지 계획을 잘 짜 놔야겠다.

일단 오늘도 프로그래머스 0단계 몇 문제 풀고 강의를 들어야겠다.

남들보다 느린 만큼 배로 노력하고 열심히 해야 하는데 저번 주의 나와 이번 주의 내가 별로 달라진 게 없는 거 같아서

진짜 반성해야 할 거 같다. 

 

 


자료형 변환

prompt() : 문자열 자료형 입력. 사용자로부터 내용을 입력 받아서 사용하는 함수

// prompt(메시지 문자열, 기본 입력 문자열)
<script>
    const input = prompt('메시지', '입력값')
    alert(input)
</script>

☞위 코드 실행 시 나타나는 화면

 

 

confirm() : 사용자로부터 불 자료형 값으로 입력 받는 함수. 

<script>
    const input = confirm('수락하시겠습니까?')
    alert(input)
</script>

☞ 위 코드 실행 시 아래 화면이 나타나는데 확인을 누르면 true, 취소를 누르면 false를 리턴한다.

 

 

Number() : 다른 자료형 → 숫자 자료형으로 변환

// 숫자가 적혀 있는 문자열을 숫자로 변환한다
>Number("273")
273
>typeof(Number("273"))
'number' // 자료형은 숫자.
>Number("$273")
NaN // 다른 문자가 들어있어서 숫자로 변환할 수 없는 문자열의 경우 'NaN' 출력
   // NaN은 자바스크립에서 자료형은 숫자이지만, 실질적으로 숫자로 변환할 수 없음(Not a Number)     
>typeof(Number("$273"))      
'number' // 자료형은 숫자.
// 불을 숫자로 변환하면
>Number(true)
1
>Number(false)
0

「Number() 함수를 사용하지 않고 숫자 연산자 -, *, /를 사용해 변환 가능」

// 숫자가 아닌 다른 자료에서 0을 빼거나, 1을 곱하건 또는 1로 나누면 변환함
>"52" - 0
52
>typeof("52" - 0)
'number'
>true - 0
1
>typeof(true - 0)
'number'
// 불과 숫자를 + 연산자롷 연결하면 불이 숫자로 변환된 뒤에 더해짐
>1 + true
2
>1 + false
1

 

String() : 다른 자료형 → 문자열 자료형으로 변환

>String(52.273) // 숫자 자료형 -> 문자열 자료형
'52.273'
>String(true) // 불 자료형 -> 문자열 자료형
'true'
>String(false)
'false'

「String() 함수를 사용하지 않고 문자열 연결 연산자(+)를 사용해 변환 가능」

>273 + "" // 빈 문자열을 연결해 문자열 자료형으로 변환
'273'
>true + ""
'true'

 

Boolean() : 다른 자료형 → 불 자료형으로 변환

  → 대부분의 자료는 불로 변환했을 때 true로 변환됨. 

       다만 0, NaN, '...' 혹은 "..."(빈 문자열), null, undefined라는 5개의 자료형은 false로 변환함

// 아래 5가지는 외우기
>Boolean(0)
false
>Boolean(NaN)
false
>Boolean("")
false
>Boolean(null)
false
>let 변수
undefined
>Boolean(변수)
false

「Boolean() 함수를 사용하지 않고 논리 부정 연산자(!)를 사용해 변환 가능」

>!!273 // 논리 부정 연산자(!)를 2번 사용해서 변환함
true
>!!0
false
>!!'안녕하세요'
true
>!!''
false

 

예제
<script>
    // 프로그램(program = pro[미리] + gram[작성된 것])
    // 입력 : prompt() inch 단위 숫자
    const input = Number(prompt(`inch 단위의 숫자를 입력해주세요.`))
    // 처리 : 1inch -> 2.54cm
    const ouput = input * 2.54
    // 출력 : cm 단위의 숫자
    alert(`${input}inch = ${ouput}cm입니다.`)
</script>    


<!-- 사용자로부터 숫자를 입력받아 cm를 inch 단위로 변환하여 출력, 1cm는 0.393701inch -->
<script>
    const input = Number(prompt(`cm단위의 숫자를 입력하세요`))
    const ouput = input * 0.393701
    alert(`${input}cm = ${ouput}inch 입니다`)
</script>


<!-- 사용자로부터 원의 반지름을 입력받아 원의 넓이와 둘레 출력, '넓이=3.14*반지름*반지름', '둘레=2*3.14*반지름' -->
<script>
    const r = Number(prompt(`원의 반지름을 입력하세요`))
    const area = 3.14 * r * r
    const pre = 2 * 3.14 * r
    alert(`넓이 = ${area}, 둘레 = ${pre}`)
</script>


<!-- 현재 환율 기반으로 사용자에게 숫자를 입력받아 달러(USD)에서 원화(KRW)로 환율 변환. 현재 1달러=1319  -->
<script>
    const usd = Number(prompt(`달러 단위의 금액을 입력하세요`))
    const krw = usd * 1319
    alert(`달러 : ${usd} -> 원화 : ${krw}`)
</script>