베이스캠프 3일차
오늘도 자바스크립트를 배웠다.
데이터타입과 연산자
먼저 데이터타입과 연산자를 배웠다.
string a, b, c 등등 문자값들
number - 1, 2, 3 등등 상수값들
Boolean - true, false
Object - 객체(배열)
Null
Undefined
null과 undefined의 차이점은 null 같은 경우는 프로그래머가 이 변수에 아무값이 없다고 직접 입력했을 때일 경우고 undefinde는 컴퓨터가 코드를 읽었을때 값이 없을경우 알려준다. 즉 둘의 큰차이는 프로그래머가 의도했는지 안했는지의 차이이다.
자바스크립트 연산자에는 산술 연산자, 비교 연산자, 논리 연산자가 있다.
산술 연산자는 기본적으로 +, -, *, /, %가 있다.
비교 연산자는 <, >, <=, >=, ===, !==가 있다.
===는 양쪽이 같으면 true을 반환한다.
!++는 양쪽이 다르면 true을 반환한다.
자바스크립트에는 == 연산자도 있는데 ==와 ===의 차이점은 === 같은 경우는 데이터 타입이랑 값 둘다 비교를 해주고 ==은 값만 비교를 해준다.
예를 들어서 1 === "1"은 false값이 나오고 1 == "1"은 true 값이 나온다.
==같은 경우는 데이터 타입을 비교해주지 않기 때문에 사용하지 않는다.
논리 연산자에는 &&, ||, !가 있다.
&& 연산자는 양쪽이 true여야 true를 반환한다.
|| 연산자는 한쪽만 true여도 true를 반환한다.
! 연산자는 boolean 값을 바꿔준다.
예를들어 !true // 출력값: false
이렇게 바꿔줄 수 있다.
조건문
조건문은 컴퓨터가 조건에 맞는지 true와 false로 판단하여 각각 다른 명령을 실행할 수 있도록 하는 문법이다.
if(a!==b) {
명령문1
} else if( (c===d) && (e===f) ) {
명령문2
}
else {
명령문3
}위에가 if문의 형식이다.
아래의 코드는 자신이 청소년인지 성인인지 구분하는 코드이다.
age = 15; // age 변수 선언과 상수 15 할당
if( age >= 20) { // 만약 나이가 20살이랑 같거나 크면 성인이다
alert(“성인”)
}
else if ( age >= 14 ) { // 만약 나이가 14살이랑 같거나 크면 청소년이다. // 나는 처음에 13 < age < 20 이렇게 적었는데 코드의 최적화를 위해서 저렇게 적으면 안된다고 한다. 왜나하면 위에 if에서 이미 20살 위에 나이를 잘라버렸기 때문에 <20을 안적어도 조건을 적을 수 있기 때문이다.
alert(“청소년”)
}
else if (age > 0 ) {
alert(“유아”)
}
Else { // 유저가 -1살 0살 이렇게 장난식으로 적을 수 있다 그래서 방지하기 위해 적는다.
alert(“나이를 잘못 입력”)반복문
반복문을 이용하면 명령문을 반복할 수 있다.
for(초기식; 조건식; 증감문) {
반복해서 실행할 명령문
}
for( let i = 0; i<10; I++) {
1+i;
}위에가 for문의 형식이다.
반복문에는 특정 조건 만족 시 조건식을 통한 정상 종료 이전에도 종료(break)가 가능하다.
즉 명령문을 실행하지 않고 다음 반복으로 건너뛰기 가능하다.
####수학 객체
수학 객체란 자바스크립트의 수학 기능을 사용하는 명령어이다.
수학 객체에는 많은 메소드가 있다.
| Math.max(1,2,6) | 최대값 구하기 |
|---|---|
| Math.min(1,2,3) | 최소값 구하기 |
| Math.random() | 0~1 랜덤 수 생성 |
| Math.round(2.12) | 반올림 |
| Math.ceil(2.12) | 올림 |
| Math.floor(2.12) | 버림 |
회원가입할때 인증번호 만드는 예시가 있다.
만약 012345라는 인증번호가 있으면 012345는 상수이기 때문에 012345라는 인증번호를 불러 올수 없다.
그래서 012345를 문자열로 만들어야 한다.
Math.floor( math.random() * 1000000) // 랜덤 메소드로 숫자를 만들고 1000000을 곱해 랜덤 숫자를 소수점 앞으로 옮겨준다. 그리고 floor메소드로 소수점 뒷 수자를 제거한다. *1000000을 곱해주는 이유는 random 메소드는 0.1131244, 0.24324324, 0.32423432 이렇게 소수점 값을 불러준다. 그래서 소수점을 정수로 만들기 위해 곱해주고 소수점을 없애주는 것이다.
String( Math.floor( Math.random() * 1000000) ) // string라는 함수를 이용하여 상수값을 문자열로 만들어 준다.
31345
1234
231456
// 근데 앞에 0이 생기면 001234가 1234가 되는 문제가 생긴다.
String( Math.floor( Math.random() * 1000000) ).padStart(6, “0”) // 그래서 padStart 메소드를 이용하여 6자리 숫자가 되지 않으면 앞에서부터 문자열 0을 채워 준다.
012345
348488
001234
Let result = String( Math.floor( Math.random() * 1000000) ).padStart(6, “0”) // 간단하게 줄이기 위해 result 변수에 넣는다.DOM
Dom은 html을 제어 할때 사용한다.
Dom을 이용하면 html과 자바스크립트가 서로 상호작용을 하여 동적인 페이지를 만들 수 있다.
document.getElementByld(“tagID”).InnerText
= “hello”위에는 dom을 사용할때 쓰는 형식이다.
해석을 하자면 html파일로 가서 tagID라는 id를 가진 태그를 선택하여 텍스트를 hello로 바꾼다라는 뜻이다.
