1. 데이터 타입
ⅰ. 데이터 타입이란?
- 세상에 많은 데이터들이 존재하는데 이러한 데이터들을 컴퓨터가 보다 빠르고 효율적으로 처리하기 위해 자바스크립트라는 프로그래밍 언어가 구분해 놓은 것
- 자바스크립트에는 기본 또는 원시형(primitive)타입이라고 불리는 number, string, boolean, null, undefined이 존재함
ⅱ. 숫자(number)
- 숫자 데이터를 의미함
- 나이, 거리, 무게, 등 무수히 많은 종류의 데이터를 숫자로 표현
- 숫자는 ' ', " " 로 묶을 필요 없이 숫자만 입력하면 됨
console.log(10) // 10 출력
const myAge = 20
const yourAge = 28
console.log(myAge) // 20 출력
console.log(yourAge) // 28 출력
ⅲ. 문자열(String)
- 문자 데이터를 의미함
- " ", ' ' 로 데이터를 감싸야함
- 이름, 제품명, 등 많은 종류의 데이터를 문자로 나타낼 수 있음
const firstName = 'Jisu'
const lastName = 'Kim'
console.log(firstName) // Jisu를 출력
console.log(lastName) // Kim을 출력
ⅳ. Boolean
- 참과 거짓을 나타내는 true / false를 표현하는 데이터
- 비교연산자에서 많이 활용함
const isMan = true // 참을 의미하는 boolean data true를 변수에 할당함
const isWoman = false // 거짓을 의미하는 boolean data false를 변수에 할당
console.log(isMan) // true를 출력
console.log(isWoman) // false를 출력
// console.log(true) 처럼 변수에 데이터를 할당하지 않고 출력하는 것도 가능
ⅴ. null, undefined
- null은 텅텅 비어 있는 값을 의미
- undefined는 변수를 선언만 하고 값이 할당되어 있지 않은 것
let name = null
console.log(name) // null
let age
consoel.log(age) // undefined
● null은 변수를 선언할때 const로도 가능
● undefined는 변수를 선언할 때 const로 하면 Uncaught Syntax Error : Missing initializer in const declaration 오류 발생
→ 변수의 값을 할당하지 않았을때 뜨는 에러로 const 선언 시에는 반드시 값을 할당해야 함
※ Syntax Error
○ 객채를 문법적으로 유효하지 않은 코드를 해석하고 시도할때 생기는 오류
2. 연산자
ⅰ. 연산이란
- 수나 식을 일정한 규칙에 따라 계산하는 것을 의미
- 데이터와 데이터를 같이 처리해서 그 결과값을 반환해 준다는 의미
- 프로그래밍에서 연산자란 위와 같은 각각의 연산을 의미하는 기호
ⅱ.
- +기호를 사용하여 문자열을 이어 붙일 수 있음
- 문자열과 숫자를 이어 붙이면 숫자가 문자로 인식됨
console.log('My' + 'car') // My car 출력, + 기호를 이용하여 이어진 문자열로 리턴받음
console.log('1' + 2) // 12 출력, 숫자를 '',""로 감싸면 문자로 인식
// console.log(1 + 2)는 3을 출력함
- 템플릿 리터럴(Template literals)
백틱(``) 기호를 사용하여 문자열 데이터를 표현할 수 있음, + 기호를 사용 안 하고 간결하게 문자열 붙이기가 가능
const aPrice = 10000
console.log(`이 물건의 가격은 ${aPrice}원입니다`)
// console.log('이 물건의 가격은 ' + aPrice + '원입니다')와 동일함
ⅲ. 산술연산자(Numeric operators)
- 숫자 데이터에 대한 여러 연산들이 가능함
- 사칙연산(+, -, *, /), //(나머지 연산), **(거듭제곱)이 있음
console.log(2 + 1) // 3
console.log(2 - 1) // 1
console.log(4 / 2) // 2
console.log(2 * 3) // 6
console.log(10 % 3) // 나머지(remainder) 연산자, 1 출력
console.log(10 ** 2) // 거듭제곱(exponentiation), 10의 2승인 100 출력
ⅳ. 증감연산자(Increment and Decrement operators)
- 데이터의 값을 증가시키거나 감소시키는 연산자(++, --)
- 증감연산자를 변수 앞에 놓느냐, 변수 뒤에 놓느냐에 따라 차이가 발생
let count = 1
const preIncrement = ++count
// 증감 연산자를 앞에 놓게 되면
// count = count + 1 -> count 변수에 자기 자신에 1 더한 것을 다시 할당
// const preIncrement = count -> 위에 할당한 count 변수를 다시 preIncrement 변수에 할당
// 코드와 같은 내용
// 먼저 자기 자신에게 1을 더해서 재할당 한 후 , 이를 preIncrement 에 핟당했다는 의미
console.log(`count: ${count}, preIncrement: ${preIncrement}`) // count: 2, preIncrement: 2
let count = 1
const postIncrement = count++
// 증감연산자를 뒤에 놓게 되면
// const postIncrement = count
// count = count + 1
// postIncrement에 count 값을 먼저 할당하고, 이후에 1을 더해서 재할당
console.log(`count: ${count}, postIncrement: ${postIncrement}`) // count: 2, postIncrement: 1
count 변수를 const가 아닌 let으로 선언한 이유
- 증감연산자를 활용해 count의 값을 계속 증가시키고 다시 count에 할당하고 있기 때문에 const를 사용하면 에러 발생
ⅴ. 대입연산자(Assignment operators)
- 어떠한 값을 어떤 변수에 할당한다는 표현이 대입연산자를 사용한다는 의미
- = 기호뿐만 아니라 +=, -=기호 같은 것들을 통해서 연산과 대입을 한 번에 할 수 있음
const aPrice = 100000
const bPrice = 80000
let totalPrice = 0
totalPrice += aPrice // totalPrice = totalPrice + aPrice
console.log(totalPrice) // 100000
totalPrice += bPrice // totalPrice = totalPrice + bPrice
console.log(totalPrice) // 180000
totalPrice -= aPrcie // totalPrice = totalPrice - aPrice
console.log(totalPrice) // 80000
ⅵ. 비교연산자(Comparison operators)
- 숫자값을 비교하는 연산자이며 조건문에서 많이 활용됨
- 비교연산자를 통해서 얻는 값이 boolean(true, false)
consle.log(1 < 2) // 1이 2보다 작은가? true값을 반환
consle.log(2 <= 2) // 2가 2보다 작거나 같은가? true값을 반환
consle.log(1 > 2) // 1이 2보다 큰가? false값을 반환
consle.log(1 >= 2) // 1이 2보다 크거나 같은가? false값을 반환
ⅶ. 논리연산자(Logical operators)
- ||(or), &&(and),!(not)과 같은 연산자이며 조건문에서 많이 활용됨
- || 기호는 연산 대상 중 하나면 true값이어도 true를 리턴
- && 기호는 연산 대상이 모두 true값이여만 true를 리턴
- ! 기호는 true값을 false값으로, false 값을 true값으로 바꿔서 리턴
let isOnSale = true
let isDiscountItem = true
console.log(isOnSale && isDiscountItem) // true && true -> true
console.log(isOnSale || isDiscountItem) // true || true -> true
isOnSale = false
console.log(isOnSale && isDiscountItem) // false && true -> false
console.log(isOnSale || isDiscountItem) // false || true -> true
isDiscountItem = false
console.log(isOnSale && isDiscountItem) // false && false -> false
console.log(isOnSale || isDiscountItem) // false || false -> false
consle.log(!isOnSale) // !false -> true
ⅷ. 일치연산자(Equality operators)
console.log(1 === 1) // true
console.log(1 === 2) // false
console.log('Javascript' === 'Javascript') // true
console.log('Javascript' === 'javascript') // false -> 대소문자나 띄어쓰기까지 정확히 일치해야함
- 자바스크립트에는 두 가지 일치 연산자 ==, ===가 존재함
- === 는 엄밀한(strict) 일치연산자여서 비교하는 두 값의 데이터타입과 값 자체가 정확히 일치해야만 true를 리턴함
- == 는 비교하는 두 값의 데이터타입이 일치하지 않을 때 해당 값의 데이터타입을 자동으로 변환해 주는 자바스크립트만의 특성으로 인하여 실무에서는 거의 사용하지 않음
데이터 타입과 상관없이 값이 일치하면 true를 리턴함
// == 와 === 비교
console.log(1 === '1') // false -> 데이터 타입이 숫자와 문자이기 때문
console.log(1 == '1') // true -> 데이터 타입을 자동으로 변환해서 true 값을 출력함