자바스크립트의 기본 데이터 타입들을 알아보자!!
자바스크립트에는 여러 개의 데이터 타입들이 존재합니다.
그러면 어떤 데이터 타입들이 존재하고
어떻게 사용할수있는지 알아보겠습니다.
숫자 타입
자바스크립트에서 숫자를 사용해서 간단한 수학을 할 수 있고
또 자바스크립트에 내장돼있은 수학 함수들을 사용해서
sin/cos 같은 수학도 할 수 있습니다.
우리가 아는 기본 수학 기호들은 더하기(+), 빼기(-), 나누기(/), 그리고 곱하기(*) 가있죠
그런데 코딩에서는 수학기호 하나가 더 있습니다,
바로 모듈러(%)입니다.
모듈러는 나누기와 비슷하지만 반대로 작동합니다.
나누기는 나누어진 숫자를 주고 (30 / 3 = 10)
모듈러는 나머지 숫자를 줍니다 (30 % 3 = 0)
자바스크립트 자체에 있는 수학 함수를 사용하려면 Math클래스를 사용하면 됩니다.
소수점, 음수, 정수 다 사용 가능합니다.
// 예시
4 + 4
2.5 * 3.5
-4 / 5
30 % 3
(5 + 4) * 3
Math.cos(4)
Math.sin(9)
Math.PI
스트링/캐릭터(character) 타입
코딩을 하다 보면 스트링이라는 단어를 많이 듣게된느데요,
스트링 = 텍스트라고 볼 수 있습니다.
스트링은 여러 캐릭터(character)가 모여 만들어진 데이터 타입이고
캐릭터는 글 하나를 뜻합니다.
예를 들어서 "Hello"라는 스트링에는 5개의 캐릭터가 모여있는 거죠.
자바스크립트에 내장된 스트링 함수들로 할 수 있는
몇 가지로는:
- 대/소문자로 바꾸기
- 스트링의 캐릭터 바꾸기
- 캐릭터의 위치 찾기
- 스트링 길이 찾기
이 외에도 다른 많은 함수들이 있습니다.
// 예시
"Hello".length
"hello".replace("h", "t")
"hello".indexOf("e")
정렬(array) 타입
정렬 데이터 타입은 다른 데이터들을 정렬해놓은 데이터 타입입니다.
정렬 데이터에는 여러 가지 데이터 타입들을 넣을 수 있습니다.
정렬 데이터 타입은 두 가지로 나눌 수 있는데요,
정렬된 정렬 타입, 정렬 안된 정렬 타입.
정렬된 정렬 타입은 말 그대로 안에 있는 데이터들이 순서대로 정렬돼있는 거고,
정렬 안된 정렬 타입은 안에 있는 데이터들이 순서 없이 있는 걸 말합니다.
자바스크립트에 내장된 함수로 할 수 있는 것 몇 가지들로:
- 데이터 넣기
- 데이터 빼기
- 두 정렬 타입 합치기
- 데이터 찾기
이 외에도 더 많은 함수들이 존재합니다.
정렬 타입은 0 기반 인덱스를 사용합니다.
인덱스는 정렬 타입 안에 있는 데이터의 위치를 말합니다.
정렬 타입에서 0 인덱스는 첫 번째 데이터를 가리킵니다.
인덱스는 스트링 타입에서도 사용할 수 있고, 정렬과 마찬가지고 0 기반 인덱스입니다.
//예시
// 정렬 타입
[1, 2, 3, 4, 5, 6]
[4, 3, "hello", "bye", -5, 9]
let arr = ["apple", "banana"]
arr.length // 2
arr[0] // apple
arr.push("kiwi") // ["apple", "banana", "kiwi"]
arr.pop() // kiwi
arr // ["apple", "banana"]
오브젝트(object) 타입
오브젝트를 쉽게 이해하는 방법은 어떠한 사물을 생각하면 쉽습니다.
자동차라는 사물은 모두 모델, 이름, 무게, 색상, 문 개수, 휠 사이즈 등 이 있지만
각각 다른 이름, 다른 모델, 다른 색상을 가지고 있죠
오브젝트는 이렇게 사물을 데이터화할 때 사용됩니다
const person = {
name: "Loki",
power: "illusion",
introduction: function() {
console.log(`I am ${this.name}. My power is ${this.power}`)
}
}
const thor = Object.create(person)
thor.name = "Thor" // "name"은 thor의 이름이다
thor.power = "Thunder" // "power"은 thor의 파워이다
thor.introduction()
// output: "I am Thor. My power is Thunder"
불리언(Boolean) 타입
이 타입은 true와 false로만 형성돼있습니다
두 가지의 조건을 비교하거나 조건문을 사용할 때 사용합니다
const jsIsFun = true
if (jsIsFun == true) {
console.log("I agree")
}
// output: I agree
if (jsIsFun == false) {
console.log("You should try it")
)
// there is no output
이렇게 자바스크립트에서 사용 가능한 데이터 타입들을 알아보았습니다
피드백은 댓글에 남겨주시면 감사하겠습니다
그럼 오늘도 수고하셨습니다
끝!
'웹' 카테고리의 다른 글
[CSS] Flexbox을 사용해서 정말 예뻐지는 웹 레이아웃 만들기! (0) | 2022.12.24 |
---|---|
[HTML] srcset 속성을 사용해 웹 페이지의 성능과 사용자 경험을 개선해보자! (0) | 2022.12.21 |
Javascript | 자바스크립트, 이건 뭐지? (0) | 2021.06.21 |
CSS 쉽게 배우기 | CSS만으로 애니메이션 만들어 봤니? (0) | 2021.06.05 |
CSS 쉽게 배우기 | Pseudo Class(수도 클라스)2 (0) | 2021.04.28 |
댓글