-

• @supports : 이름이 있는 함수 - 해당 조건을 지원할 때만 요소에 색깔 적용 - 브라우저 지원 조건 구현 가능 - 서로 중첩해서 사용 가능 - 미디어 쿼리 내에 사용 가능 * 기본 문법 @supports (조건) { ... } • Sources * //그리드를 이해하는 브라우저는 이 스타일을 적용 @supports (display: grid) { section#main { display: grid; } // display:grid를 쓰지 않는 레이아웃을 적용할 스타일 // 그리드 레이아웃을 쓴 스타일 } // = 중첩하여 사용 가능 @supports (display: flex) { @media screen { /* 화면에 적용할 플레스 박스 레이아웃*/ } @media print { /* 인..

• 상태 가상클래스 :enabled - 활성화 상태인 폼요소등의 UI 요소를 가리킴 - 입력할 수 있는 요소 :disabled - 활성화 상태인 폼요소등의 UI 요소를 가리킴 - 입력할 수 있는 요소 :checked - 선택된 상태인 라디오 버튼이나 체크박스를 가리킴 - 사용자가 선택했거나 문서의 기본값이 선택된 상태여도 가능 :indetermi-nate - 선택된 상태도, 선택되지 않은 상태도 아닌 라디오 버튼이나 체크박스 - 사용자 입력에 따른 상태가 아닌 DOM 스크립트를 통해서만 만들 수 있음 :default - 기본값으로 선택되어 있는 라디오버튼, 체크 박스 등 :vaiid - 사용자가 입력한 내용이 사용자 입력란에 정해진 기준을 모두 만족하는 상태 :invalid - 사용자가 입력한 내용이 사..

• 기본 매개변수 - 항상 같은 매개변수를 반복하는 경우 기본값을 지정하여 기본 매개변수를 사용 - 매개변수는 왼쪽부터 처리하므로 기본값을 사용하는 경우 후순위로 매개변수 나열 * 기본 문법 함수명(매개변수, 매개변수=기본값, 매개변수=기본값) {} function func(b, a = 1) { console.log(b, a); } func(5); // 5, 1 • 나머지 매개변수 : 매개변수의 개수가 가변일 경우 사용하는 문법 - 마침표 3개를 입력 - 매개변수들이 배열로 들어옴 * 기본 문법function 함수(...나머지 매개변수) {}function sample(...item) { return item } console.log(sample(1, 2,3)) // [ 1, 2, 3 ] • 나머지 매개..

일반함수 (선언적 함수):이름이 있는 함수재귀호출 시에도 사용 이름이 있는 함수의 경우에는 변수 선언 전이어도 호출이 가능 * 기본 문법function 함수() {}let 함수 = function(){} // 위와 동일한 기능function 함수() { console.log('함수');}console.log(typeof 함수); // function• Sources  * 숫자 계산 기본 문법function 함수(매개변수) { let output = 초깃값; 처리 return ouput}// = a부터 b까지의 합 function sumAll(a, b) { let output = 0; for (let i = a; i i) { output = item; } } return outpu..

for 문기본 문법for (초기화; 반복문 조건; 반복 처리구문) { 반복처리 내용}forEachfor, for..of와 달리 map(), filter() 등의 반환값을 그대로 루프처리 할 수 있음메서드설명배열.forEach()주어진 콜백함수를 활용하여 배열의 요소를 순서대로 처리([요소], [인덱스],[기존배열])=> {}요소, 인덱스, 기존 배열을 활용하여 처리- 콜백함수에서 인덱스와 기존배열 생략 가능const arr = ['a','b','c']arr.forEach((value, idx)=>{ console.log(value, idx);})sources// [ 짝수 출력]const arr = [1,2,3,4,5]arr.filter((value)=> value %2 ===0).forEach((valu..