개발일지
베이스캠프 3일차 본문
데이터 타입
데이터에는 몇 가지 종류가 있다 이를 데이터 타입이라고 부르고 이 타입에는
아래에 보이는 타입으로 나뉜다
- 문자열(String) : 문자열은 “” 안에 적어주며, 따옴표 안에 적힌 값들은 숫자여도 문자열로 취급한다
- 숫자(Number) : 숫자를 나타내는 자료형이며 모든 숫자를 실수로 처리합니다. 따옴표 없이 적어주셔야 합니다.
- 불린(Booolean) : true(참), false(거짓)으로 나타내는 자료형
- undefined : 변수를 선언했지만 값이 할당되지 않았을 때 자바스크립트 엔진이 암묵적으로 초기화하는 값
- null : 의도적으로 값이 없음을 명시하기 위해 할당하는 값
- object : {}, 객체도 데이터 타입중에 하나 객체는 여러 종류의 데이터를 하나로 담아주는데 이때 각 데이터마다 키 : 값의 형태로 할당한다 배열은 객체의 한 종류
let name = "캠프" // (문자열)
let number = 3 // (숫자열) ""를 쓰지 않아야 숫자가 됩니다.
let fool = true // ""를 쓰지 않아야 boolean 이 됩니다.
데이터 타입 변경
Number("35") // 문자 35 를 숫자 35 로 변경합니다.
String(24) // 숫자 24 를 문자 "24" 로 변경합니다.
String(true) // 불린 true를 문자 "true"로 변경합니다.
연산자
연산자에는 산술연산자,비교 연산, 논리 연산자, 논리 연산자로 나뉘다
산술 연산자
산술연산자는 더하기 +, 빼기 -, 곱하기 *, 나누기 /, 나머지 %, 로 연산을 하는 기호를 의미합니다
20 + 2 // 22
20 - 2 // 18
20 * 2 // 40
20 / 2 // 10
20 % 3 // 2 (20을 3으로 나눈 나머지)
위에서 보듯이 문자 타입의 경우 더하기 연산자를 이용하면 문자열이 합쳐지는 걸 볼 수 있습니다
// 문자 타입 연산
"89" + "54"
// 결과 : "8954"
//숫자 타입 연산
89 + 54
// 결과 : 140
% 나먼지 연산자
내가 사용했던 방법은 홀짝을 찾을 때 사용했다
let num = a
if(num % 2 === 0){
return "짝수"
}else{
return "홀수"
}
이러식으로 2로 나눈 나머지 값이 0일때 짝수를 나오게 하고
아니면 홀수를 나오게 해서 특정 값을 찾을때 사용
비교 연산자
비교연산자는 좌우의 두 값을 비교해야 할 때 사용하는 연산자이며, Boolean을 반환합니다.
- === : 같다
- !== : 같지 않다
- <= : 작거나 같다
- >= : 크거나 같다
- > : 크다
- < : 작다
20 < 30 // true
20 > 30 // false
10 <= 10 // true
20 >= 20 // true
20 === 20 // true
20 !== 10 // true
예전에는 느슷한 동치 연산자를 주로 썼지만 요즘에는 오류들이 발생할 확률이 있어서 엄격한 동치 연산자를 씀
논리 연산자
논리 연산자는 그리고(&&), 또는(||), 부정(!)을 나타내는 기호를 의미합니다.
// 좌/우 모두 참이면 "참"
(20 === 20) && (10 === 10) // true
// 좌/우 둘 중 하나가 참이면 "참"
(20 === 10) || (10 === 10) // true
// 괄호의 부정(!)
!(20 === 10) // true
조건문
if.... else
if 문은 특정 조건이 참일 때 명령문을 실행하며, 거짓일 경우에는 else 문을 실행하게 됩니다. 또한 조건은 비교연산자를 사용 한 참 또는 거짓으로 평가되는 표현식입니다.
핵심 시작점과 끝점이 존재
const profile = {
name: "철수",
age: 12,
school: "다람쥐초등학교",
};
undefined;
if (profile.age <= 20) {
console.log("성인입니다");
} else if (profile.age <= 8 >= 19) {
console.log("학생입니다");
} else {
console.log("어린이입니다");
}
// VM1015:2 성인입니다 첫번쩨 조건문에서 비교연산자를 잘못 적음
undefined;
if (profile.age >= 20) {
console.log("성인입니다");
} else if (profile.age <= 8 >= 19) {
console.log("학생입니다");
} else {
console.log("어린이입니다");
}
// VM1095:6 어린이입니다 두전째 조건문에서 조건을 이상하게 줌 8보다 작을경우라고 줘서
undefined;
if (profile.age >= 20) {
console.log("성인입니다");
} else if (profile.age >= 8 >= 19) {
console.log("학생입니다");
} else {
console.log("어린이입니다");
}
// VM1110:6 어린이입니다 여기선 두번째 조건문 뒤에 비교연산자를 하나더 써줘서
undefined;
if (profile.age >= 20) {
console.log("성인입니다");
} else if (profile.age <= 19 && profile.age >= 8) {
console.log("학생입니다");
} else {
console.log("어린이입니다");
}
// VM1129:4 학생입니다
undefined;
if (profile.age >= 20) {
console.log("성인입니다");
} else if (profile.age >= 8) {
console.log("학생입니다");
} else {
console.log("어린이입니다");
}
// VM1129:4 학생입니다
undefined;
반복문
반복문 은 반복적인 작업을 해야 할 때 사용하는 문법입니다. 가장 일반적인 반복문에는 for문이 있습니다.
핵심 몇 번 반복할것인가
초기식 : 반복문의 시작점 위의 let i =0이면 이 반복문의 시작점은 0부터 시작점이 0일 필요는 없고 상황에 맞춰서 i 도 다
른 k, o 이런 식으로 사용 가능하다
조건식 : 반복문의 끝점 어디까지 반복할지 정하는 부분
증감 문 : 카운트를 어떻게 할 것인가 특별한 일이 없는 이상 1씩 증가하거나 감소하는 식으로 사용
! const는 재할당이 안돼서 let을 사용 변수명을 고정으로 해서 한번 쓴 변수명을 사용
간단한 예시
const classmates = ["철수", "영희", "훈이", "민수" , "민지" ]
for(let i=0; i<=4; i=i+1) {
console.log(classmates[i] + "어린이")
}
// 결과
// 철수어린이
// 영희어린이
// 훈이어린이
// 민수어린이
// 민지어린이
수학 객체
자바스크립트에서는 수학과 관련된 기능과 속성을 가진 객체를 제공합니다. 수학 객체 메서드를 이용하면 수학과 관련된 작업들을 빠르고 편리하게 처리할 수 있습니다.
// 최대값, 최소값
Math.max(4, 29, 1, 12) // 29
Math.min(4, 29, 1, 12) // 1
//반올림, 내림, 버림
Math.round(2.712) // 3
Math.ceil(4.1) // 5
Math.floor(12.8) // 12
//랜덤
Math.random() // 0.822...(0 ~ 1 까지의 임의의 수)
//루트
Math.sqrt(2) // 1.414...
DOM
Document Object Model의 의 줄임말로, 웹브라우저가 정적인 웹페이지를 변경하거나 조작하기 위해 HTML 파일을
자바스크립트 객체로 만들어 줍니다.