본문 바로가기
Study/Frontend_study

패스트캠퍼스 환급챌린지 18일차 미션 (2월 18일) : 프론트엔드개발 강의 후기

by ramiiiiii 2024. 2. 18.

오늘은 ch.09 조건문...

 

오늘은 꾸리꾸리한 게 날씨가 뭔가 심상치 않다..!!

비가 오려는 게야 그런게야...

 

아무튼 꾸리꾸리한 날씨를 이겨내고 오늘 강의를 들으려고 한다.

후하 주말이 가고 있지만 즐겁고 감사하다:)

 

 

 

조건문

에 대해 배웠다.

 

**조건문의 의미**

조건문이란

어떤 조건이 주어질 때 어떤 동작을 수행하도록 하는, 즉 주어진 조건의 만족 여부에 따라 선택적으로 실행하고자 할 때 사용되는 문장이다. 프로그래머가 명시한 불린자료형 조건이 참인지 거짓인지에 따라 달라지는 계산이나 상황을 수행하는 프로그래밍 언어의 특징이다.

 

ex.

간단하게 let 뒤로 isshow 가 true(참) 일 때, 

if 문에서 isshow(true)이면 console.log('Show!'); 이다.  그래서 참일 경우, show! 가  나타나는 거다.

 

조건문은 그냥 바로 보이니까 해석이 쉽다.

 

 

DOM API

Document Object Model, Application Programming Interface 줄임말

 

**DOM API  의미**

DOM API 란

문서 객체 모델(DOM, Document Obect Model)은 자바스크립트에서 HTML과 XML을 제어하는 여러가지 명령들을 제공해주는 인터페이스다.  즉, 웹페이지를 스크립트 또는 프로그래밍 언어들에서 사용할 수 있게 연결시켜주는 역할을 한다.

 

 

HTML 요소 검색 

document.querySelector('선택자')

  • '선택자'로 html 요소 중 첫 번째 요소 하나만 검색

document.querySelectorAll('선택자')

  • html 요소 중 '선택자'에 해당하는 모든 요소들 검색, 배열로 리턴

document.getElementById('아이디')

  • 아이디 이름으로 요소 검색
  • html 요소 중 '아이디'를 갖고 있는 요소 검색

document.getElementByTagName('태그')

  •  태그 이름으로 요소 검색
  • html 요소 중 '태그'에 해당하는 모든 요소들 검색, 배열로 리턴 

document.getElementByClassName('클래스')

  • 클래스 이름으로 요소 검색
  • html 요소 중 '클래스'에 해당하는 모든 요소들 검색, 배열로 리턴

 

DOM 객체 동적 생성 및 자식 요소로 추가/삭제 

document.createElement('태그')

el.appendChild(자식 객체)

el.removeChild(자식 객체)

 

요소의 클래스 정보 객체 활용 : 클래스 추가/삭제/검색

 

el.classList.add('클래스')

  • el 객체에 '클래스' 라는 클래스 추가

el.classList.remove('클래스')

  •  el 객체에서 '클래스' 라는 클래스 삭제

el.classList.contains('클래스')

  •  el 객체에 '클래스' 라는 클래스 있다면 true 반환, 없다면 false 반환

 

 

알려주신 거/직접 입력해본 거

 

 

끄허 조건문 이후로 dom 을 시작하고 나서는 정말 외국말 듣는 거 같은 느낌이다.

후하 단어와 그 선언 문자데이터 그런 것들이 엉키고 설키고 복잡하다.

 

아마도 이 부분에 대해서는 다시 듣는 거도 좋을 거 같다는 생각이 든다.

계속 반복해서라도 알고 넘어가는 게 느리더라도 나에게는 필요한 일이라는 생각이 든다.

 

어차피 공부하려고 돈 내고 듣는 건데 한 번 알아도 제대로 알고 넘어가는 게 중요하니까.

js   자바스크립트 부분을 다음주에 다시 한 번 더 듣고 공부해야할 거 같다.

포기는 하지 말자. 어렵다고.

뭐든 처음은 다 어려우니까.

할수 있다 아자.

 

 

본 포스팅은 패스트캠퍼스 환급 챌린지 참여를 위해 작성하였습니다.
#패스트캠퍼스 #직장인자기계발 #직장인공부 #환급챌린지 #패스트캠퍼스후기 #오공완 #프론트엔드

 

https://bit.ly/48sS29N

 

패스트캠퍼스 [직장인 실무교육]

프로그래밍, 영상편집, UX/UI, 마케팅, 데이터 분석, 엑셀강의, The RED, 국비지원, 기업교육, 서비스 제공.

fastcampus.co.kr