개발일지

베이스캠프 3일차 본문

회고/TIL

베이스캠프 3일차

wa_n 2022. 10. 8. 18:49
728x90
반응형

데이터 타입 

데이터에는 몇 가지 종류가 있다 이를 데이터 타입이라고  부르고 이 타입에는

아래에 보이는 타입으로 나뉜다

  1. 문자열(String) : 문자열은 “” 안에 적어주며, 따옴표 안에 적힌 값들은 숫자여도 문자열로 취급한다
  2. 숫자(Number) : 숫자를 나타내는 자료형이며 모든 숫자를 실수로 처리합니다. 따옴표 없이 적어주셔야 합니다.
  3. 불린(Booolean) : true(참), false(거짓)으로 나타내는 자료형
  4. undefined : 변수를 선언했지만 값이 할당되지 않았을 때 자바스크립트 엔진이 암묵적으로 초기화하는 값
  5. null : 의도적으로 값이 없음을 명시하기 위해 할당하는 값
  6. 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 파일을

자바스크립트 객체로 만들어 줍니다.

 

728x90
반응형

'회고 > TIL' 카테고리의 다른 글

베이스캠프 8일차  (1) 2022.10.14
베이스캠프 7일차  (0) 2022.10.13
베이스캠프 6일차  (0) 2022.10.12
베이스캠프 4일  (0) 2022.10.11
베이스캠프 1~2일차  (0) 2022.10.07