본문 바로가기

분류 전체보기

 (121)
TIL: [JavaScript] this this의 정의 this : '이것'이라는 뜻. JavaScript 예약어다. this는? this는 자신이 속한 객체 또는 자신이 생성할 인스턴스를 가리키는 자기 참조 변수(self-reference variable)이다. this는 자바 스크립트 엔진에 의해 암묵적으로 생성된다. 하지만 this는 객체의 프로퍼티나 메서드를 참조하기 위한 자기 참조변수이므로 일반적으로 객체의 메서드 내부 또는 생성자 함수 내부에서만 의미가 있다. 함수를 호출하면 인자와 this가 암묵적으로 함수 내부에 전달된다. 함수 내부에서 인자를 지역 변수처럼 사용할 수 있는 것처럼, this도 지역 변수 처럼 사용할 수 있다. 단 this가 가리키는 값, 즉 this 바인딩은 함수 호출 방식에 의해 동적으로 결정된다. 크게 전역..
TIL: position 속성 CSS에서 position은 문서 상에 요소를 배치하는 방법을 지정한다. top, right, bottom, left 속성이 요소를 배치할 최종 위치를 결정한다. 시도해보기 position - CSS: Cascading Style Sheets | MDN CSS position 속성은 문서 상에 요소를 배치하는 방법을 지정합니다. top (en-US), right (en-US), bottom (en-US), left (en-US) 속성이 요소를 배치할 최종 위치를 결정합니다. developer.mozilla.org static 태그에 아무런 값도 주지 않아도 주어지는 기본값. 요소를 일반적인 문서의 흐름에 따라 배치한다. top, right, bottom, left, z-index가 아무런 영향도 미치지 ..
TIL: HTTP HTTP (Hypertext Transfer Protocol)는 클라이언트-서버 간 통신을 가능하게 하도록 설계되었다. HTTP는 클라이언트와 서버 간의 요청-응답 프로토콜로 작동한다. 예: 클라이언트(브라우저)가 서버에 HTTP 요청을 보낸다. 그런 다음 서버는 클라이언트에 응답을 반환한다. 응답에는 요청에 대한 상태 정보가 포함되며 요청된 콘텐츠도 포함될 수 있다. HTTP 메소드 GET POST PUT HEAD DELETE PATCH OPTIONS CONNECT TRACE 가장 일반적인 메소드는 GET, POST이다. GET GET은 지정된 리소스에서 데이터를 요청하는 데 사용된다. 쿼리 문자열(이름/값 쌍)은 GET 요청의 URL로 전송된다. /test/demo_form.php?name1=valu..
TIL: CSS margin 과 padding margin CSS는 element의 각 사이드에 대한 여백을 지정하는 속성이 있다. margin-top margin-right margin-bottom margin-left 모든 여백 속성은 다음 값을 가질 수 있다. auto - 브라우저가 여백을 계산한다. 길이 - 여백을 px, pt, cm 등으로 지정. % - 포함하는 요소 너비의 %로 여백을 지정한다. 상속 - 여백이 부모 요소에서 상속되어야 함을 지정한다. *tip: 음수 값이 허용된다. 코드를 줄이려면 하나의 속성에 모든 여백 속성을 지정할 수 있다. 작동 방식은 다음과 같다. margin 속성에 4개의 값이 있는 경우 p { margin: 25px 50px 75px 100px; } 상단 25px, 오른쪽 50px, 하단 75px, 왼쪽 10..
TIL: JavaScript Closer 클로저 클로저(closure)는 내부함수가 외부함수의 맥락(context)에 접근할 수 있는 것을 가르킨다. 클로저는 자바스크립트를 이용한 고난이도의 테크닉을 구사하는데 필수적인 개념으로 활용된다. function outter(){ function inner(){ var title = 'coding everybody'; alert(title); } inner(); } outter(); 결과는 alert으로 coding everybody가 출력된다. 위 예제에서 함수 outter 내부에 함수 inner가 정의 되어있음. 이를 내부 함수라고 한다. 내부함수는 외부함수의 지역변수에 접근 가능하다. function outter(){ var title = 'coding everybody'; //외부함수의 지역변수 fun..
TIL: 스코프 (Scope), var & let & const 스코프란? 식별자 접근 규칙에 따른 유효 범위 스코프의 정의는 "식별자 접근 규칙에 따른 유효 범위" 이다. 식별자(변수, 함수, 클래스)에 접근할 수 있는 범위가 존재한다. 범위는 중괄호(블록) 또는 함수에 의해 나누어지고 그 범위를 각각 Block Scope, Fucntion Scope 라고 부른다. 스코프의 주요 규칙 규칙1. 안쪽 스코프에서 바깥쪽 스코프로 접근할 수 있지만 반대는 불가능하다. 바깥 스코프에서 선언한 식별자는 안쪽 스코프에서 사용 가능하다. 반면, 안쪽에서 선언한 식별자는 바깥쪽 스코프에서는 사용할 수 없다. 규칙2. 스코프는 중첩이 가능하다. 스코프는 마치 중첩된 울타리와도 같다. 규칙3. 전역 스코프와 지역 스코프 가장 바깥쪽의 스코프를 전역 스코프(Global Scope)라고..
TIL: 호이스팅이란? 자바스크립트에서 호이스팅이란, 인터프리터가 변수와 함수의 메모리 공간을 선언 전에 미리 할당하는 것을 의미한다. var로 선언한 변수의 경우 호이스팅 시 undefined로 변수를 초기화 한다. let 이나 const로 선언한 변수의 경우 호이스팅시 변수를 초기화 하지 않는다. 호이스팅을 설명할 땐 주로 "변수의 선언과 초기화를 분리한 후, 선언만 코드의 최상단으로 옮기는" 것을 말함. 따라서 변수는 정의하는 코드보다 사용하는 코드가 앞서 등장할 수 있다. 하지만 선언과 초기화를 함께 수행하면 선언 코드까지 실행해야 변수가 초기화된 상태가 된다. function catName(name) { console.log("제 고양이의 이름은" + name + "입니다"); } catName("호랑이"); /* 결..
TIL: 브라우저의 렌더링 원리 홈페이지가 사용자에게 보여지는 순서 1. 주소창에 입력된 주소를 통해 서버를 찾아간다. 2. 입력한 주소의 정확한 주소를 DNS서버에서 ip주소로 변환하여 실제 서버를 찾는다. 3. 서버에서 HTML파일을 클라이언트로 보낸다. 4. HTML 문서는 파싱되어 DOM을 생성한다.(객체 형식) 5. 중간에 css, js스크립트를 다운받는 태그를 만나면 DOM생성을 중지하고 해당 자원들을 다운로드 한다. 5. 이렇게 만들어진 DOM, CSSOM을 변경하는 경우 리렌더링을 하게 된다. 자바 스크립트가 DOM, CSSOM을 변경하는 경우 리렌더링을 하게 된다. 리플로우 : 레이아웃 계산을 다시 하는 것 (Geko엔진에서 DOM 배치 단계) 리페인트 : 재결합된 렌더트리를 기반으로 다시 그림 그리는 것 script ..
반응형

티스토리툴바