전체 글
-
[Javascript] 함수에서 여러 값을 받고 싶다면problems 2020. 4. 18. 16:26
배열 또는 객체를 출력합니다. Array function returnArr(){ return ['Hello', 'world!'] } let words = returnArr()// ['Hello', 'world!'] console.log(words[0] + ' ' + words[1]) // Hello world! Object function returnObj(){ let obj = {first: Steve, last: Jobs} return obj } let name = {} name = returnObj()// {first: Steve, last: Jobs} console.log(name.first + ' ' + name.last) // Steve Jobs
-
(loading)thisJavascript 2020. 4. 15. 17:25
this this 키워드는 어떠한 객체를 가르킵니다. 객체를 가르키는 기준을 무엇일까요? 5 Patterns of Binding 'this' Global scope Function Invocation Method Invocation Construction mode [call, apply, bind] Global scope: window function 호출: window //Global & function invocation var name = 'Global Variable';// === window.name console.log(this.name); function foo() { console.log(this.name);// this === window } foo(); function outer() {..
-
미정의 매개변수를 배열로 받는 나머지 매개변수 (Rest parameter)Javascript 2020. 4. 12. 18:23
Rest parameter 나머지 매개변수는 정해지지 않은 수(an indefinite number, 부정수)를 배열로 나타냅니다. function restFuc(a, b, ...theArgs) { // ... } 함수의 마지막 파라미터 앞에 ... 을 붙여서 모든 나머지 인수를 배열로 대체합니다. 마지막 파라미터만 "Rest 파라미터"가 될 수 있습니다. function restFuc(a, b, ...theArgs) { console.log("one", a) console.log("two", b) console.log("rest", theArgs) } restFnc(1, 2, 3, 4, 5) //console //one, 1 //two, 2 //rest, [3, 4, 5] rest 파라미터는 Array..
-
문서 객체 모델 (Document Object Model / DOM )HTML & CSS 2020. 4. 9. 01:18
문서 객체 모델(DOM)이란? DOM은 HTML 문서의 프로그래밍 interface입니다. 문서의 구조화된 표현을 제공하며 또한, 프로그래밍 언어가 DOM 구조에 접근하는 방법을 제공하고 그들이 문서구조, 스타일, 내용 들을 변경할 수 있게 돕습니다. DOM은 구조화된 nodes와 property와 method를 가지고 있는 object로 문서를 표현합니다. 이들은 웹 페이지를 스크립트 또는 프로그래밍 언어들에서 사용될 수 있게 연결 시켜주는 역할을 담당합니다. HTML 문서의 구조와 관계가 객체(Object)로 표현됩니다. HTML 하나의 엘리먼트 자식 엘리먼트입니다. 자식 엘리먼트입니다. JavaScript { tagName: 'DIV', id: 'example', classList: ['highli..
-
레이아웃 (Layout)HTML & CSS 2020. 4. 7. 13:09
기본적으로 요소는 왼쪽 상단의 좌표가 (0, 0)이 되고, 픽셀 단위나 퍼센트 단위 등을 사용하여 위에서 아래로, 왼쪽에서 오른쪽으로 확장합니다. Box Mobel 크기의 속성은 외부여백(margin), 경계선(border), 내부여백(padding)으로 나뉩니다. box-sizing 기준에 따라서 크기가 다를 수 있기에 box-sizing으로 기준을 정해주어야 합니다. content-box (컨텐츠 기준) / border-box (경계선 기준) positioning & layout static: 기본값 relative: 기본값 + 상대적인 위치 fixed: 브라우저 화면의 좌상단을 기준으로 절대적인 위치 absolute: 부모 중 기준점이 있는 경우, 그 기준으로 절대적인 위치 sticky: 기본적으로..