본문 바로가기
Record/TIL

TIL 2023.03.07(온보딩 1일차)

by junhub 2023. 3. 7.

표현식

값을 만들어내는 간단한 코드를 말한다.

 

문장

하나 이상의 표현식이 모여 구성되는 것으로, 코드를 읽어들이는 기본 단위이다.

 

키워드

프로그래밍 언어가 처음 만들어질 때 정해진 특별한 의미가 있는 단어이다.(식별자로 사용 불가능)

 

식별자 

이름을 붙일 때 사용하는 단어이다.

 

주석

프로그램 코드를 설명하는 문장으로, 프로그램 진행에는 전혀 영향을 주지 않는다.

 

 

자료형

프로그램이 처리할 수 있는 모든 것을 자료(data)라고 부르며, 자료 형태에 따라 나눠 놓은 것을 자료형(data type)이라고 한다.

다양한 종류의 자료형이 있는데 가장 기본적이면서 많이 사용하는 자료형은 숫자(number), 문자(string), 불(boolean) 자료형이다.

 


 

[0] [1] [2] [3] [4]

문자열 뒤에 대괄호를 입력하고 괄호 안에 선택할 문자의 위치를 숫자로 지정할 수 있다. 이때 위치를 나타내는 숫자를 인덱스라고 부른다.

ex) '안녕하세요'[0]         ->       안 
       '안녕하세요'[1]         ->       녕 

 

문자열 내부의 문자 개수를 문자열 길이라고한다. 문자열 길이를 구할 때는 length 속성을 사용한다.

ex) let a = '안녕하세요'.length 

      console.log(a)           ===>       5 

 


연산자 설명
=== 양쪽이 같다
!== 양쪽이 다르다
> 왼쪽이 더 크다
< 오른쪽이다 더 크다
>= 왼쪽이 더 크거나 같다
<= 오른쪽이 더 크거나 같다
if(50 > 20){
    console.log('50은 20보다 크다')
}

비교연산자를 사용해 위와 같이 사용할 수 있다. 


연산자 설명
&& 논리곱 연산자(양쪽 변의 값이 모두 true 일때 true)
|| 논리합 연산자(양쪽 변의 값 중 하나만 ture여도 true)

자료형 검사

숫자, 문자열, 불 같은 자료형을 확인 할 때는 typeof 연산자를 사용한다.

 

typeof(자료)

>  typeof('가나다') 

"string"

 

> typeof(273)

"number"

 

> typeof(true)

"boolean"

 


템플릿 문자열

console.log(`표현식 273+52의 값은 ${273 + 52}입니다.`)

템플릿 문자열은 백틱(`) 기호로 감싸 만든다. 문자열 내부에 ${ } 기호를 사용하여 표현식을 넣으면 표현식이 문자열 내에서 계산된다. 

또 문자열 내부에 ${ } 기호를 사용하여 변수도 넣을 수 있다. 

 


상수

'항상 같은 수' 라는 의미로 값에 이름을 한 번 붙이면 값을 수정할 수 없다. 상수를 만드는 과정을 선언이라고 표현하고 const 키워드로 

선언한다. 

 

 

변수

'변할 수 있는 수'로 값을수정할 수 있다. 변수를 선언할 때에는 let 키워드를 사용한다. 

 


 

복합 대입 연산자 설명 사용 예  의미
+= 기존 변수의 값에 값을 더한다. a += 1 a = a+1
-= 기존 변수의 값에 값을 뺀다. a -= 1 a = a-1
*=  기존 변수의 값에 값을 곱한다. a *= 1 a = a*1
/=  기존 변수의 값에 값을 나눈다. a /= 1 a = a/1
%= 기본 변수의 값의 나머지를 구한다. a %= 1 a = a%1

 

 


 

증감 연산자 설명
변수++ 기존의 변수 값에 1을 더한다(후위)
++변수 기존의 변수 값에 1을 더한다(전위)
변수-- 기존의 변수 값에 1을 뺀다(후위)
--변수 기존의 변수 값에 1을 뺀다(전위)

 

let number = 10

console.log(number++)
console.log(number++)
console.log(number++)

> 10
    11
    12

 

위와 같은 결과가 나오게 된 이유는 증감 연산자가 후위에 들어갔기 때문에 해당 문장을 먼저 실행한 후 값을 더하라는 의미이다. 

따라서 console.log(number++)은 console.log(number)을 먼저 실행한 후 숫자 1을 더하게 된다.

 

반대로 console.log(++number)와 같이 증감 연산자가 전위에 들어가게 되면 먼저 연산을 한 후 console.log에 찍히게 된다.
 


문자열 입력

 

prompt(메세지 문자열, 기본 입력 문자열)

 

const input = prompt('달러를 입력하세요')

const dollar = Number(input)
const won = dollar * 1207

alert(`${dollar}는 현 환율 기준(1207원) ${won}원 입니다.`)

위 코드는 prompt을 이용한 함수이다. 

prompt 함수를 이용한 모습

1. input을 선언하여 prompt 함수를 통해 자료형을 입력 받는다. 

2. Number(input)을 통해 input 값을 숫자로 변환한 후 dollar에 할당

3. dollar을 현재 환율 1207에 곱한 값을 won에 할당

4. 최종 알림창 출력 

 


문자열 외에 불 자료형도 값으로 입력 받을 수 있다. 이때는 confirm( ) 함수를 사용한다.

 

confirm(메시지 문자열)

 

const input = confirm('수락하시겠습니까?')

alert(input)

위와 같은 코드를 <script> </script> 내에 입력하게 되면 

 

위와 같이 알림창이 뜨게되고 확인을 누르게된다면 

true를 리턴하고 취소를 누르게 된다면 false를 리턴한다. 

 


문자열 자료형으로 변환

String(자료)

 

숫자 자료형으로 변환

Number(자료)

 

불 자료형으로 변환

Boolean(자료)

> boolean(0) 

false 

 

>boolean(NaN)

false

 

>boolean("")

false

 

>boolean(null)

false

 

>let 변수

undefined

>boolean(변수)

false

 

논리 부정 연산자를 사용해 자료형 변환

불이 아닌 다른 자료에 논리 부정 연산자를 2번 사용하면 불 자료형으로 변환한다. 

 

>!!273

true

 

>!!0

false

 

>!!'안녕하세요'

true

 

>!!""

false

 


const input = prompt('inch 단위를 입력하세요')

const inch = Number(input)
const cm = inch * 2.54

alert(`${inch}inch는 ${cm}cm 입니다.`)

위 코드는 웹에서 inch 단위를 cm 단위로 바꿔서 리턴해주는 코드이다. 

 

1. prompt( ) 함수를 통해 입력을 받아 input에 할당해준다.

2. Number( ) 함수를 이용해 input 값을 숫자로 변환 후 inch에 할당한다.

3. inch 에 2.54를 곱한 값을 cm에 할당한다.

4. alert( )를 통해 리턴한다. 

'Record > TIL' 카테고리의 다른 글

TIL 20230313(온보딩 6일차)  (0) 2023.03.15
TIL 2023.03.10(온보딩 5일차)  (0) 2023.03.11
TIL 2023.03.08(온보딩 4일차)  (0) 2023.03.10
TIL 2023.03.08(온보딩 3일차)  (0) 2023.03.08
TIL 2023.03.07(온보딩 2일차)  (0) 2023.03.07

댓글