Today I Learn 20220627

❤ Todo

💡 면접 질문 4개 ✔
📗 자바스크립트+jQuery 완전정복 스터디 1 ✔
📗 자바스크립트+jQuery 완전정복 스터디 2 🔺
📗 자바스크립트+jQuery 완전정복 스터디 3 🔺
💻 프론트엔드 개발환경의 이해와 실습 (webpack, babel, eslint..) ✔

❤ Error & Solution

❤ What I learned

면접 질문

→ github frontend-interview
1. Cascading에 관해서 설명해주세요
2. CSS 애니메이션과 JS애니메이션의 차이에 대해 설명해주세요
3. Position 속성을 나열해주세요
4. Position을 어떻게 사용하는지 알려주세요

클로저를 사용하면 좋은 점

연관 있는 변수와 기능(중첩 함수)을 하나의 함수로 묶어 독립적으로 실행시킬 수 있다. 함수 내부에 데이터가 만들어지기 때문에 함수 외부에서 수정할 수 없는 보호된 데이터를 만들 수 있다. 객체지향 프로그래밍에서는 이를 private 데이터라고 부른다.

타이머 함수

1. setInterval() 일정 시간마다 주기적으로 특정 구문을 실행
2. setTimeout() 일정 시간이 지난 후 특정 구문을 딱 한번 실행
3. clearInterval() 실행 중인 타이머 함수를 멈추는 기능

여러 개의 기능이 들어있는 중첩 함수를 기능별로 나눠 만들기

→ github front-code

물고기 자동으로 움직이기

→ github front-practce

이미지 배너 만들기

→ github front-code

자바스크립트 DOM 객체의 주요 기능 정리

jQuery는 노드를 추가/삭제/이동한다거나 글자 색을 변경하는 등의 작업을 처리할 때 자바스크립트 DOM 객체들의 프로퍼티와 메서드를 사용해 처리한다. jQuery는 단지 자바스크립트 DOM 기능을 쉽게 해주는 라이브러리라는 점을 꼭 기억해야 한다.
→ 독학 카테고리

jQuery 핵심 내용 정리

→ 독학 카테고리

Q&A

1번 구문은 정상적으로 동작하지 않고 2번 구문은 정상적으로 동작. 그 이유는?

// 1번
$("#target").css("font-size").addClass("select");
// 2번
$("#target").css("font-size",12).addClass("select");

jQuery 레퍼런스를 살펴보면 css()메서드의 매개변수가 하나인 경우 리턴값이 문자열이다. 즉, 문자열인 String 클래스에는 jQuery의 기능인 addClass() 메서드가 존재하지 않기 때문에 실행되지 않는 것이다.

❤ Thinking

이제 슬슬 토이프로젝트를 만들어야하는데 뭘 만들어야할까.. 오늘 남은 시간동안 고민해보자.