Development/JavaScript (21) 썸네일형 리스트형 객체 (Object), 클래스 (Class), 인터페이스 (Interface) 객체 소프트웨어 세계에 구현할 대상 클래스에 선언된 모양 그대로 생성된 실체 클래스 객체를 만들어 내기 위한 설계도 혹은 틀 연관되어 있는 메소드와 변수의 집 인터페이스 일반적으로 타입 체크를 위해 사용되며 변수, 함수, 클래스에 사용할 수 있다. 인터페이스는 구현되지 않은 메서드만을 포함하며, 이를 구현하는 클래스는 인터페이스의 모든 메서드를 구현해야 한다. 이것은 일종의 계약에 빗대어 포현할 수 있다. 특정 인터페이스를 구현하는 클래스는 반드시 인터페이스에서 정의한 메서드를 모두 구현해야 한다. 따라서 여러 클래스에서 동일한 인터페이스를 구현하여 동일한 기능을 수행하도록 보장할 수 있다. 인터페이스는 상속을 통해 사용되며, 클래스가 여러 인터페이스를 구현할 수 있다. 인터페이스를 사용하면 다형성을 구.. JS기초_보충(실행 컨텍스트 간단 정리) 실행 컨텍스트란? 실행할 코드에 제공할 환경 정보들을 모아놓은 객체 호출 스택(Call Stack) 호출 스택이란 코드를 실행하는 순서를 담은 자료 구조이다. 코드를 후입선출(LIFO : Last In First Out)의 순서로 실행 시킨다. 실행 컨텍스트 구성요소 VariableEnvironment LexicalEnvironment ThisBindings VE와 LE의 구성 요소 record : 현재 실행 컨텍스트와 관련된 코드의 식별자 정보(hoisting) outer : 외부 환경 참조 정보 VE와 LE의 차이점 실행 컨텍스트 생성 시점에는 내용이 완전히 같지만, 이후 스냅샷 유지 여부가 다르다. VE는 실행 컨텍스트 생성 시점에 환경 정보를 스냅샷으로 그대로 담고 있지만 LE는 변경된 환경 정보.. JS기초_보충(VE와 LE) VE(VariableEnvironment)와 LE(LexicalEnvironment)의 개요 이 두가지에 담기는 항목은 완벽하게 동일하다. 스냅샷 유지 여부만 다르다. VE : 스냅샷을 유지한다 LE : 스냅샷을 유지하지 않는다. 실시간으로 변경사항을 계속 반영한다. 즉, 실행 컨텍스트를 생성할 때 VE에 정보를 먼저 담은 다음, 이를 그대로 복사해서 LE를 만들고 이후에는 주로 LE를 활용한다. 구성 요소 VE, LE 모두 동일하며 EnvironmentRecord와 OuterEvironmentReference로 구성 EnvironmentRecord (=record) 현재 컨텍스트와 관련된 코드의 식별자 정보들 저장 함수에 지정된 매개변수 식별자, 함수자체, var로 선언된 변수 식별자 등 OuterEv.. JS기초_보충(실행 컨텍스트) 실행 컨텍스트 자바스크립트의 실행 컨텍스트는 실행할 코드에 제공할 환경 정보들을 모아놓은 객체이다. 자바스크립트는 실행 컨텍스트가 활성화되는 시점에 다음을 수행한다. 선언된 변수 호이스팅 (hoisting) 외부 환경 정보를 구성 this 값을 설정 위와 같은 현상들 때문에 다른 언어와는 다른 자바스크립트만의 특징이 나타난다. 콜 스택 (Call Stack) 실행 컨텍스트를 이해하기 위해서 먼저 콜 스택에 대한 이해가 반드시 필요하다. 그 전에 스택에 대해 간단하게 짚고 넘어간다. 스택이란? 큐와는 반대 개념으로 마지막에 쌓인 것이 가장 먼저 나간다고 해서 LIFO(Last In, First Out)라고도 한다. 실행 컨텍스트란 실행할 코드에 제공할 환경 정보들을 모아놓은 객체이다. 동일 환경에 있는 코.. JS기초_보충(데이터 타입 심화) 데이터 타입의 종류 자바스크립트에서 값의 타입은 크게 기본형과 참조형으로 구분된다. 구분의 기준은 값의 저장 방식과 불변성 여부이다. 기본형과 참조형 데이터의 구분 기준 복제 방식 기본형 : 값이 담긴 주소 값을 복제 참조형 : 값이 담긴 주소값들로 이루어진 묶음을 가리키는 주소값을 복제 불변성의 여부 기본형 : 불변성을 가짐 참조형 : 불변성을 가지지 않음 메모리와 데이터 기본 개념 메모리와 데이터 비트 컴퓨터가 이해할 수 있는 가장 작은 단위 0과 1을 가지고 있는 메모리를 구성하기 위한 작은 조각 비트가 모여서 메모리를 구성 바이트 비트만 사용하여 데이터를 만드는 것은 한계가 있음 비트 8개를 묶어 새로운 단위인 바이트를 만듦 메모리 : 바이트(Byte) 단위로 구성 모든 데이터는 byte 단위의 .. JS 기초_보충(Map과 Set) Map과 Set JavaScript에서 객체(Object)와 배열(array)을 이용하면 다양한 프로그래밍을 할 수 있다. 하지만 객체와 배열만으로는 해결하기 어려운 상황이 존재한다. Map과 Set은 데이터의 구성, 검색 및 사용을 객체나 배열보다 효율적으로 처리할 수 있기 때문에 많이 각광받고 있다. 1. Map map은 객체와 유사한 형태를 가지고 있다. map은 key - value를 저장하며 객체와 달리 키로 사용할 수 있는 모든 유형을 사용할 수 있다. map은 키가 정렬된 순서로 저장되기 때문에, 추가한 순서대로 반복할 필요가 없다. map을 이용하면 다음과 같은 작업을 수행할 수 있다. key - value 추가 및 검색 (set) key - value 삭제 (delete) 모든 key -.. JS기초_보충(ES6 문법) 구조분해할당 (Destructuring) 배열이나 객체의 속성을 분해해서 그 값을 변수에 담을 수 있게 해주는 문법 배열의 경우 // 배열의 경우 let [value1, value2] = [1, "new"]; console.log(value1); // 1 console.log(value2); // "new" let arr = ["value1", "value2", "value3"]; let [a,b,c] = arr; console.log(a,b,c) // value1 value2 value3 // let [a,b,c] = arr; 은 아래와 동일! // let a = arr[0]; // let b = arr[1]; // let c = arr[2]; let [a,b,c,d] = arr console.log(.. JS 기초 _보충(객체, 배열) 객체 1. 생성자 함수를 사용한 객체 생성 function Person(name, age, gender) { this.name = name; this.age = age; this.gender = gender; } let person1 = new Person("홍길동", 30, "남자"); let person2 = new Person("홍길순", 25, "여자"); 위의 예제에서는 생성자 함수 Person()을 사용하여 객체 person1과 person2를 생성한다. 생성자 함수를 사용하면 객체를 일괄적으로 생성할 수 있다. 2. 객체 속성 접근 let person = { name: "홍길동", age: 30, gender: "남자" }; console.log(person.name); // "홍길동" co.. 이전 1 2 3 다음 목록 더보기
