입문자를 위한 자바스크립트 기초 강의_JS기초02

* null, undefined 그리고 boolean

null 데이터는 '없다'라는 의미를 가진 데이터이다. 
의도적으로 데이터가 없음을 나타내기 위해 사용하는 일종의 표현 수단이다.

undefined는 아직 데이터가 정의되어 있지 않음을 의미하는 것이다. 변수 선언만 하고 값이 없는 상태. 

boolean은 데이터 타입 중 하나. true, false 단 두가지 값만 존재하는데 참인지 거짓인지 판별할 때 사용하는 데이터.

* Document Object Model

웹브라우저는 HTML 문서를 해석하고 화면을 통해 해석된 결과를 보여주는데 이 과정을 우리는 '랜더링'이라고 한다.
랜더링의 과정에서 html을 트리 형태로 구조화해 표현하는 문서(객체)를 생성하는데 이것이 DOM이다.

DOM은 또한 자바스크립트를 사용해서 웹 화면의 콘텐츠를 변경하거나,
이벤트를 처리할 수 있도록 프로그래밍 인터페이스를 제공한다.

* document&methods

document는 페이지 콘텐츠 즉 DOM에 대한 진입점 역할을 하는 프로그래밍 인터페이스이다.
이를 이용하면 페이지의 정보를 얻거나 웹 요소를 생성 및 조작할 수 있다.
또한 document는 다양한 속성과 메서드를 즉 API를 제공한다. 
document의 메서드 중 대표적인 메서드 두 가지에 대해서만 알아보고 나머지는 아래 관련 문서링크를 참고하기!

먼저 querySelector 메서드는 선택자를 인자로 전달받아서,
전달받은 선택자와 일치하는 문서 내 첫번째 요소를 반환하는 메서드이다.
다음 getElementById 메서드는 메서드명에서 알 수 있듯이 id값을 인자로 받아서,
전달받은 선택자와 일치하는 문서 내 요소를 반환하는 메서드이다.

https://developer.mozilla.org/ko/docs/Web/API/Document

Document - Web API | MDN

* 비교 연산과 boolean

JS는 두 항을 비교할 수 있는 비교 연산자를 제공하고 이를 가지고 두 가지 유형을 비교할 수 있다.
크다 작다를 비교하는 대소비교, 같다 다르다를 비교할 수 있는 등가비교가 있다.
대소비교나 등가비교 모두 하나의 질문이며 질문의 답이 참 또는 거짓인 것이다.

대소비교에는 >, <, >=, <=의 연산자를 활용해서 비교하게 된다.
등가비교에는 ==, !=, ===, !==가 존재한다. ==는 같다, ===는 완전히 같다인데 이건 또 뭐지???

 

==는 추상적 비교로써 자료형이 서로 다르더라도 같다고 판단할 수 있는 비교이고,
===는 엄격한 비교로써 자료형과 데이터 모두 일치해야만 true가 나온다.

let num1 = '3';
let num2 = 3;
let num3 = 5;

console.log( num1 == num2 )			// true 
console.log( num1 !== num2 )			// true
console.log( num2 >= num3 )			// false
console.log( num2 <= num3 )			// true

* 조건문

조건문이란 주어진 조건의 참/거짓 여부에 따라 프로그램으 흐름을 결정할 수 있는 구문.
여기서 조건이란 불리언 데이터를 반환하거나 불리언 데이터로 해석할 수 있는 표현식을 의미한다.
키워드 if랑 else랑 사용해서 주어진 조건이 참일때, 거짓일 때 실행할 코드 추가해주면 된다.

let number = 5

if(number == 5) {
    console.log("조건으로 사용된 비교연산식이 참을 반환했다!")
} else {
    console.log("이번엔 거짓인가 봐!")
}

* 반복문

반복문은 비슷하거나 동일한 구문을 반복해서 수행할 수 있는 구문이다.
반복문에는 while문과 for문이 있는데 구조 및 동작 방식에서 차이를 보인다.

while문은 주어진 조건이 true 동안에 구문을 반복하는 반복문이다.
다르게 말하면 조건이 false가 될 때까지 구문을 반복한다고도 할 수 있다.

for문은 구문 작성시 반복을 위해 필요한 세 가지 요소인 초기식, 조건식, 반복식을 한 곳에 모아 작성해서 만드는 구문이다.
바로 예제 코드로 알아보도록 하는게 빠를 것 같으니 예제코드 짠!

// 1 ~ 10까지 출력
for(let i = 1; i <= 10; i++) {
    console.log(i)
}

// 1 ~ 8중 짝수만 출력
for(let i = 1; i <= 8; i++) {
  if(i % 2 == 0) {
    console.log(i)
  } 
}

https://www.inflearn.com/course/입문자-자바스크립트-기초강의/dashboard

입문자를 위한 자바스크립트 기초 강의 - 인프런 | 강의