Record/TIL

TIL 2023.03.07(온보딩 1일차)

junhub 2023. 3. 7. 12:09

표현식

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

 

문장

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

 

키워드

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

 

식별자 

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

 

주석

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

 

 

자료형

프로그램이 처리할 수 있는 모든 것을 자료(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( )를 통해 리턴한다.