JavaScript
1.JS와 HTML (<script>, event, console)
사용자와 상호작용하는 언어
2.JS 자료형
length
3.[js] 야간모드
❗️ css에서는 background-color로 쓰이는 것이 js에서는 backgroundColor로 쓰이는 등조금씩 다른 말로 쓰이는 속성들이 많다꼭 검색해서 확인하기❗️ 대소문자 하나도 바뀌면 작동 안 함 조심하기!
4.[js] this / 리팩토링(target, function)
js 야간모드 실습이 포스팅에서 만든 야간모드 버튼을 페이지 하단에도 만들기 위해 똑같은 코드를 복사하여 붙이면 어떤 일이 일어날까?똑같은 이름의 버튼이 두개 생기므로 위에 있는 버튼만 정상 작동하게 된다이러한 문제를 해결하기 위해서 아래에 복사한 코드의 버튼명을 바꾸
5.[js] 배열과 반복문
6.[js] 객체
많은 함수가 존재하면 정리하는 기준이 필요할 것이다📌 이 두개의 함수는 Body로 정리할 수 있다method(메소드) : 객체에 소속된 함수property(프로퍼티) : 객체에 소속된 변수📌 위의 코드에서 querySelctor은 method이다
7.[js] 변수 선언 (let, var, const)
var은 유연한 변수 선언이 가능하다는 점이 장점이자 단점이다복잡한 코드에서는 에러가 나오지 않아 잘못된 곳을 파악하기 어렵다반면에 let을 사용하면 x가 이미 선언되었다는 에러 메세지가 뜬다 (재선언 불가능)var은 블록 안에서 사용할 수 있는 반면에let은 블록 안
8.javascript 스타일 가이드
tab 대신 space 2칸 사용세미콜론 필요수평 정렬 권장 ❌ (금지는 아님)var 사용 ❌ (const, let 사용)화살표 함수 사용템플릿 리터럴 사용줄 연속 (백슬래시로 문자열 리터럴 내부의 줄 끝) 사용 금지for ... of 루프는 배열에 적합, for .
9.[js] 점 세개(...)/ spread operator / rest parameter
배열을 합칠 때배열을 분해할 때두 object를 합칠 때함수 인자를 배열로 쓸 때\+) 추가 기능(https://dinn.github.io/javascript/js-dotdotdot/ReferencesMozilla - Spread syntax (...)
10.[js] unshift, push
배열 앞에 추가배열 뒤에 추가
11.[js] 객체의 종류 (navigator, history, location, screen, window)
웹 브라우저 버전, 플러그인 설치 정보, 온라인/오프라인 정보가 담겨있다사용자가 수정 ❌ / 가져와서 보여주기만 ⭕️프리픽스CSS 호환성을 위해 해당 웹 전용의 CSS 속성을 부여할 수 있도록 웹 브라우저 제조사 별로 제공되는 표준 CSS 속성을 기술하는 것아직
12.[js] 문법 (일급 객체, 프로미스, 비구조화 할당, 스프레드 ,레스트)
1️⃣ 데이터 타입을 자기가 맞다고 생각하는대로 변환하므로 정확한 데이터 타입을 넘겨줘야한다2️⃣ 함수의 입력과 출력이 선택적이다일반적인 함수는 입력과 출력이 필수이다3️⃣ 함수에 부가 기능이 있어도 된다 ex) console.log()해당 타입이 변수에 할당될 수 있