📌 CSS의 구성요소 선택자 { 속성 : 속성값; } 선택자: 디자인을 적용할 HTML 영역 속성: 어떤 디자인을 적용할지 정의 속성값: 어떤 역할을 수행할지 구체적으로 명령 📌 CSS 속성 /* 예시 */ h1 { font-size: 20px; /* 폰트 사이즈 */ font-family: sans-serif; /* 글꼴 */ color: blue; /* 폰트 색상 */ background-color: yellow; /* 배경색 */ text-align: center; /* 텍스트 정렬 */ } 📌 CSS 연동 방법 1. Inline Style Sheet: 태그 안에 직접 원하는 스타일 적용 coding 101 2. Internal Style Sheet: 2. Class Selector: 클래스 이름으..
📌 웹을 구성하는 요소 📌 웹 제작 시 고려 사항 웹 표준: 웹사이트를 작성할 때 따라야 하는 공식 표준이나 기술 규격 웹 접근성: 장애의 여부와 상관 없이 모두가 웹사이트를 이용할 수 있게 하는 방식 크로스 브라우징: 모든 브라우저 또는 기기에서 사이트가 제대로 작동하도록 하는 기법 📌 HTML 기본 태그 1. 태그: 정보성을 갖고 있는 이미지를 삽입 (닫힌 태그 X) alt 속성: 웹사이트가 이미지를 출력하지 못했을 경우, 텍스트 정보로 대체 2. 태그: heading의 약자로 제목이나 부제목을 표현 태그는 가장 중요한 정보를 담으므로, 하나의 html 문서에서 한 번만 사용됨 3. 태그: paragraph의 약자로 본문 내용을 표현 Nice to meet you 4. 태그: unordered lis..
Object.keys(obj).includes(key) var obj = {'a': 1, 'b': 2, 'c': 3}; console.log(Object.keys(obj).includes('a')); // true console.log(Object.keys(obj).includes('abc')); // false key in obj var obj = {'a': 1, 'b': 2, 'c': 3}; console.log('a' in obj); // true console.log('abc' in obj); // false
isNaN(value) : 매개변수가 숫자가 아니면 true, 숫자이면 false를 리턴 console.log(isNaN(12.12)); // false console.log(isNaN('12.12')); // false (따옴표로 감쌌지만 숫자로 취급하여 false 리턴) console.log(isNaN(12 * 12)); // false console.log(isNaN('12 * 12')); // true
Set 생성 : 자바스크립트에서 Set는 클래스이므로 new 키워드와 생성자를 사용하여 생성한다. var set = new Set(); // Set(0) {size : 0} var numSet = new Set([1,2,3]); // Set(3) {1,2,3} set.add(value) : 세트에 새로운 값을 추가한다. set.add(1); // Set(1) {1} set.add("A"); // Set(2) {1, 'A'} set.add(true); // Set(3) {1, 'A', true} set.delete(value) : 세트에 특정 값을 삭제한다. // set = Set(3) {1, 'A', true} 일 때, set.delete(1); // 세트에 1이 있어서 값을 삭제할 수 있으므로 삭제 후..
map()함수 활용하여 1~9의 숫자를 요소로 갖는 배열 초기화하기 var array = Array(9).fill().map((element, index) => { return index + 1; }); console.log(array); // [1,2,3,4,5,6,7,8,9]
배열.reduce(function(accumulator, currentValue, index, array), initialValue) : reduce() 함수는 배열의 요소를 순차적으로 순회하면서, reducer 함수를 실행하고 하나의 결과값을 반환한다. 배열 요소의 순회는 initialValue의 설정 유무에 따라 순회를 시작하는 index 1부터 시작할수도 있고 index 1부터 시작할수도 있다. 주로 배열 요소의 합계를 계산하는데 사용되며, 배열 또는 객체로 반환할수도 있다. accumulator(필수) : 누적되는 값. callback 함수의 반환값을 누적 - initialValue가 있을 경우 : callback의 최초 호출 시 initialValue 값으로 초기화. - intialValue가 ..
map() : 콜백 함수에서 리턴한 값들을 기반으로 새로운 배열을 만드는 함수 var array = [1,2,3,4,5]; newArray = array.map((element, i) => { return element * 2; }); console.log(array); // [1,2,3,4,5] (기존 배열은 그대로) console.log(newArray); // [2,4,6,8,10] (콜백 함수에서 리턴한 값들을 기반으로 새로운 배열을 만듦) ex) map()을 통해 배열 [1,2,3,4,,,9]을 만들어보자 / forEach(), map()의 장점 : 함수를 연달아 사용할 수 있다. Array(9) // 길이 9 짜리 빈 배열 생성 ([empth x 9]) Array(9).fill() // 길이 ..
