Program_Language/JavaScript

[JavaScript] 고차함수(Higher-Order Function)

고차함수 목표 first-class citizen의 세 가지 특징 higher-order functiond의 이해 내장 고차함수에 대한 이해 forEach find filter map reduce sort some every 추상화(Abstraction)에 대한 이해 추상화 관점에서 고차 함수가 갖는 이점 First-class citizen JS에서는 특별한 대우를 받는 first-class citizen가 있습니다. 이 중 하나가 데이터를 다루듯이 사용할 수 있는 함수 입니다. 따라서 함수는 변수에 저장할 수 있습니다. console.log(a(2)); const a = function (num) { return num * 2; } /* * 오류가 발생 - 변수에 함수를 할당한 경우 Hoisting이 ..

[JavaScript] DOM(Document Object Model) 주요 정리

DOM(Document Object Model) DOM(Document Object Model)은 웹 페이지에 대한 인터페이스로, HTML 문서를 Object 기반으로 표현합니다. HTML Elements를 JavaScript Object처럼 Manipulation(조작)할 수 있는 모델로, HTML을 조작할 수 있습니다. 단, DOM은 JS를 이용해서 구조 접근을 하는 것이지 JS 자체는 아닙니다. HTML에 JS 적용 HTML에서 JS를 적용하기 위해서는 웹브라우저에서 작성된 HTML을 해석할 때 요소를 만나면 잠시 해석을 멈추고 요소를 먼저 실행하게 됩니다. 따라서, 요소의 추가하는 위치마다 다른 결과를 가져오기 때문에, 최하단에 위치시킵니다. 그러나 이는 js에 너무 의존적일 수 있습니다. 그래서..

[JavaScript를 들어가기 전] Selector와 Layout

Selector와 Layout Selector 해당 element 선택 /* element {...} */ div {...} 전체 element 선택 /* * {...} */ * {...} class와 id 선택 /* class는 .class, id는 #id로 선택 */ .people {...} #man {...} AND 선택 /* class와 id를 만족하는 선택은 붙여서(and) */ #man.people {...} OR 선택 /* ',' - 다중 선택(or) */ h1, div {...} 여러 element 선택 /* '띄어쓰기' - parent element 중 descendants(자손) element 선택 */ div p {...} /* div의 자손 p eleme..

[JavaScript를 들어가기 전] HTML 및 CSS 기초 정리

웹 개발 기초 웹페이지의 구조와 내용을 담당하는 HTML HTML은 HyperText Markup Language의 약자로 개발 언어가 아닌 웹 페이지의 뼈대가 되는 마크업 언어입니다. 뼈대가 되는 HTML에 CSS와 JavaScript를 적용하여 원하는 웹페이지를 꾸미고, 동작할 수 있습니다. 기본적으로 HTML은 tag(ex. )의 집합이며, 트리 구조를 갖습니다. 주요 HTML 요소 Division - 기본적으로 한줄의 공간을 차지함 Span - 기본적으로 내용만큼만 공간을 차지함 Link - 기본적으로 현재 창에서 해당 링크로 열기(Target 속성) Unordered List List Item Button 스타일을 담당하는 CSS CSS는 Cascading Style Sheets의 약자이며, 외..