JavaScript (5) 썸네일형 리스트형 [JS] class vs 생성자 함수 (feat:객체 생성) - 객체 생성 방법 1. 객체 리터럴 방법 : 내부적으로 obj.__proto__ === Object.prototypeconst obj = { name: "Alice", age: 25,}; 2. new Object() 생성자 사용 :객체 리터럴이랑 동일한 결과임const obj = new Object();obj.name = "Alice"; 3. 생성자 함수function Person(name) { this.name = name;}const p = new Person("Alice"); 4.class 로 만들기 class Person { constructor(name) { this.name = name; }}const p = new Person("Alice"); 5. object.rea.. Tailwind CSS의 JIT 컴파일러란? tailwindcss 가 버전 3부터 해서 컴파일 방식이 바뀌었다. 이전에는 모든 설정이 다 들어가있는 어느정도는 큰 파일이였다. 그래서 거기중에 골라서 사용을 하는느낌이였다면 이제는 사용하는 클래스만 생성을 하기때문에 파일 크기가 매우 작아졌다. 실시간 클래스 생성사용하는 클래스만 생성파일 크기가 매우 작아짐이를 지원하는 번들러의 도움이 필수적임기존 방식과의 차이/* 기존 방식: 모든 가능한 클래스를 미리 생성 */.w-1 { width: 0.25rem; }.w-2 { width: 0.5rem; }/* ... 수천 개의 클래스 *//* JIT: 실제 사용하는 클래스만 생성 */.w-[762px] { width: 762px; }장점빌드 시간 단축파일 크기 감소임의의 값 사용 가능개발 경험 향상 리액트 훅(hook) 1.useRef - useEffect와 다르게 useRef 같은 경우에는 렌더링이 되지 않으며 안에 값들이 유지된다. 그래서 값을 저장하는 공간으로 사용가능하다. - dom을 가리킬때 사용된다. 사용할 상황: 어떤한 값이 변화는지에 대해 가지고있어야되지만 렌더링이 값이 변화할때마다 안되게 하고싶을 때 사용하면 좋을 거 같다. 자바스크립트 내부 동작 스레드 - 자바스크립트는 단일 스레드로 되어있다. - 동기식 언어인다. 실행 컨텍스트( Execute Context) 실행 컨텍스트의 종류 - 3가지 실행 컨텍스트는 변수 함수선언 매개변수 등의 정보를 담고 있으며, 코드의 실행에 필요한 여러 가지 동작을 제공한다. 모든 코드는 실행 컨텍스트를 통해 실행되고 관리된다. 실행 컨텍스트의 원칙( zerocho.com 참고) 먼저 전역 컨텍스트 하나 생성 후, 함수 호출 시마다 컨텍스트가 생깁니다. 컨텍스트 생성 시 컨텍스트 안에 변수객체(arguments, variable), scope chain, this가 생성됩니다. 컨텍스트 생성 후 함수가 실행되는데, 사용되는 변수들은 변수 객체 안에서 값을 찾고, 없다면 스코프 체인을 따라 올라가며 찾습니다. 함수 .. nodejs vs spring Node.js - 자바스크립트 기반의 런타임 환경 - 이벤트 기반 및 비동기 방식으로 작동 - nodejs는 빠른 처리 속도와 확장성이 뛰어나며 대용량 데이터를 처리하기 적합 - 대부분의 nodejs 패키지는 오픈소스로 제공되며 간단한 api로 빠르게 개발 할 수있음 장점: - 비동기 및 이벤트 기반 프로그래밍 모델로 인해 대규모 i/o 작업에 최적화되어있다. - 자바스크립트 기반으로 개발하기 때문에 프론트 백엔드 모두에서 사용할 수 있다. - 높으 처리 속도와 확장성을 가지고있다. - 오픈소스 생태계가 풍부하여 다양한 패키지와 라이브러리가 제공된다. 단점: - 실시간 작업에 적합하지 않을 수 있다. - 메모리 누수와 콜백 지옥 같은 문제가 발생할 수 있다. - 싱글 스레드로 동작하므로 cpu가 많은 작.. 이전 1 다음
