본문 바로가기

Javascript7

this this 키워드 this는 자신이 속한 객체 또는 자신이 생성할 인스턴스를 가리키는 자기 참조 변수다. this를 통해 자신이 속한 객체 또는 자신이 생성할 인스턴스의 프로퍼티나 메서드를 참조할 수 있다. this는 자바스크립트 엔진에 의해 암묵적으로 생성되며, 코드 어디서든 참조할 수 있다. 함수를 호출하면 arguments와 this가 함수 내부에 전달되는데 둘 다 지역 변수처럼 사용할 수 있다. 단, this가 가리키는 값, 즉 this 바인딩은 함수 호출 방식에 의해 동적으로 결정된다. 바인딩이란 식별자와 값을 연결하는 과정을 의미한다. this 바인딩은 this(키워드로 분류되지만 식별자 역할을 한다)와 this가 가리킬 객체를 바인딩하는 것이다. 전역에서 this는 전역 객체 window를 가.. 2022. 11. 16.
브라우저의 렌더링 과정 브라우저의 렌더링 과정 HTML, CSS, JS, 이미지, 폰트 파일 등 렌더링에 필요한 리소스를 요청하고 서버로부터 응답을 받는다. 브라우저의 렌더링 엔진은 서버로부터 응답된 HTML과 CSS를 파싱하여 DOM과 CSSOM을 생성하고 결합해서 렌더 트리를 생성한다. 브라우저의 자바스크립트 엔진은 서버로부터 응답된 자바스크립트를 파싱하여 AST(Abstract Syntax Tree)를 생성하고 바이트코드로 변환하여 실행한다. 이때 자바스크립트는 DOM API를 통해 DOM이나 CSSOM을 변경할 수 있다. 변경된 DOM과 CSSOM은 다시 렌더 트리로 결합된다. 렌더 트리를 기반으로 HTML 요소의 레이아웃을 계산하고 브라우저 화면에 HTML 요소를 페인팅한다. 요청과 응답 브라우저의 핵심 기능은 필요한.. 2022. 11. 16.
Element.setAttribute(), Element.getAttribute(), Element.removeAttribute() Element.setAttribute() Element의 속성 값을 지정된 이름과 값으로 설정한다. 속성이 이미 있는 경우 값이 업데이트된다. Element.setAttribute(name, value); Element.getAttribute() Element의 지정된 이름의 속성 값을 반환한다. 존재하지 않는 속성 이름을 입력하면 null을 반환한다. Element.getAttribute(name); Element.removeAttribute() Element의 지정된 이름의 속성 값을 제거한다. Element.removeAttribute(name); Prev Next 2022. 11. 8.
데이터 타입 데이터 타입 자바스크립트는 7개의 데이터 타입을 제공하며, 원시 타입(primitive)과 객체 타입(object/reference) 타입으로 구분된다. 데이터 타입에 따라 확보해야하는 메모리 공간의 크기와 메모리에 저장되는 2진수가 다르며 읽어들여 해석하는 방식도 다르다. primitive type number 정수와 실수 구분 없이 하나의 숫자 타입만 존재 string 문자열 boolean 논리적 ture와 false undefined var 키워드로 선언된 변수에 암묵적으로 할당되는 값 null 값이 없다는 것을 의도적으로 명시할 때 사용하는 값 symbol ES6에서 추가된 7번째 타입 object type 객체, 함수, 배열 등 Number 숫자 타입의 값은 배정밀도 64비트 부동소수점 형식을 .. 2022. 11. 7.
변수 변수 변수는 값을 저장하기 위해 확보한 메모리 공간을 식별하기 위해 붙인 이름이다. 변수에 값을 저장하는 것을 할당, 변수에 저장된 값을 읽어 들이는 것을 참조라고 한다. 변수 선언 변수 선언이란 값을 저장하기 위한 메모리 공간을 확보하고 변수 이름과 확보된 메모리 공간의 주소를 연결해서 값을 저장할 수 있게 준비하는 것이다. 변수를 선언할 때는 var, let, const 키워드를 사용한다. ES6에서 let과 const가 도입되기 전까지는 var이 변수를 선언할 수 있는 유일한 키워드였지만 var은 여러 단점이 있기 때문에 현재는 let과 const를 사용하는 것을 권장한다. var color; let name; const age; // 쉼표를 이용해 하나의 문에서 여러 개를 한번에 선언할 수 있지만.. 2022. 11. 3.
식별자 식별자 식별자는 어떤 값을 구별해서 식별할 수 있는 고유한 이름, 메모리 주소에 붙인 이름을 말한다. 식별자는 메모리 공간에 저장되어 있는 값을 구별해서 식별해 낼 수 있어야하기 때문에 값이 저장되어 있는 메모리 주소를 기억하고 메모리 주소와 매핑 관계를 맺으며, 매핑 정보도 메모리에 저장된다. 식별자는 매핑되어 있는 메모리의 주소를 통해 메모리 공간에 저장된 값에 접근할 수 있다. 변수, 함수, 클래스 등 메모리상에 존재하는 어떠한 값을 식별할 수 있는 이름은 모두 식별자라고 부른다. 식별자의 네이밍 규칙 특수문자를 제외한 문자, 숫자, _, $를 포함할 수 있다. 특수문자를 제외한 문자, _, $로 시작할 수 있으며 숫자로는 시작할 수 없다. 예약어는 사용할 수 없다. let id, $name, ca.. 2022. 11. 1.
728x90