본문 바로가기
728x90

분류 전체보기115

Directive - Structual directive, 구조 디렉티브 Structural Directive Directive - Attribute directive - Structural directive 디렉티브는 굉장히 자주 보는 문법인데 사실 정리가 잘 안되면 그냥 잘 모른 체 지나가기 쉽다 이 기회에 Structural directive에 대해 정리해보자 Structural Directive Structural directives are directives which change the DOM layout by adding and removing DOM elements. 구조 디렉티브는 DOM 요소를 동적으로 보여줄지 말지 결정할 수 있는 문법 도구라 할 수 있다. Built-in structural directive: NgIf, NgForOf, NgSwitch S.. 2023. 3. 5.
폴리필, 바벨, 웹팩 정의와 차이 폴리필, 바벨, 웹팩 정의와 차이 바벨(babel) 트랜스파일러(transpiler). 브라우저가 ES6 문법을 이해하지 못하기 때문에 하위 브라우저가 지원하는 ES5이하 문법(syntax, feature)으로 변경 - ex) const -> var로 변경, arrow function -> function expression으로 변경 - core-js: babel 내부의 library. ES6 이후 문법들을 폴리필 처리한다. - 바벨 프리셋: 함께 사용되어야 하는 babel 플러그인을 모아둔 것. @babel/preset-env 폴리필(polyfill) 오래된 브라우저에서 지원하지 않는 APIs(missing APIs)를 지원해주는 역할 - fetch APIs, Promises, Map and Set, .. 2023. 2. 12.
[자료구조] Hash, Hashing, Hash Table(해시, 해싱, 해시 테이블) [자료구조] Hash, Hashing, Hash Table(해시, 해싱, 해시 테이블) 해시 사전적 의미 : 잘게 썲 임의의 크기를 가진 데이터 key를 고정된 크기의 데이터 value로 변화시켜 저장하는 것이다. 키에 대한 해시값을 사용하여 값을 저장하고 key-value 쌍의 개수에 따라 동적으로 크기가 증가하는 연관배열이다. key에 대한 해시값을 구하는 과정을 hashing(해싱)이라고 하며, 이때 사용하는 함수(알고리즘)를 해시함수라 한다. 해시값 자체를 index로 사용하기 때문에 평균 시간복잡도가 O(1)로 매우 빠르다. 직접 주소 테이블(Direct Address Table) 입력받은 value가 곧 key가 되는 데이터 매핑 방식이다. 이렇게 직접 주소 테이블은 값에 접근하기는 편하지만,.. 2022. 1. 23.
[Javascript] 실행 컨텍스트(Execution Context) [Javascript] 실행 컨텍스트(Execution Context) 실행 컨텍스트 실행 컨텍스트는 코드를 실행하기 위해 필요한 환경(객체)이다. 실행 컨텍스트(Execution Context)는 scope, hoisting, this, function, closure 등의 동작원리를 담고 있는 자바스크립트의 핵심원리이다. 여기서는 실행 컨텍스트 안에 있는 Record와 Outer만 고려하기로 하자. 먼저 자바스크립트 엔진이 실행 컨텍스트를 생성하고 제거하는지는 아래와 같다. 제일 처음에는 전역 실행 컨텍스트가 실행되며, 함수를 호출할 경우 그 함수의 실행 컨텍스트를 생성해서 콜 스택에 담는다. 콜스택에서는 가장 최근에 추가된 실행 컨텍스트만 활성화 된다. 전역에 있는 코드가 마지막 라인까지 모두 실행.. 2022. 1. 18.
[Javascript] 데이터 타입_원시(Prototype) 데이터 타입과 객체 데이터 타입 [Javascript] 데이터 타입_원시(Prototype) 데이터 타입과 객체 데이터 타입 데이터 타입 데이터 타입은 크게 객체와 객체가 아닌 것으로 나눌 수 있다. 원시(기본) 데이터 타입 숫자 문자열 불리언 (true/false) null undefined 객체(참조) 데이터 타입 명시적으로 객체 데이터 타입이라 잘 얘기하진 않지만.. 원시 데이터 타입과 반대되는 개념이다. 아래의 예에서 str은 문자열임에도 객체와 같이 적용되었다. str.length의 '.' 점은 Object Acess Operator이다. 즉 점 앞에 객체가 있다는 얘기다. var str = 'coding'; // str = new String('coding'); console.log(str.length); // 6 conso.. 2022. 1. 16.
[Javascript] Arrow function는 뭐? 왜 쓰는데? [Javascript] Arrow function는 뭐? 왜 쓰는데? Arrow function의 특징 Arrow function에는 기존 function과 다르게 3가지가 다르다. 함수 이름이 없다. this가 선언시 정적으로 결정된다. arguments 가 없다. 1. 함수 이름이 없다. 함수 선언 방법 function myFunc() {} // 함수 이름 지정 const myFunc = function() {} // 변수에 할당 // Arrow function const myFunc = () => {} // 변수에 할당 2. this가 선언시 정적으로 결정된다. 일반 함수에서 this는 호출시 동적으로 결정되었다. 하지만 arrow function에서 this는 선언시 정적으로 결정된다. 이 때 .. 2022. 1. 16.
728x90

티스토리툴바